gpt4 book ai didi

javascript - 如何在 background.js 和 popup.js 之间进行通信?

转载 作者:塔克拉玛干 更新时间:2023-11-02 20:49:46 24 4
gpt4 key购买 nike

我有一个带有后台脚本的扩展:

"background": {
"scripts": ["scripts/background.js"]
},

和内容脚本:

"content_scripts": [
{
"matches": ["*://*/*"],
"js": ["scripts/content_script.js"]
}
],

一个弹出窗口(popup.html),和一个弹出脚本(popup.js)。 popup.js 未注册到 list 中,它处理 popup.html 外观,并监听 popup.html 中的用户操作,例如单击按钮。

我想做一个扩展,通过电子邮件发送当前选项卡的页面,为此,我需要使用 content_script 获取页面 DOM,传递数据(DOM ) 到 后台脚本。在此之后,当用户在 popup.html 中触发事件时,popup.js 会捕获此事件,我希望 popup.js 能够从 background.js 中获取传递的数据(DOM)。我怎么能做到这一点?所以,我的问题是,如何在 background.js 和 popup.js 之间进行通信?


我找到了我自己问题的答案:

谢谢 Elvis,我想我解决了这个问题;我只需要在内容脚本中获取站点的 DOM,但我的问题的解决方案是这样的:

content_script.js

 // SEND DOM structure to the background page
chrome.extension.sendRequest({dom: "page DOM here"});

background.html

<html>
<head>
<script>
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
if(request.dom != "")
var theDOM = request.dom;
console.log(request.dom); // page DOM here -> works
chrome.extension.sendRequest({theDOM: theDOM}); // theDOM : "page DOM here"
});
</script>
</head>
<body>
</body>
</html>

popup.js

var dom;
chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
if(request.theDOM != ""){
console.log("popup request: "+request.theDOM);
dom = request.theDOM;
}
});

// HANDLE TAB_1 REQUESTS (EMAIL PAGE)
// ---------------------------------
$("#send").click(function(){
console.log(dom); // page DOM here
}

感谢您的帮助;)

最佳答案

您可以进行消息传递。来自documentation :

在您的内容脚本中使用它:

chrome.extension.sendRequest({greeting: "hello"}, function(response) {
console.log(response.farewell);
});

它向后台发送{greeting: "hello"}。注意指定的回调

后台页面可以使用以下方法监听这些请求:

chrome.extension.onRequest.addListener(
function(request, sender, sendResponse) {
if (request.greeting == "hello")
sendResponse({farewell: "goodbye"});
});

sendResponse 函数的参数将被传递给回调

关于javascript - 如何在 background.js 和 popup.js 之间进行通信?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10396034/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com