content_script.js、background.js和popup.js之间的通讯

QmagicianRX

已于 2023-11-28 15:22:32 修改

阅读量546

点赞数

分类专栏：谷歌插件文章标签：插件 content_script background.js popup 通讯 sendMessage onMessage

于 2023-11-28 14:45:06 首次发布

本文链接：https://blog.csdn.net/wuxiaoquan_520/article/details/134667209

版权

谷歌插件专栏收录该内容

5 篇文章 0 订阅

订阅专栏

1. content_script.js 和 background.js 之间的通信：

使用 chrome.runtime.sendMessage 发送消息，然后在 background.js 中使用 chrome.runtime.onMessage 监听消息并作出相应处理。
使用 chrome.extension.sendMessage 发送消息，然后在 background.js 中使用 chrome.extension.onMessage 监听消息并作出相应处理。
使用 chrome.tabs.sendMessage 发送消息，然后在 background.js 中使用 chrome.runtime.onMessage 或 chrome.extension.onMessage 监听消息并作出相应处理。

2. content_script.js 和 popup.js 之间的通信：

使用 chrome.runtime.sendMessage 发送消息，然后在 popup.js 中使用 chrome.runtime.onMessage 监听消息并作出相应处理。

3. background.js 和 popup.js 之间的通信：

使用 chrome.runtime.sendMessage 发送消息，然后在 popup.js 中使用 chrome.runtime.onMessage 监听消息并作出相应处理。

具体的通信示例代码如下所示：

在 content_script.js 中发送消息：

chrome.runtime.sendMessage({ message: "Hello from content script!" });

在 background.js 或 popup.js 中接收消息：

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.message === "Hello from content script!") {
    console.log("Message received: " + request.message);
  }
});

在 popup.js 中发送消息：

chrome.runtime.sendMessage({ message: "Hello from popup!" });

在 background.js 中接收消息：

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
  if (request.message === "Hello from popup!") {
    console.log("Message received: " + request.message);
  }
});