Chrome 扩展内容脚本不触发代码

Question

我正在尝试获取用户访问的每个新页面的 URL。我找到了一个说使用content_scripts 的答案，所以我把它放在我的清单中：

"permissions": [
  "tabs"
],
"content_scripts": [
{
  "matches": ["<all_urls>"],
  "js": ["js/background.js"]
}

我也尝试过这样的匹配：

"matches": ["http://*/*", "https://*/*"],

这是我的background.js 文件：

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
    alert(changeInfo.url);
});

chrome.tabs.onActivated.addListener(function(activeInfo) {
  // how to fetch tab url using activeInfo.tabid
  chrome.tabs.get(activeInfo.tabId, function(tab){
     console.log(tab.url);
  });
});

alert("BACON");

重新加载扩展程序然后打开新标签并访问各种网站后，什么都不会被触发。有人可以帮我弄清楚我做错了什么吗？谢谢！

Answer 1

根据content scripts documentation：

内容脚本有一些限制。他们不能使用 chrome.* API，但以下情况除外：

• 扩展（getURL、inIncognitoContext、lastError、onRequest、sendRequest）
• i18n
• 运行时（连接、getManifest、getURL、id、onConnect、onMessage、sendMessage）
• 存储

解决方案：为了访问chrome.tabs API，您应该使用后台页面脚本。

还要注意根据chrome.tabs API documentation：

您可以使用大多数 chrome.tabs 方法和事件，而无需在扩展的清单文件中声明任何权限。但是，如果您需要访问 tabs.Tab 的 url、title 或 favIconUrl 属性，则必须在清单中声明 "tabs" 权限

ma​​nifest.json

...
"permissions": [
  "tabs"
],
"background": {
  "scripts": ["background.js"]
},
...

background.js

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
  if (changeInfo.status==='loading' && changeInfo.url) {
    alert(changeInfo.url);
  }
});