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

Question

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.

Answer 1

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+.