javascript 从内容脚本向后台脚本发送消息会破坏 chrome 扩展

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/26156978/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 05:35:32  来源:igfitidea点击:

Sending message from content script to background script breaks chrome extension

javascriptgoogle-chrome-extension

提问by user1573618

I am trying to send a message from a content script to the background script in a chrome extension that triggers a rich notification to open. I can already achieve this but it breaks the rest of my extension.

我正在尝试将消息从内容脚本发送到 chrome 扩展程序中的后台脚本,以触发丰富的通知打开。我已经可以做到这一点,但它打破了我的扩展的其余部分。

In my content script I have a call to chrome.extension.sendMessage inside of which I load my extension code. This was all working fine until I added my notification code, I decided to use chrome Rich Notifications API as I would like to have buttons in my notification eventually, and I am led to believe that only the background script can open the rich notification, hence the need for messages. If I comment out the chrome.runtime.OnMessage.addListener function in background.js my extension logic loads properly again, so something about that call is conflicting with the chrome.extension.sendMessage function in inject.js.

在我的内容脚本中,我调用了 chrome.extension.sendMessage,我在其中加载了扩展代码。这一切正常,直到我添加了我的通知代码,我决定使用 chrome Rich Notifications API,因为我最终希望在我的通知中有按钮,并且我相信只有后台脚本才能打开丰富的通知,因此消息的需要。如果我在 background.js 中注释掉 chrome.runtime.OnMessage.addListener 函数,我的扩展逻辑会再次正确加载,因此该调用与inject.js 中的 chrome.extension.sendMessage 函数发生冲突。

Can anyone explain why this happens and how to fix it?

谁能解释为什么会发生这种情况以及如何解决?

A simplified version of my code is as follows:

我的代码的简化版本如下:

manifest.json

清单文件.json

{
  "name": "Test",
  "version": "0.0.1",
  "manifest_version": 2,
  "description": "Test
  "permissions": [
    "notifications"
  ],
  "background": {
    "persistent": false,
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "matches": [
        "mywebsite/*"
      ],
      "js": [
        "inject.js",
      ]
    }
  ],
  "web_accessible_resources": [
    "notificationIcon.png"
  ]
}

background.js

背景.js

chrome.runtime.onMessage.addListener(function(request, sender) {
    if (request.type == "notification")
      chrome.notifications.create('notification', request.options, function() { });
});

inject.js

注入.js

chrome.extension.sendMessage({}, function(response) {
    //code to initialize my extension
});

//code to send message to open notification. This will eventually move into my extension logic
chrome.runtime.sendMessage({type: "notification", options: { 
    type: "basic", 
    iconUrl: chrome.extension.getURL("icon128.png"),
    title: "Test",
    message: "Test"
}});

采纳答案by user1573618

The problem was caused because my listener in background.js was not returning a response. So the function response of my chrome.extension.sendMessage was never being executed.

问题是因为我在 background.js 中的监听器没有返回响应。所以我的 chrome.extension.sendMessage 的函数响应从未被执行。

I changed my background.js to be:

我将我的 background.js 更改为:

chrome.runtime.onMessage.addListener(function(request, sender, sendResponse) {
    if (request.type == "worktimer-notification")
      chrome.notifications.create('worktimer-notification', request.options, function() { });

    sendResponse();
});