javascript - 将 disqus 添加到 meteor.js 项目

Question

我正在尝试将 disqus 评论系统添加到我的应用程序中。我按照本文中的说明进行操作 KLICK

我创建了一个名为 disqus.html 的模板

 <template name="disqus">
  {{#isolate}}
    <div id="disqus_thread"></div>
    <noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
    <a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>  
  {{/isolate}}
 </template>

如果呈现此模板，embed.js 应该加载一次并且 disqus 进行重置。

Template.disqus.rendered = function() {  
  Session.set("loadDisqus", true);

  return typeof DISQUS !== "undefined" && DISQUS !== null ? DISQUS.reset({
    reload: true,
    config: function() {}
  }) : void 0;
};

在 deps.autorun 中响应 session 变化

Meteor.startup (function () {
  Deps.autorun(function() {
    if(Session.get("loadDisqus") && !window.DISQUS) {
      var disqus_shortname = '<example>'; // required: replace example with your forum shortname

    (function() {
    var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();      

    }
  });
});

这在 Firefox 25.0.1 中工作正常。我可以登录、注销和创建评论。但它不适用于 Chrome 31.0.1650.57 m。我无法登录。不会抛出任何错误。我能做些什么？有什么建议吗？

甚至在 discovermeteor.com/... 中登录 disqus|对我来说是不可能的。

Answer 1

在这里使用 session 很有趣但没有必要。这是我可能会在您的 disqus.js 文件中执行的操作:

var isDisqusLoaded = false,
  myScriptLoader = function funcMyScriptLoader(jsEl, callback) {
    if (window.attachEvent) {
      // for IE (sometimes it doesn't send loaded event but only complete)
      jsEl.onreadystatechange = function funcOnReadyStateChange() {
        if (jsEl.readyState === 'complete') {
          jsEl.onreadystatechange = "";
        } else if (jsEl.readyState === 'loaded') {
          jsEl.onreadystatechange = "";
        }

        if (typeof callback === 'function') {
          callback();
        }
      };
    } else {
      // most browsers
      jsEl.onload = function funcOnLoad () {
        if (typeof callback === 'function') {
          callback();
        }
      };
    }
  };

Template.disqus.rendered = function funcTplDisqusRendered() {
  if (!isDisqusLoaded) {
    var myElJs = document.createElement('script'),
      s = document.getElementsByTagName('script')[0];
    myElJs.type = 'text/javascript';
    myElJs.async = true;
    myElJs.src = '//' + disqus_shortname + '.disqus.com/embed.js';

    myScriptLoader(myElJs, function funcEventLoaded() {
      isDisqusLoaded = true;
    });

    s.parentNode.insertBefore(myElJs, s);
  }
};

使用该脚本，您将不需要使用 Deps.autorun 和 Session。您应该只在想要获得实时性的地方使用这种功能，但如果不需要它，请避免使用它，因为它会降低您的应用性能。

如果确实需要，您可以添加 Disqus.reset，但我不确定，请查看 disqus 文档。

我没有测试脚本，但应该没问题。