Question

我正在尝试将Chrome扩展程序迁移到清单2.当前版本使用的background.html页面基本上是一个大的脚本标记。由于这不再可能，我转而使用background.js脚本，经过大量的搜索和实验，仍然无法从外部文件中注入脚本。在当前版本中，我只使用document.write注入一个脚本标记，该标记将在浏览器加载时运行，而我现在还没有找到方法。

我知道chrome.tabs.onUpdated.addListener函数以及使用XMLHttpRequest对象为每个标签更新注入脚本的功能，但我想运行的脚本只应在浏览器加载时才这样做。

当前代码（在background.html文件的脚本代码中）：

document.write("<script type='text/javascript' src='" + url + "'></script>");

在background.js文件中，这会导致错误：拒绝加载脚本'http://www.mydomain.com/script.js'，因为它违反了以下内容安全策略指令：“script-src'self'chrome-extension-resource：”。

我尝试了各种代码，包括：

var s = document.createElement('script');
s.src = chrome.extension.getURL(url);
s.onload = function() {
    this.parentNode.removeChild(this);
};
(document.head||document.documentElement).appendChild(s);

但似乎这只适用于本地脚本文件，而我需要加载外部在线文件。

Answer 1

您收到的错误是由于清单中的指令 content_security_policy 。您需要指定脚本的域作为其一部分。这是jQuery的一个例子：

"content_security_policy": "script-src 'self' https://ajax.googleapis.com; object-src 'self'"

在Background.html页面

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

这并没有给我带来任何错误。即将下载此脚本，这取决于您的扩展架构，但有很多方法可以告诉您的应用程序如何执行此操作。请记住，应用程序加载的第一件事是您的“背景”页面，因此您可以在加载后从“背景”页面向内容脚本发送消息。例如：

/**
* Listener for Displaying the Extension Page Action when the Tab is updated.
* @private
* @event displayPageAction
* @param {Number} tabId The tabId given by the tabs listener to know which tab was updated.
* @param {Object} changeInfo The current status of the tab.
* @param {Object} tab The metadata of the tab.
**/
var displayPageAction = function (tabId, changeInfo, tab) {
    var match = regexAIESEC.exec(tab.url); // var regexAIESEC = new RegExp(/http:\/\/www.myaiesec.net\//);
    // We only display the Page Action if we are inside a MyAIESEC Tab.
    if(match && changeInfo.status == 'complete') {
        //We send the proper information to the content script to render our app.
         chrome.tabs.sendMessage(tab.id, {load: true}, function(response) {
            if(response) {
                //After successfully getting the response, we show the Page Action Icon.
                chrome.pageAction.show(tab.id);     
            }
        });
    }
};

这是更新标签后何时显示Page操作的示例。在之前的代码中：

chrome.tabs.onUpdated.addListener(displayPageAction);

您可以详细了解Chrome扩展程序的内容安全政策here以及有关邮件传递here的更多信息。

Answer 2

a）document.write("<script type='text/javascript' src='" + url + "'></script>");无法在background.js中使用，因为您的document是背景页面的文档。请参阅documentation和architecture

b）chrome.extension.getURL(url);检索文件的相对网址，您可以尝试使用tabs API

我能够使用以下代码向任意页面注入Jquery，您是否正确设置了权限？

参考

a）Content Scripts

b）Manifest Version 2

c）tabs API

d）Background Pages

的manifest.json

{
"name":"Script Injection Demo",
"description":"This demonstrates Script Injection",
"version":"1",
"manifest_version":2,
"content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["myscript.js"]
    }
  ]
}

myscript.js

//Creating a Script Tag
var _scriptTag = document.createElement('script');
//Referencing external URL
_scriptTag.src='https://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.js';
//Appending child
(document.head||document.documentElement).appendChild(_scriptTag);

如果这种注射不适合你，请告诉我。

将chrome扩展迁移到清单2 - 脚本注入

2 个答案:

参考

的manifest.json

myscript.js