如何通过Facebook JS SDK客户端获取v2.9+评论插件计数？

好问题！这个场景确实挺棘手的——既要用客户端JS SDK获取Facebook评论插件的计数，又不能把敏感的应用令牌暴露在前端，我来给你梳理几个靠谱的解决方案：

从Graph API v2.9开始，engagement端点必须携带访问令牌才能调用，而应用令牌（app_id|app_secret）绝对不能放在前端代码里——一旦泄露，别人就能用你的应用权限做各种操作，风险极高。

所以最稳妥的方式是自己搭一个轻量的后端接口，流程大概是这样：

• 前端通过fetch或者AJAX把需要获取评论计数的网页URL传给你的后端接口
• 后端用你的应用令牌调用Facebook的engagement端点，请求格式大概是：

  GET https://graph.facebook.com/v18.0/?id={目标网页URL}&fields=engagement&access_token={你的应用令牌}
  

• 后端解析返回的JSON数据，提取出评论计数（在engagement.comment_count字段里），再把这个数值返回给前端
• 前端拿到数据后，就可以自由渲染到页面上了

这种方式完全隔离了敏感令牌，安全性和稳定性都拉满，是生产环境的首选。

如果你只需要获取当前页面的评论计数，其实可以借助Facebook评论插件自带的渲染回调来间接拿到数据，不需要直接调用Graph API：

当你初始化JS SDK时，可以监听xfbml.render事件，这个事件会在所有Facebook插件（包括评论插件）渲染完成后触发。之后你可以通过插件的DOM属性获取计数，示例代码如下：

window.fbAsyncInit = function() {
  FB.init({
    appId      : '你的APP ID',
    xfbml      : true,
    version    : 'v18.0'
  });

  // 监听所有FB插件渲染完成
  FB.Event.subscribe('xfbml.render', function() {
    // 找到页面上的评论插件元素
    const commentWidget = document.querySelector('.fb-comments');
    if (commentWidget) {
      // 从插件的data属性里获取评论计数
      const commentCount = commentWidget.getAttribute('data-comment-count');
      if (commentCount) {
        console.log('当前页面评论数:', commentCount);
        // 在这里把计数插入到页面的指定位置
        document.getElementById('comment-count-display').textContent = commentCount;
      }
    }
  });
};

// 加载Facebook JS SDK
(function(d, s, id){
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {return;}
  js = d.createElement(s); js.id = id;
  js.src = "https://connect.facebook.net/en_US/sdk.js";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

不过要注意：这种方式依赖于Facebook评论插件的DOM结构和属性，未来如果FB更新插件实现，这个方法可能会失效，所以适合快速验证或者非核心功能使用。

如果你的页面已经正确配置了Open Graph标签（比如og:url），有些前端工具会尝试抓取公开的OG数据来获取评论数，但这个方法可靠性极低——Facebook的公开数据接口随时可能调整，而且计数的实时性也无法保证，只适合临时测试，不建议用于生产环境。

内容的提问来源于stack exchange，提问作者Code Animal