javascript - chrome扩展加载外部js

Question

我正在构建一个 chrome 扩展，它使用针对特定 Web 域定制的 JavaScript 库。限制只能从特定域调用该库(实际上是许可证问题)。

我想将该 js 库加载到我的 chrome 扩展程序中，但该扩展程序给出了内容安全策略错误，因为要使用的库来自 HTTP(而非 HTTPS)URL。我在 StackOverflow 上搜索了这个，我看到的唯一选项是在本地加载该文件或通过消息传递。

谁能告诉我我的 background.js 中应该有什么代码？和 content.js以及在我的 manifest.json 中添加什么权限？

获取该 js 库的网站是，例如 http://library.com/js/xy.js . 我知道在 content.js 中应该还有一些类似代码的东西。如何从该域加载代码？

list .json:

{
    "manifest_version": 2,
    "name": "abc",
    "version": "0.2",
    "description": "abc",
    "content_security_policy": "script-src 'self'; object-src 'self'",
    "browser_action": {
        "default_icon": "MM_logo_2009.png",
        "default_popup": "tab/popup.html"
    },
    "background": {
        "scripts": ["event.js"],
        "persistent": false
    },
    "permissions": [
        "http://library.com/js/xy.js",
        "bookmarks",
        "tabs",
        "storage",
        "http://*/*", 
        "https://*/*"
    ]
}

事件.js:

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://library.com/js/xy.js", true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
        // innerText does not let the attacker inject HTML elements.
        document.getElementById("resp").innerText = xhr.responseText;
    }
}
xhr.send();

Answer 1

一种非常直接且愚蠢的危险方式:

如果这确实是您执行此操作的唯一方法(通过 HTTP 加载代码)，那么您必须求助于 allowing eval :

"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'"

然后

var xhr = new XMLHttpRequest();
xhr.open("GET", "http://library.com/js/xy.js", true);
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4) {
        eval(xhr.responseText);
    }
}
xhr.send();

这应该是最后的手段，因为它会打开您的高度特权环境，让任何可以对您的连接进行 MITM 的人执行任意代码。

由于它是 HTTP，因此无法保证发件人的身份或脚本的完整性。

如果此代码被 Chrome 网上应用店拒绝，请不要感到惊讶!

幸运的是，有一种方法可以至少部分降低风险。

使用保护.. 错误，沙盒:

文档中甚至有完整的指南，"Using eval in Chrome Extensions. Safely."

然后你做同样的事情，但是在 sandboxed页面(例如，您的事件/背景页面中的 <iframe>)，并使用 postMessage 与其通信.这样，您就可以验证通信，而不是为正在评估的代码提供对扩展 API 的任何直接访问。