0

我正在尝试将我的 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'铬扩展资源：“。

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

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

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

4

2 回答 2

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);     
            }
        });
    }
};

这是更新选项卡后何时显示页面操作的示例。在之前的代码中：

chrome.tabs.onUpdated.addListener(displayPageAction);

您可以在此处阅读有关 Chrome 扩展程序的内容安全政策的更多信息，并在此处阅读有关消息传递的更多信息。

于 2012-12-18T18:27:51.710 回答
0

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

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

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

参考

a)内容脚本

b)清单版本 2

c)选项卡 API

d)背景页

清单.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);

如果这种注射对您不起作用，请告诉我。

于 2012-12-18T18:15:53.247 回答