Chrome extensions variable access

Question

I'm busy creating a chrome extensions that needs to check a json format list for urls and compare whenever a new tab or adres is visited. When there's a match it needs to do stuff... But right now i'm not able to access variables from inside a function, i thought it was something with global and local variables but i can't figger it out. The variable i can't reach is u = request.dom; When i check it outside the addListener in the console.log i get undefined.

my code:

Background.js (jquery-1.11.3.js, amplify.js loaded):

loadedwebshops = amplify.store('webshops');
(function loadShops() {
    if (typeof loadedwebshops != 'undefined') {
    } else {
        // load from server
        $.ajax({
            url: '../shoplist.json',
            dataType: 'json',
            data: {}
        }).done(function(data, textStatus, jqXHR) {
            // update the cache
            amplify.store('webshops', data, {
                expires: 60000
            });
            loadedwebshops = amplify.store('webshops');
            //populate.Shops(data);
        }).fail(function(jqXHR, exception) {
        }).always(function() {
        });
        // alert("server");
        if (typeof loadedwebshops === 'undefined') {
            location.reload();
        }
    }
    setInterval(loadShops, 60000);
}
)();
chrome.extension.onMessage.addListener(function(request) {
    u = request.dom;
    requestedUrl(u);
});
$(document).ready(function() {
    var webshops = loadedwebshops["webshops"];
    console.log(webshops);
    function requestedUrl(u){
        console.log(u);
    }
});

Main.js:

var d = document.domain;
chrome.extension.sendMessage({
    dom: d
});

Manifest:

{
    "background": {
        "page": "background.html"
    },
    "browser_action": {
        "default_icon": "icons/actions/1.png",
        "default_title": "toolbar"
    },
    "content_scripts": [{
        "all_frames": true,
        "js": ["lib/jquery-1.11.3.js", "lib/amplify.js", "lib/main.js"],
        "matches": ["http://*/*", "https://*/*"]
    }],
    "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
    "description": "extension",
    "icons": {
        "128": "icons/icon128.png",
        "16": "icons/icon16.png",
        "48": "icons/icon48.png"
    },
    "manifest_version": 2,
    "name": "toolbar",
    "version": "1.1",
    "permissions": ["http://*/*", "https://*/*", "tabs", "cookies",
        "notifications", "contextMenus", "webNavigation", "webRequest",
        "webRequestBlocking", "unlimitedStorage", "storage"
    ]
}

Which variables are you having trouble accessing? Is this your problem: http://stackoverflow.com/q/23667086/2336725 — Teepeemm, Sep 16 '15 at 15:29
Thanks for the comments, it's my first question.. I will adjust it right away. I have trouble with the variable `u`. I can alert it inside the addListener but in the `console.log` it says undefined. `u = request.dom;` u is filled with the url of the visiting tab. — T. Braas, Sep 17 '15 at 07:53
I changed the code a bit, it should now start a function that passes the value. Still nothing; requestedUrl is not defined. — T. Braas, Sep 17 '15 at 08:28
Do you understand the concept of [scopes in javascript](https://www.google.com/#q=scopes+in+javascript)? Your `requestedUrl` function isn't visible anywhere except inside `$(document).ready(function() {` anonymous function. — wOxxOm, Sep 17 '15 at 12:29
Thanks so much, i get it now i removed the whole `$(document).ready(function() {`. If you write this as answer i can give you +1 — T. Braas, Sep 17 '15 at 12:52
Is it okay to post an answer on a basic javascript syntax thing under the chrome-extension-specific tag? Isn't it a duplicate of some generic question like this one http://stackoverflow.com/q/500431/3959875? — wOxxOm, Sep 18 '15 at 11:32
Yeah offcoarse you can post it, thanks for helping me out! I knew about the global var and the local but not about the scopes. Let me know if you post the answer on the generic question ;) — T. Braas, Sep 18 '15 at 14:46

score 0 · Accepted Answer · answered Sep 18 '15 at 14:42

Solved it... The problem was it was inside i different scope $(document).ready(function() {});

The new code is:

loadedwebshops = amplify.store('webshops');
(function loadShops() {
    if (typeof loadedwebshops != 'undefined') {
    } else {
        // load from server
        $.ajax({
            url: '../shoplist.json',
            dataType: 'json',
            data: {}
        }).done(function(data, textStatus, jqXHR) {
            // update the cache
            amplify.store('webshops', data, {
                expires: 60000
            });
            loadedwebshops = amplify.store('webshops');
            //populate.Shops(data);
        }).fail(function(jqXHR, exception) {
        }).always(function() {
        });
        // alert("server");
        if (typeof loadedwebshops === 'undefined') {
            location.reload();
        }
    }
    setInterval(loadShops, 60000);
}
)();
chrome.extension.onMessage.addListener(function(request) {
    u = request.dom;
    requestedUrl(u);
});

var webshops = loadedwebshops["webshops"];
console.log(webshops);
function requestedUrl(u){
    console.log(u);
}

Chrome extensions variable access

1 Answers1