Global Variables in Chrome Extensions

Question

Is there a simple way where I can access a global javascript variable through content-scripts in chrome extensions?

Accessing global object from content script in chrome extension

I followed the steps mentioned in the above link, but it did not work out for me. Any help would be much appreciated.

Thanks, Shankar

Answer 1

For those from the future looking for an answer to this question, here's how I do it:

function getVariable(v) {
    var c = document.createElement("div");
    c.id = 'var-data';
    c.style.display = 'none';
    document.body.appendChild(c);
    var s = document.createElement('script');
    s.innerHTML = 'document.getElementById("var-data").innerText=JSON.stringify('+v+');';
    document.head.appendChild(s);
    var data = JSON.parse(c.innerText);
    c.remove();
    s.remove();
    return data;
}

And basic usage:

getVariable('globalVarIWantToAccess');

All this script goes in the content-script, not the code for the main webpage, which means that no co-operation is needed from the webpage itself. Basically, the getVariable function creates a script element which is injected into the main page. This script tag retrieves the requested global variable and puts the data into a new div. The function then gets this data from the new div, deletes the new div, deletes the new script element and returns the data.