How to Use Meteor.js Routing With Disqus
On most sites, using Disqus as the commenting system is as simple as copying the Universal Code (also known as
embed.js might lead to stale Disqus threads or function incorrectly as pages are re-rendered.
This article explains how to integrate Disqus with Meteor.js (version 0.6.4.1 at the time of writing). If you want one Disqus thread for each route, copying the Universal Code won’t ensure that Disqus loads the correct thread for each page. Instead, the comments will either fail to load or retrieve a stale thread.
embed.js is loaded multiple times (when pages rerender and run the script multiple times), the following error will appear in the console:
DISQUS assertion failed: Unsafe attempt to redefine existing module <name>
Note: I’m using Meteor Router to create URL paths in my application, although this method should work with any routing system.
Disqus Single Sign-on
As a bonus, I’ve added the optional code snippet in
With the code below, all you have to do is add the following to your Meteor Handlebars template to include Disqus comments:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17
- Wait until the first time a Disqus thread needs to be loaded.
div #disqus_threadhas been rendered, load
embed.jsinto the page.
- Set a global flag to ensure that
embed.jsis not loaded again.
- Each time a new Disqus thread is needed, trigger a
DISQUS.reset(), including the first time
embed.jsis loaded. Again, make sure that
div #disqus_threadis rendered in the DOM, or there may be an error about appending an element to