如何从任何页面的JavaScript访问谷歌浏览器扩展程序

Question

I am trying to figure out how can I call into my extension from a normal web page. All documentation that I find seems to be either for communication between extensions, or between content scripts and extensions.

Any pointers are much appreciated!

Answer 1

I think you should make a content script, that injects an object into your page that calls your extension.

Create a content script that injects YourExt.js into every page, which should contain:

var YourExt = {
doThis: function () {
    chrome.extension.sendRequest('doThis');
},
doThat: function () {
    chrome.extension.sendRequest({
        action: 'doThat',
        params: ['foo','bar']
    });
}
}

Answer 2

While extensions can't access page variables and vice versa, you can communicate between page and extension through events. Here is a quick example of creating custom events:

function fireEvent(name, target) {
    //Ready: create a generic event
    var evt = document.createEvent("Events")
    //Aim: initialize it to be the event we want
    evt.initEvent(name, true, true); //true for can bubble, true for cancelable
    //FIRE!
    target.dispatchEvent(evt);
}

function foobar() {
    alert("foobar");
}

function testEvents() {
    window.addEventListener("foobar", foobar, false); //false to get it in bubble not capture.
    fireEvent("foobar", document);
}

(taken from here )

So if you need to pass information from a page to an extension, you would need to fire a custom event on a page which you will be listening to in your content script.