Handling AJAX Origin errors, caused by the Chrome Extension - ajax

Question

Is there way to handle AJAX Origin errors from Chrome's extensions ?
Denying load of
chrome-extension://kldbdjcbjohfhddpicldkbifbkcdanid/data.json.
Resources must be listed in the web_accessible_resources manifest key
in order to be loaded by pages outside the extension.
I tried this:
$.ajax({
url: 'chrome-extension://kldbdjcbjohfhddpicldkbifbkcdanid/data.json',
datatype: 'json',
success: function(xhr) {
alert('ok');
},
erro r: function(xhr, status, err) {
alert('status: ' + xhr.status + ' - ' + err);
}
});
but got nothing in variables. error status is "0", error message is empty.

Answer 1

You can try using the jsonp format. This often gets around cross-origin errors.
$.ajax({
url: 'chrome-extension://kldbdjcbjohfhddpicldkbifbkcdanid/data.json',
datatype: 'jsonp',
success: function(xhr) {
alert('ok');
},
erro r: function(xhr, status, err) {
alert('status: ' + xhr.status + ' - ' + err);
}
});

Answer 2

Sounds like you are attempting to load this resource from a content script, based on the error.
You have to explicitly add either the individual extension resources, or patterns that match your extension resources, in the manifest via web_accessible_resources. Your error message states this is the solution.
Once you've done this, you can construct the URL using chrome.extension.getURL(resourcePath).
Here's an excerpt from my manifest:
"web_accessible_resources" : [
"*.html"
]
And here's the code I'm using to request my HTML template file:
var url = chrome.extension.getURL("template.html");
$.get(url,function(data, textStatus, jqXHR){
console.log("Got the template!");
console.log(data);
},"html");