Question

我正在构建一个chrome扩展程序，每次打开一个新选项卡并加载页面时都会收到通知，为此我使用了chrome.tabs.onUpdated事件。

问题在于，如果在某个域（具有src）上托管的页面/选项卡上插入iframe，则会触发onUpdated事件。有没有办法区分这些事件的“真实”标签加载与为iframe加载触发的那些？

Answer 1

当状态在tabs.onUpdated到loading之间发生变化时，

complete会触发。据推测，插入iframe会将标签再次置于loading状态。

您可以看到details.url监听器中是否定义了onUpdated - 如果没有，您知道该文档的网址没有更改。

也许您应该使用webNavigation API代替您的目的。在那里，您可以使用TransitionQualifier来过滤掉子帧导航。

Answer 2

这个问题帮助我完成了我的扩展，认识到新页面和加载内容在同一页面上的区别，所以我想我会分享我的解决方案。首先，您需要在background.js中调用onUpdated：

清单

{
  "name": "My test extension",
  "version": "1",
  "manifest_version": 2,
  "background": {
    "scripts":["background.js"]
  },
  "content_scripts": [
    {
      "matches": ["http://*/*", "https://*/*"],
      "js": ["contentscript.js"]
    }
  ],
  "permissions": [
    "tabs"
  ]
}

background.js

chrome.tabs.onUpdated.addListener(
  function(tabId, changeInfo, tab) {
    // read changeInfo data
    if (changeInfo.url) {
      // url has changed; do something here

    }
  }
);

然后，您可以展开该脚本，将来自background.js的消息数据发送到您的内容脚本（使用chrome.runtime.sendMessage）：

background.js（con＆＃39; t）

chrome.tabs.onUpdated.addListener(
  function(tabId, changeInfo, tab) {
    // read changeInfo data
    if (changeInfo.url) {
      // url has changed; do something here
      // like send message to content script
      chrome.tabs.sendMessage( tabId, {
        message: 'hello!',
        url: changeInfo.url
      })
    }
  }
);

最后，请在您的扩展程序内容脚本中监听该数据：

contentscript.js

chrome.runtime.onMessage.addListener(
  function(request, sender, sendResponse) {
    // listen for messages sent from background.js
    if (request.message === 'hello!') {
      console.log(request.url) // new url is now in content scripts!
    }
});

您可以从background.js传递您喜欢的任何数据。希望有人帮助！ \（•◡•）/

Chrome扩展程序标签onUpdated事件

2 个答案:

清单

background.js

background.js（con＆＃39; t）

contentscript.js