Chrome 扩展程序：如何在开始加载之前更改 JS url答案

【问题标题】：Chrome Extension: how to change JS url before he starts loadingChrome 扩展程序：如何在开始加载之前更改 JS url
【发布时间】：2014-08-26 11:06:35
【问题描述】：

我想在他开始使用 Chrome 扩展程序加载之前更改 js javascript 的 src。

Manifest.json

{
"name":"Inject DOM",
"version":"1",
"manifest_version":2,
"permissions": [
    "webRequest",
    "webNavigation",
    "http://*/*",
    "https://*/*"
        ],
"content_scripts": [
    {
      "run_at": "document_end",
      "matches": ["http://www.example.com/*"],
      "js": ["inject_this.js"]
    }
  ]
}

inject_this.js

我在各种功能场景中执行这段代码

var element = event.srcElement;

if(/production_path/.test(element.src)){

element.src = element.src.replace(/production_url/gi, "dev_path");

}

场景 A

document.addEventListener('DOMNodeInserted', nodeInsertedCallback);

场景 B

在inject_this.js 中执行这个场景会抛出这个TypeError：

未捕获的类型错误：无法读取未定义的属性“onBeforeRequest”

在另一个js中执行这个不起作用

chrome.webRequest.onBeforeRequest.addListener(
  function(details) {

    if(/production_url/.test(details.url)){

       return { 
          redirectUrl: details.usl.replace(/production_url/gi, "dev_url")
       }

    }

},

{urls: ["<all_urls>"]},
["blocking"]);

我把这个 sn-p 代码放在哪里？

场景 C

document.addEventListener('beforeload', doBeforeLoad , true);

但是每次script.src 更改太晚，资源都会被加载。

如何在他开始加载之前更改 javascript url？

【问题讨论】：

场景 B 应该可以，您是否使用了阻塞响应？
其他场景将无法使用，但请展示更多场景 B 的代码。
@Xan 完成。正如我在编辑中所写的那样，如果在注入的脚本中执行，场景 B 的代码会抛出 TypeError ( Uncaught TypeError: Cannot read property 'onBeforeRequest' of undefined )。如果在另一个 js 中执行（包括从注入的）它不会触发。我应该在哪里注入这些 sn-p 代码？

标签： javascript google-chrome-extension preloading

【解决方案1】：

您的解决方案 B 应该可以工作。

这需要满足两个条件：

此代码应发送至background script / event page。
你需要appropriate permissions："webRequest", "webRequestBlocking"

您可能也不应该在<all_urls> 上使用它，因为您的扩展似乎特定于单个站点（来自您的清单）。在所有 URL 上执行此操作会降低 Chrome 的速度并可能导致其他网站崩溃，请考虑使用限制性匹配模式，例如 "http://www.example.com/*production_url*"

【讨论】：