CODEWITHSUNDEEP
apigoogle-chromegoogle-chrome-extensiongoogle-calendar-api
joshholat
joshholat

Reputation: 3401

Chrome Extensions and loading external Google APIs Uncaught ReferenceError

Right now I'm in the process of creating a Chrome extension. For it, I need to use Google's Calendar Data API. Here is my manifest.json file:

{
"name": "Test",
"version": "1.0",
"background_page": "background.html",
"content_scripts": [
    {
    "matches": ["<all_urls>"],
    "js": ["jquery.js", "content_script.js"]
    }
],
"permissions": [
    "tabs", "http://*/*"
]

}

I've tried adding the following to the js part of the manifest file but that throws an error when loading the extension.

http://www.google.com/jsapi?key=keyhere

I've also tried adding

document.write('<script type="text/javascript" src="http://www.google.com/jsapi?key=keyhere"></script>');

to my background.html file. However, whenever I call

google.load("gdata", "1");

I get an error that says Uncaught ReferenceError: google is not defined. Why is my extension not loading this api when it loads the other ones fine?

Upvotes: 1

Views: 4411

Answers (3)

asifgoldpk
asifgoldpk

Reputation: 11

This is because there is some syntax error in your code. I had same problem. I opened my background.html page in fire fox with fire-bug plug-in enabled. Fire-bug console should me the error, I fixed and it is working now.

Upvotes: 0

joshholat
joshholat

Reputation: 3401

Thanks for that link, it helped a lot. However, now I've run into another interesting problem.

    for (var i = rangeArray.length - 1; i >= 0; i--) {
    var myLink = document.createElement('a'); 
    myLink.setAttribute('onclick','helloThere();'); 
    myLink.innerText ="GO";
    rangeArray[i].insertNode(myLink);
}

Now I get the error, "helloThere is not defined" even though I placed that function about ten lines above the current function that has the above loop in the same file. Why might this be happening? And if I do:

    for (var i = rangeArray.length - 1; i >= 0; i--) {
    var myLink = document.createElement('a'); 
    myLink.setAttribute('onclick','chrome.extension.sendRequest({greeting: "hello"}, function(response) { });'); 
    myLink.innerText ="GO";
    rangeArray[i].insertNode(myLink);
}

I get Uncaught TypeError: Cannot call method 'sendRequest' of undefined

Upvotes: 0

serg
serg

Reputation: 111285

You can't include external script into content_scripts.

If you want to inject <script> tag using document.write then you need to mask slash in a closing tag:

document.write('...<\/script>');

You can include your external api js into background page just as usual though:

<script type="text/javascript" src="http://www.google.com/jsapi?key=keyhere"></script>

If you need this api in content scripts then you can send a request to your background page and ask it to do API-dependent stuff there, and then send a result back to your content script.

Upvotes: 1

Related Questions