chrome扩展以在页面加载时运行脚本

Question

我正在编写一个chrome扩展，它应该能够在加载后立即在该页面上运行脚本。 我实现了该功能，以便在单击扩展图标时运行代码，但是当我添加代码以在页面加载时运行该脚本时，它无法正常工作

清单文件

 {
  "name": "",
   "description": "",
   "version": "1.0",

   "permissions": [
     "activeTab",
     "tabs"
    ],
   "background": {
    "scripts": ["background.js"],
    "persistent": false
    },
   "browser_action": {
      "default_title": "",
  "default_icon": "6a00e3982283618833019affd3c028970c.png"
   },
  "manifest_version": 2
  }

js文件：

chrome.tabs.onUpdated.addListener(
  function ( tabId, changeInfo, tab )
  { 
    if ( changeInfo.status === "complete" )
    {
      chrome.tabs.executeScript({
      code: "console.log('dsff');"
    });
  }
});

但是，尽管如此，当用户在选项卡中更改页面时，我的js仍未运行

Answer 1

如果您注册了chrome.tabs.executeScript(...)的回调以捕获任何错误，例如：

chrome.tabs.executeScript({ code: "console.log('dsff');" }, function() {
    if (chrome.runtime.lastError) {
         console.log("ERROR: " + chrome.runtime.lastError.message);
    }
});

你会注意到以下错误：

错误：无法访问网址“...”的内容。 扩展清单必须请求访问此主机的权限。

因此，您需要将相应的主机匹配模式添加到清单中的permissions列表中。 例如，为了能够将代码注入任何http/https页面：

"permissions": ["*://*/*"]

---

此外，如果省略chrome.tabs.executeScript(...)的tabId参数，它将应用于当前活动的选项卡（可能会推迟触发onUpdated事件的选项卡）。 所以，还要进行以下更改：

chrome.tabs.executeScript(tab.id, { code: "console.log('dsff');" }, function() {...

Answer 2

首先，为什么要为内容和后台脚本使用相同的文件（background.js）。

内容脚本不能使用chrome。* api