如何使用扩展将代码注入facebook/google网页

How to inject code into facebook/google web page using extensions?

本文关键字：facebook google 网页 注入 代码 何使用 扩展      更新时间：2023-09-26

我是扩展开发的新手。我正在尝试创建一个扩展，在那里我可以将代码注入网页。我一直在尝试使用谷歌chrome内容脚本来做到这一点。但我一直无法在facebook.com或谷歌上做到这一点。它似乎在雅虎上起作用。这是有原因的吗？我该怎么绕过这个？

我已经在我的一个扩展程序FacebookFriendExporter中做到了这一点，请随意查看。它使用Facebook获取你朋友的联系信息（包括电子邮件），并将其作为新联系人导出到Gmail。这需要谷歌和脸书的许可，这与你的类似。

由于您需要向Facebook或Google注入代码，因此必须使用内容脚本。内容脚本允许您在网页的上下文中运行JavaScript代码。您可以使用标准DOM从该网页中提取/读取内容并对其进行更改。

在您的manifest.json中，您需要将其定义如下：

{
  "name": "My extension",
  ...
  "content_scripts": [
    {
      "matches": ["http://*.google.com/*", "http://*.facebook.com/*"],
      "css": ["injected_styles.css"],
      "js": ["injected_script.js"],
      "all_frames": true
    }
  ],
  ...
}

有关比赛模式的更多信息，您可以在Match patterns文档中阅读。请记住，顶级内容脚本匹配只允许您在".com"域上注入。只要考虑到这一点，如果你想要更多的匹配域，你需要一个接一个地输入它们。（我知道这有问题，但出于安全原因）

请记住，对于像GoogleMail（gmail）这样的复杂网站，它通常使用iframe来表示其DOM。这就是我放置"all_frames:true"的原因，因为我希望内容脚本在页面的所有框架中运行，而不仅仅是在顶部框架中。

希望能有所帮助！

您可以使用内容脚本将代码注入任何网站。请确保在manifest.json文件的matches标记中包含"facebook.com"或"google.com"

相关文章：