google-chrome - Chrome-Ext：如何将参数值从 popup.js/background.js 传递到内容脚本？

Question

我发现有很多帖子教我们如何使用 sendRequest 和OnRequest.addListener函数将值从内容脚本传递到后台脚本。

但是，我想将用户输入参数传递给内容脚本。我怎样才能做到这一点？

Answer 1

根据您注入内容脚本的方式，您可以采用不同的方式。首先，如果您使用匹配模式并通过清单注入，并且您需要基于某些事件的数据，content script那么您将需要执行以下操作：

内容脚本

chrome.extension.sendMessage({text:"getStuff"},function(reponse){
  //This is where the stuff you want from the background page will be
  if(reponse.stuff == "test")
    alert("Test received");
});

背景.js

chrome.extension.onMessage.addListener(function(message,sender,sendResponse){
  if(message.text == "getStuff")
    sendResponse({stuff:"test"}); //This would be where you send your stuff
});

如果您正在执行程序化注入并且您在注入时拥有数据，那么这样的事情会起作用。我假设您已经知道如何获取要注入的选项卡：

背景.js

//given tab is the tab ID you already have
chrome.tabs.executeScript(tab,{file:"contentScript.js"},function(){
  chrome.tabs.sendMessage(tab, {stuff:"test"});
});

contentScript.js

chrome.extension.onMessage.addListener(function(message,sender,sendResponse){
  //This is where the stuff you want from the background page will be
  if(message.stuff == "test")
    alert("Test received");
});

如果您需要将数据从弹出窗口发送到您已经注入的内容脚本，那么您可以执行以下操作：

Popup.js

chrome.tabs.query({active:true,currentWindow:true}, function(tab) {
  chrome.tabs.sendMessage(tab[0].id, {stuff:"test"});
});

contentScript.js

chrome.extension.onMessage.addListener(function(message,sender,sendResponse){
  //This is where the stuff you want from the background page will be
  if(message.stuff == "test")
    alert("Test received");
});

无论您如何注入脚本，只要您选择了所需的选项卡，这将起作用。