javascript - one more time about: Error: Attempting to use a disconnected port object, how to? - Stack Overflow

here is my setup

background.js

var port = null;
function setPort() {
    chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
        port = chrome.tabs.connect(tabs[0].id, {name: "CONTENTSCRIPT"});
    });
}

// when i click on something, get the port and send a message
function clickHandler(e) {
    setPort();
    if (port) {
        port.postMessage({key: 'message', value: true});
    }
}

contentscript.js

chrome.runtime.onConnect.addListener(function (port) {
    if (port.name == "CONTENTSCRIPT") {
        port.onMessage.addListener(function (msg) {
            console.log(msg);
        });
    }
});

what i am doing is clicking on a contextMenu button on random tabs and trying to send a meessage.

what happens is that first tine i click, nothing happens, no errors. the second time i click the message goes through.

if i switch to another tab, and click on the menu button, i get the Error: Attempting to use a disconnected port object error. If i click again the message gets sent successfully

I've tried to use var port = chrome.runtime.connect({name: "CONTENTSCRIPT"}); but that errors out with a disconnected port every time

ideas?

here is my setup

background.js

var port = null;
function setPort() {
    chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
        port = chrome.tabs.connect(tabs[0].id, {name: "CONTENTSCRIPT"});
    });
}

// when i click on something, get the port and send a message
function clickHandler(e) {
    setPort();
    if (port) {
        port.postMessage({key: 'message', value: true});
    }
}

contentscript.js

chrome.runtime.onConnect.addListener(function (port) {
    if (port.name == "CONTENTSCRIPT") {
        port.onMessage.addListener(function (msg) {
            console.log(msg);
        });
    }
});

what i am doing is clicking on a contextMenu button on random tabs and trying to send a meessage.

what happens is that first tine i click, nothing happens, no errors. the second time i click the message goes through.

if i switch to another tab, and click on the menu button, i get the Error: Attempting to use a disconnected port object error. If i click again the message gets sent successfully

I've tried to use var port = chrome.runtime.connect({name: "CONTENTSCRIPT"}); but that errors out with a disconnected port every time

ideas?

• javascript
• google-chrome
• tabs
• google-chrome-app
• content-script

Share Improve this question Follow edited Apr 8, 2014 at 17:30 Patrioticcow asked Apr 8, 2014 at 17:20 PatrioticcowPatrioticcow 27.1k7676 gold badges221221 silver badges340340 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

Your problem lies in the fact that chrome.tabs.query is asynchronous.

You execute setPort(), that immediately returns before query executes the callback and sets up port. At this moment, port is either null or refers to your previous tab's port.

Therefore, you either get no error, or an error because the old port is invalid.

After that happened, the callback in query gets executed and port is set up for the next munication.

---

So, to fix that, you need to send the message after the port is set up in the call chain. Example:

function setPort(callback) {
    chrome.tabs.query({active: true, currentWindow: true}, function (tabs) {
        port = chrome.tabs.connect(tabs[0].id, {name: "CONTENTSCRIPT"});
        callback(port);
    });
}

function clickHandler(e) {
    setPort( function (port) {
        if (port) { port.postMessage({key: 'message', value: true}); }
    });  
}

---

Edit: by the way, you're supposed to reuse a port, it's kind of the point. If you're re-establishing the connection every time, you're better off with sendMessage, though I suppose you only used the code above for testing.