Google Chrome扩展程序 - 脚本注入

Question

我正在尝试让我的Chrome扩展程序注入一些javascript content_scripts,使用此前一个答案作为参考.

的manifest.json

"name": "My Chrome Extension",
"version": "1.0",
"manifest_version": 2,
"content_scripts": [{
    "matches": ["http://pagetoinject/script/into/*"],
    "js": ["contentscript.js"]
}]  

contenscript.js:

var s = document.createElement('script');
s.src = chrome.extension.getURL("script.js");
(document.head||document.documentElement).appendChild(s);
s.parentNode.removeChild(s);

(也尝试过 这个方法没有成功.)

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

我一直收到这个javascript错误.这是一个截图.

GET chrome-extension://invalid/ (anonymous function)

Answer 1

1. 在您的清单文件中,"manifest_version": 2已指定.这会自动激活更严格的模式,默认情况下,所有扩展程序的文件都不可用于网页.
2. 原始代码永远不会工作,因为<script>注入后会立即删除该元素(脚本文件没有机会加载).

作为1.的结果,控制台中显示以下错误:

Failed to load resource                             chrome-extension://invalid/

要解决此问题,添加script.js到白名单,"web_accessible_resources"在您manifest file:

{
  "name": "Chrome Extension",
  "version": "1.0",
  "manifest_version": 2,
  "content_scripts": [{
      "matches": ["http://pagetoinject/script/into/*"],
      "js": ["contentscript.js"]
  }],
  "web_accessible_resources": ["script.js"]
}