在 chrome 扩展中包括托管 js 和 css

Question

是否可以将托管 js 和 css 添加到 content_script chrome 插件。

"content_scripts": [
    {
      "matches": ["*://*/*"],
      "css": ["bootstrap.min.css", "mystyles.css"],
      "js": ["jquery-1.7.2.min.js", "myscript.js"],
      "all_frames" : true
    }
  ]

这里的js和css应该在manifest.json

的同一个包里

我想添加像

这样的托管 js

"content_scripts": [
    {
      "matches": ["*://*/*"],
      "css": ["bootstrap.min.css", "mystyles.css"],
      "js": ["https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js", "https://www.example.com/js/myscript.js"],
      "all_frames" : true
    }
  ]

Answer 1

不，不能那样做。

首先，从不使用 CDN 将 jQuery 之类的库传送到您的扩展；根本没有意义，你在节省什么？您会在不应该有的地方出现网络延迟。

接下来，应用程序逻辑脚本。我可以理解比更新扩展更快地更新它们的要求，这是有道理的。但是，您不能在清单中包含类似这样的非本地文件。

但是，您可以执行以下操作：

注入一个小的"bootstrap"脚本，这是本地的。
Message the background page 来自 bootstrap 脚本并请求注入其余部分。
后台页面获取脚本with XHR（记住你需要主机权限）。

我也建议使用某种缓存，比如每 N minutes/hours/days 和 saving a copy locally in chrome.storage 只尝试获取一次新版本。否则，您将再次遇到可怕的延迟。
后台页面使用
注入脚本
```
chrome.tabs.executeScript(tabId, {code: "..."})
```
programmatic injection 的形式。

请注意，所有这些都相对复杂，除非您使用 HTTPS 传送脚本（否则您很容易受到 MitM 攻击），否则强烈建议不要这样做。除非您有比更新扩展程序更快地更新应用程序逻辑的特定要求，否则不要这样做。

在 chrome 扩展中包括托管 js 和 css

Including hosted js and css in chrome extension

javascript

google-chrome-extension