谷歌chrome扩展程序http请求监视选项卡

Question

我正在研究Google Chrome扩展程序。 我想要的是，一旦用户在浏览器选项卡上的http请求完成，它就会发出警报。 意味着当浏览器完成其请求应用程序后便可以收听它。

现在我正在使用下面的代码。 请求完成后，它将读取选项卡URL。

chrome.webRequest.onCompleted.addListener(function() {
    var mydiv = document.createElement('div');  
        chrome.tabs.getSelected(null,function(tab) {
        mydiv.innerHTML = tab.url;      
    });         
    document.body.appendChild(mydiv);
});

但这对我不起作用。 有什么帮助吗？

Answer 1

您可能正在从后台页面运行代码（否则chrome.webRequest API将不可用。从那里（后台页面）无法与网页DOM进行交互。

您可以这样实现您想要的：

解决方案A

1. 将内容脚本注入到网页中的“ document_end”或“ document_idle”处 。

2. 内容脚本（一旦注入）将创建您的div并将其添加到DOM。

解决方案B

1. 让您的背景页面监听页面加载。 顺便说一句， chrome.tabs.onUpdated可能更适合该任务。 例如：

   \n chrome.tabs.onUpdated.addListener（function（tabId，info，tab）{  \n     如果（info.status &&（info.status ==“ complete”））{\n         //页面已加载，因此请插入内容脚本\n     }\n }）;\n

2. 在页面加载时，以编程方式注入内容脚本。

3. 内容脚本（一旦注入）将创建您的div并将其添加到DOM。