Question

I need to do a cross-domain request in a chrome extension. I know I can it via message passing but I’d rather stick to just jQuery idioms (so my javascript can also work as a <script src="">).

I do the normal:

$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data) {
  console.log(data);
});

but in the error console I see:

Uncaught ReferenceError: jsonp1271044791817 is not defined

Is jQuery not inserting the callback function correctly into the document? What can I do to make this work?

(If I paste the code into a chrome console, it works fine, but if I put it as the page.js in an extension is when the problem appears.)

Answer 1

Alas, none of these worked, so I ended up doing the communication via the background.html.

background.html

<script src="http://code.jquery.com/jquery-1.4.2.js"></script>
<script>
function onRequest(request, sender, callback) {
  if (request.action == 'getJSON') {
    $.getJSON(request.url, callback);
  }
}

chrome.extension.onRequest.addListener(onRequest);
</script>

javascripts/page.js

chrome_getJSON = function(url, callback) {
  console.log("sending RPC");
  chrome.extension.sendRequest({action:'getJSON',url:url}, callback);
}

$(function(){
  // use chrome_getJSON instead of $.getJSON
});