How do I pass back data from a remote window to a chrome extension's background page?

Question

I have a chrome extension, and from my background page I open a remote window:

chrome.windows.create({
        type : 'popup',
        url : "https://www.example.com/mypage.html"
    }, function(newWindow) {

    });

On my remote page (https://www.example.com/mypage.html) I am waiting for the user to perform an action. When this action is performed, I need to pass back to the extension some data.

How can I do this? I could not find anything relevant in the docs (http://developer.chrome.com/extensions/messaging.html)

Coranto

Use content scripts and message passing. – Colorcast

@RobW thanks.Tried the "Sending messages from web pages" part but I get that "'externally_connectable' requires Google Chrome dev channel or newer, and this is the stable channel.".How can this work in production? It is strange that I cannot find a complete example for this kind of communication, if you have one it would be much appreciated. – Coranto

#10527495 – Colorcast

Answer 1

It is basically possible. What you should do is to use the content script as a bridge between your newly created window and your background script. For example:

Your background script:

chrome.runtime.onMessage.addListener(function(message, sender, sendResponse) {
    alert("message received");
});
chrome.windows.create({
    type : 'popup',
    url : "http://yoursite.com/page.html",
    type: "popup"
}, function(newWindow) {

});

Your content script:

document.addEventListener("hello", function(data) {
    chrome.runtime.sendMessage("test");
})

page.html:

<script>
    var go = function() {
        var event = document.createEvent('Event');
        event.initEvent('hello');
        document.dispatchEvent(event);
    }
</script>
<a href="javascript:go();">Click me</a>

So, the idea is to dispatch an event from the page using document object. The content script listens for that event and once occur send a message to the background script where your code is originally.

Beldam

Important to note that yoursite.com must be included in manifest.json file under "content_scripts"... "matches": [ here ]. Your answer saved me a headache, thanks. – Shinny

Answer 2

I believe messaging isn't necessary for what you're doing. (Unless I'm missing something.) I'm experimenting with creating an extension, and needed to create a popup to query the user for some information. At first I used messaging, then I read the following page:

http://developer.chrome.com/extensions/event_pages.html

Include a js in your html page which uses either extension.getBackgroundPage or runtime.getBackgroundPage [use the latter if you're using a non-persistent background page] to get at the background script. It could be as easy invoking a function on your background page like this:

extension.getBackgroundPage().sendDataOrWhateverYouCallIt(data);

Feudist