“试图使用断开的端口对象”同时从内容发送消息到Chrome扩展程序中弹出 [英] "Attempting to use a disconnected port object" while sending message from content to popup in Chrome extension

问题描述

所以，我需要将消息从弹出窗口传递到内容窗口，反之亦然。目前这里是我现在正在做的事情，但是这不起作用的方式：

manifest.json：

  {
 //必填
manifest_version：2，
名称：扩展名，
版本：0.1，
content_scripts：[
 {
matches：[*：// * / *]，
js：[ content.js] 
} 
]，
browser_action：{
default_title：扩展名，
default_popup：popup.html 
，
permissions：[
tabs，
*：// * / *，
contextMenus
] 
 
 
 
 
 $ popup $ popup $. 
 
 
  var port =; 
 window.onload = function（）
 {
 document.getElementById（captureImage）。onclick = captureImage; 
 
 
 $ b函数captureImage（isBig = true）
 {
 chrome.tabs.query（{'active'：true}，function（tabs ）{
 port = chrome.tabs.connect（tabs [0] .id，{name：Besada}）; 
 port.onMessage.addListener（function（msg）{
 alert （msg.message）; 
}）; 
 port.postMessage（{message：getCoords}）; 
}）; 
} 
  
和content.js  
 
 
  chrome.runtime.onConnect.addListener（function（port）{
 port.onMessage.addListener（function（msg）{
 
}） ; 
 
 port.postMessage（{message：hello！}）; //这条消息我收到
 
 document.onmouseup = function（e）{
 port.postMessage（{message：hello！}）; //这条消息产生一个错误
}; 
}）; 
  
我需要的是在用户释放鼠标左键时发送的消息。以下是发生了什么情况：当我点击 popup.html 中的按钮时，将显示带有文本Hello的警报，但是当我点击页面中的任何位置后那我得到一个错误：未捕获的错误：试图使用一个断开的端口对象 
 
 
 
我在做什么错误，我该如何解决这个问题？
 
 
 
我猜想，当我点击页面时，弹出窗口关闭时，端口断开连接，但我不确定这一点。当您点击其他地方时，弹出不再存在作为文档。这就像一个已关闭的标签。因此，不再需要与任何人沟通。
 
 
 
解决此问题的正确方法是与后台页面进行通信，或者使用非易失性 chrome.storage 。然后，当弹出窗口打开时，您可以使用任一信息源显示内容。
 
So, I need to pass messages from popup to content and vice versa. Currently here is what I am doing now, but this does not work how it's supposed to work:

manifest.json:
{
  // Required
    "manifest_version": 2,
    "name": "Extension name",
    "version": "0.1",
    "content_scripts": [
    {
        "matches": ["*://*/*"],
        "js": ["content.js"]
    }
    ],
    "browser_action" : {
        "default_title" : "Extension name",
        "default_popup" : "popup.html"
    },
    "permissions": [
        "tabs",
        "*://*/*",
        "contextMenus"
    ]

}
popup.js
var port = "";
window.onload = function() 
{
    document.getElementById("captureImage").onclick = captureImage;
}


function captureImage(isBig = true)
{
    chrome.tabs.query({'active': true}, function (tabs) {
        port = chrome.tabs.connect(tabs[0].id, {name: "Besada"});
        port.onMessage.addListener(function(msg) {
            alert(msg.message);
        });
        port.postMessage({message: "getCoords"});
    });
}
and content.js
chrome.runtime.onConnect.addListener(function(port){
    port.onMessage.addListener(function(msg) {

    });

    port.postMessage({message: "hello!"});  // this message I receive

    document.onmouseup = function(e) {
        port.postMessage({message: "hello!"}); // this message produces an error
    };
});
What I need is message to be sent when user releases the left mouse button. Here is what happens: when I am clicking a button in my popup.html, the alert with the text "Hello" shows, but when I am clicking anywhere in the page after that, I am getting an error: Uncaught Error: Attempting to use a disconnected port object

What am I doing wrong and how can I fix this?

My guess the port is disconnecting when popup closes when I click on page, but I'm not really sure about this.
解决方案
The popup ceases to exist as a document when you click elsewhere. It's like a tab that has closed. As such, there's no longer anything to communicate to.

The proper way to fix it is to communicate with the background page instead, or use the non-volatile chrome.storage. Then, when the popup is opened, you can use either information source to show content.

                        
这篇关于“试图使用断开的端口对象”同时从内容发送消息到Chrome扩展程序中弹出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！