Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Chrome Extension: Port error: Could not establish connection. Receiving end does not exist.

When trying to communicate between my Content- and Background Script I get the following errors:

Port error: Could not establish connection. Receiving end does not exist.
Error in event handler for 'undefined': Cannot read property 'message' of undefined       
TypeError: Cannot read property 'message' of undefined

background.js

function onRequest(request, sender, callbackFunction) {
    console.log("Me (BS) became this Message:" + request.message);
    sendResponse({message: request.message})
};
chrome.extension.onRequest.addListener(onRequest);

streamcloud.js

function contactBackground(nachricht){
    chrome.extension.sendMessage({message: nachricht}, function(response) {
        console.log("The Background Script got the following Message: " + response.message);
    });
}

and my manifest.json

{
  "name": "InstantWatch - Dev",
  "manifest_version": 2,
  "version": "0.7",
  "permissions": ["tabs", "http://*/", "https://*/"],
  "background": {
    "scripts": ["background.js"]
  },  
  "browser_action": {
    "default_title": "InstantWatch",
    "default_icon" : "icon.ico"
  },
  "content_scripts": [
    {
      "matches": ["http://*/*", "http://*/*"],
      "js": ["jquery.js", "streamcloud.js"]
    }
  ]
}

I found the solution to add an background_page: "background.html" with an empty background.html, but since background_page isn't supported since manifest_version: 2, I can't use that.

like image 607
Gumble Avatar asked Aug 04 '12 19:08

Gumble


2 Answers

Instead of

chrome.extension.onRequest.addListener(onRequest);

Use

chrome.extension.onMessage.addListener(onRequest);

Since you are using sendMessage and not sendRequest.

Message parsing has been updated in the new version of Chrome. sendRequest and onRequest are being deprecated. It is recommended to go with sendMessage and onMessage.

Refer docs for message parsing between Content Script and Background.

like image 45
Udbhav Avatar answered Sep 29 '22 05:09

Udbhav


sendMessage and onRequest are not compatible.

If you need to support Chrome 19 and earlier, use onRequest and sendRequest:

chrome.extension.onRequest.addListener(function(request, sender, sendResponse) {
    // Warning: Chrome 19- [receiver]
});
chrome.extension.sendRequest(message, optional_sendResponse);

For Chrome 20 - 25, use chrome.extension.onMessage and chrome.extension.sendMessage:

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    // Chrome 20+
});
chrome.extension.sendMessage(message, optional_sendResponse);

For Chrome 26+, use chrome.runtime.onMessage and chrome.runtime.sendMessage.


Note: As of Chrome 26, the deprecated methods are still supported, albeit undocumented. If you get a chance, update your extension to use the new methods, to ensure that your extension will still work in the future.
See this answer for code to create a which is compatible with Chrome 20+.

like image 192
Rob W Avatar answered Sep 29 '22 05:09

Rob W