封面

获取多说和 Disqus 文章评论数的方法

前言

不少网站使用的是多说等第三方评论系统,有时候需要在特定位置显示对应文章的评论数,下面的方法可以快速获取多说和 Disqus 的文章评论数,所得为纯数字,方便排版布局。

多说

多说提供了获取文章评论数的接口,需要做的只是填好相关参数,然后再从返回的 JSON 数据中提取出评论数即可

请求参数

  • short_name: 站点注册的多说二级域名,比如注册了 http://helloworld.duoshuo.com/, 则对应二级域名为 helloworld;
  • threads: 文章的 thread-key, 与评论框中 data-thread-key 一致。

返回数据示例

{
"response": {
"about/index.html": {
"thread_id": "6205475504969401090",
"channel_key": null,
"thread_key": "about/index.html",
"reposts": 0,
"views": 0,
"likes": 8,
"dislikes": 0,
"comments": 187
}
},
"options": {
"comments_zero": "暂无评论",
"comments_one": "1条评论",
"comments_multiple": "{num}条评论"
},
"code": 0
}

数据提取

  • 需要的只是评论数 comments,这里使用 jQuery 的 getJSON 比较方便
$(function() {
var shortName = "moxfive";
var threads = "about/index.html";

var jsonUrl = "http://api.duoshuo.com/threads/counts.jsonp?short_name=" + shortName + "&threads=" + threads + "&callback=?";
$.getJSON(jsonUrl, function(result) {
$.each(result.response, function(i, field) {
var value = field.comments;
$(".duoshuo-count").text(value);
})
})
})
  • 获得的值会显示在匹配的区域中
<span class="disqus-count"></span>

Disqus

加载相关 JS

  • 域名中填入自己的 Disqus shortname,获取方式参考 官方文档
<script id="dsq-count-scr" src="//<shortname>.disqus.com/count.js" async></script>

<!-- e.g. -->
<script id="dsq-count-scr" src="//moxfive.disqus.com/count.js" async></script>

显示评论数

  • 这里介绍两种借助特定 Class 显示评论数的方法
<!-- 通过 `data-disqus-identifier` -->
<span class="disqus-comment-count" data-disqus-identifier="about/index.html"></span>


<!-- 通过 `data-disqus-url` -->
<span class="disqus-comment-count" data-disqus-url="http://MOxFIVE.xyz/about/index.html"></span>
  • identifierurl 的值如果不清楚,可以自行设置,方法参考 官方文档
  • 获取的评论数不正确,很可能是因为远程数据没更新,等等就好。

提取纯数字

  • 上面方法显示的评论数是类似 1 Comment 这样的格式,这里可以把它转为纯数字格式 1
  • 使用 jQuery 绑定事件,当评论数信息显示时去掉非数字字符即可
var $disqusCount = $(".disqus-comment-count");
$disqusCount.bind("DOMNodeInserted", function(e) {
var num = $(this).text().replace(/[^0-9]/ig,"");
$(this).text(num)
})

相关链接

  1. 多说官方文档: 获取文章评论、转发数
  2. 多说官方文档: 代码显示【文章评论数】方法
  3. Disqus Help: Adding comment count links to your home page
文章目录
  1. 1. 前言
    1. 1.1. 多说
      1. 1.1.1. 请求参数
      2. 1.1.2. 返回数据示例
      3. 1.1.3. 数据提取
    2. 1.2. Disqus
      1. 1.2.1. 加载相关 JS
      2. 1.2.2. 显示评论数
      3. 1.2.3. 提取纯数字
    3. 1.3. 相关链接


twitter分享


如果想及时收到回复,可在 订阅中心Participating中勾选Email

Fork me on GitHub