后台脚本打开URL后如何等待内容脚本侦听器加载? [英] How to wait for content script listener to load after background script opens URL?

问题描述

我的后台脚本应该打开一个URL，然后等待其完全加载，因此内容脚本的侦听器已准备就绪(可以吗?).然后它将消息"newURLvisited"发送到内容脚本.

My background script should open an URL and wait for it to load completely, so the content script's listener is ready (Am i right with this?). Then it should send the message "newURLvisited" to the content script.

内容脚本收到消息并从网站获取所有链接，然后单击其中一个(例如索引10).通常情况下，内容脚本会这样激活自己，因为我的manifest.json与所有URL匹配(这对我来说是必需的).

The content script receives the message and gets all links from the website and clicks on one (for example index 10). Normally the content script would activate itself by doing so, because my manifest.json matches all urls (which is necessary for me).

我想通过仅在后台脚本发送消息"newURLcreated"时才调用内容脚本来解决此问题.当内容脚本单击链接时，将发送消息"newURLcreated"，但这不是所需的行为.

I wanted to fix this problem by calling the content script only when the background script sends the message "newURLcreated". When a link is clicked by the content script, the message "newURLcreated" is send, but this is not the wanted behaviour.

那么我该如何等待内容脚本的侦听器加载，然后向其发送消息而又没有问题呢?

So how can i wait for the content script's listener to load and then send messages to it without having my problem?

我知道我正在检查加载"和tabs.onUpdated，这可能不是必需的.我正在尝试他们.

I know that i am checking 'load' and tabs.onUpdated, which might not be necessary. I was experimenting with them.

background.js:

background.js:

chrome.windows.onCreated.addListener(
  chrome.tabs.update({url:"https://stackoverflow.com/"});
});

window.addEventListener('load', function(event) {  
  chrome.tabs.onUpdated.addListener(function (tabId, changeInfo, tab) {          
    if (changeInfo.status == 'complete') {   
      chrome.tabs.query({active: true, currentWindow: true}, function(tabs){
        chrome.tabs.sendMessage(tabs[0].id, {txt: "newURLvisited"}, function(response) {});
      });
    }
  });
});

content.js:

content.js:

chrome.runtime.onMessage.addListener(gotMessage);

function gotMessage(message) {
  if (message.txt === "newURLvisited") {
    var allLinks = document.getElementsByTagName("a");
  }
  allLinks[10].click();
}

推荐答案

在onUpdated回调中，您需要检查已更新的选项卡是否实际上是您手动更新的选项卡.但是，我想提出一种更简单的整体方法:

In onUpdated callback you need to check if the updated tab is actually the one you've updated manually. However I'd like to suggest a much simpler overall approach:

1. 从manifest.json中删除"content_scripts"部分
2. 运行内容脚本以编程方式.

---

chrome.tabs.update({url: 'https://stackoverflow.com/'}, tab => {
  chrome.tabs.executeScript(tab.id, {file: 'content.js'}, ([results]) => {
    console.log(results);
  });
});

content.js:

content.js:

// do something
// ...............
// return some data to executeScript
// (only simple types like strings/numbers or arrays/objects consisting of simple types)
var results = [...document.links].map(el => el.href);
results;

最后一行会将URL数组传输到executeScript的回调中.

The last line will transfer the array of URLs to executeScript's callback.

这篇关于后台脚本打开URL后如何等待内容脚本侦听器加载?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！