chrome.runtime.sendMessage();

I want to pass multiple (to be specific 2) messages from my contentscript.js to popup.js.

I don't need other arguments for this function, I only need the message argument.

In my contentscript.js I have this:

chrome.runtime.sendMessage(message1);

chrome.runtime.sendMessage(message2);

Here is my popup.js:

chrome.runtime.onMessage.addListener(function(messsage1){
 //code for handling the message
});

chrome.runtime.onMessage.addListener(function(messsage2){
 //code for handling the message
});

I want to bine these two functions into a single function and handle the messages like:

 chrome.runtime.onMessage.addListener(function(){
   // how to write the parameter for this function, I can't use ',' right?
   // code for handling the message1, message2
});

How can I do this?

chrome.runtime.sendMessage();

I want to pass multiple (to be specific 2) messages from my contentscript.js to popup.js.

I don't need other arguments for this function, I only need the message argument.

In my contentscript.js I have this:

chrome.runtime.sendMessage(message1);

chrome.runtime.sendMessage(message2);

Here is my popup.js:

chrome.runtime.onMessage.addListener(function(messsage1){
 //code for handling the message
});

chrome.runtime.onMessage.addListener(function(messsage2){
 //code for handling the message
});

I want to bine these two functions into a single function and handle the messages like:

 chrome.runtime.onMessage.addListener(function(){
   // how to write the parameter for this function, I can't use ',' right?
   // code for handling the message1, message2
});

How can I do this?

• javascript
• google-chrome
• google-chrome-extension
• message-passing

3 Answers 3

I would send the messages as JSON objects, with an additional property to specify which type of message it is. For example:

chrome.runtime.sendMessage({content: "Message1", type: "m1"});

chrome.runtime.sendMessage({content: "Message2", type: "m2"});

And then you can bine the message listener into one function:

chrome.runtime.onMessage.addListener(function(message) {
  if(message.type == "m1") {
    console.log("First message: ", message.content);
  }
  if(message.type == "m2") {
    console.log("Second message: ", message.content);
  }
}

Of course this is just a rough example - you should tailor the structure of the JSON objects to your extension's requirements, but this is the pattern that I would use.

contentscript.js

 chrome.runtime.sendMessage({
                greeting: "message1"
            })
chrome.runtime.sendMessage({
                greeting: "message2"
            })

popup.js

  chrome.runtime.onMessage.addListener(
        function (request, sender, sendResponse) {
        if (request.greeting == "message1") {
        //action 1
        } else if (request.greeting == "message2") {
            //action 2
        }
    });

API: http://developer.chrome./extensions/messaging

runtime.sendMessage can be used only for one-time requests as per documentation. Consider using tabs.connect instead.

This is the code for the extension page to connect to your tab:

var port = chrome.tabs.connect(tab.id);
port.postMessage({type: "first", content: "Hi!"});
port.postMessage({type: "second", content: "How are you?"});

And this code should be specified in the content script:

chrome.runtime.onConnect.addListener(function(port) {
  port.onMessage.addListener(function(msg) {
    if (msg.type == 'first') {
      ...
    }
    if (msg.type == 'second') {
      ...
    }
  });   
};