Javascript 访问 Disqus 评论文本框？

Question

我正在开发一个浏览器扩展，它应该允许我访问文本框中的评论/帖子。现在很多网站都使用 Disqus 作为评论方式，但在输入文本时我无法找到访问 Disqus 评论框的方法(Disqus API 也没有透露太多信息)。

有人知道如何访问它吗？

Answer 1

解决这个问题的最佳方法是开始分析 Disqus API 如何使用他们的评论系统。此时您最好的 friend 是 Google Chrome 附带的检查器(开发人员工具)。

当您分析 DOM(右键单击并找到评论文本区域)时，您会注意到它是一个 iframe。您应该想到，这是对 Discus 域的跨域请求，以获取该评论框插件的信息。通过查看标签，您可以看到它有一个指向domain.disqus.com的href，其中domain是您正在查看的网站。

例如，当您访问 TechCrunch 时，iframe 将指向 http://techcrunch.disqus.com注入(inject)评论框。

您可以使用Content-Scripts读取和操作这些注入(inject)的页面，因为内容脚本也可以通过全框架注入(inject)到 IFrame manifest名字.!

例如，要设置内容脚本，您需要 list 文件中的 content_scripts 部分:

"content_scripts": [
  {
    "matches": ["http://*/*"],
    "js": ["cs.js"],
    "run_at": "document_end",
    "all_frames": true
  }

然后，在您的 cs.js(内容脚本文件)中，您可以通过搜索给定的 iframe 找到评论框。

// We just need to check if the IFrame origin is from discus.com
if (location.hostname.indexOf('.disqus.com') != -1) {
  // Extract the textarea (there must be exactly one)
  var commentBox = document.querySelector('#comment');
  if (commentBox) {
    // Inject some text!
    commentBox.innerText = 'Google Chrome Injected!';
  }
}

最后，您会看到精彩的文字“Google Chrome Injected!”

希望这能帮助您创建出色的 Chrome 扩展程序:) 上面的代码可以工作，因为我在本地测试了它。