I'm trying to access a cross domain .js file using ajax:
$.ajax({
type:'get',
crossDomain:true,
url: "http://localhost/62588/scripts/bootStrapper.js",
contentType: "application/json",
dataType: 'jsonp'
}).done(callback);
I have a callback at the moment:
getBootStrapperScript(function (callback) {
//do somethibg
})
I get the following error:
XMLHttpRequest cannot load http://localhost/62588/scripts/bootStrapper.js. Origin http://localhost:62607 is not allowed by Access-Control-Allow-Origin.
I have been reading about JSONP but I'm not sure how to use it to load a .js file from anoather domain.
If I change the above code to use 'jsonp' for the datatype but I then get this errer:
GET http://localhost/62588/scripts/bootStrapper.js?callback=jQuery18206067646441515535_1354459693160&_=1354459696966 404 (Not Found)
How can I load cross domain js files?
I'm trying to access a cross domain .js file using ajax:
$.ajax({
type:'get',
crossDomain:true,
url: "http://localhost/62588/scripts/bootStrapper.js",
contentType: "application/json",
dataType: 'jsonp'
}).done(callback);
I have a callback at the moment:
getBootStrapperScript(function (callback) {
//do somethibg
})
I get the following error:
XMLHttpRequest cannot load http://localhost/62588/scripts/bootStrapper.js. Origin http://localhost:62607 is not allowed by Access-Control-Allow-Origin.
I have been reading about JSONP but I'm not sure how to use it to load a .js file from anoather domain.
If I change the above code to use 'jsonp' for the datatype but I then get this errer:
GET http://localhost/62588/scripts/bootStrapper.js?callback=jQuery18206067646441515535_1354459693160&_=1354459696966 404 (Not Found)
How can I load cross domain js files?
Share Improve this question edited Dec 2, 2012 at 14:57 NullPoiиteя 57.3k23 gold badges128 silver badges146 bronze badges asked Dec 2, 2012 at 14:55 davydavy 4,56210 gold badges50 silver badges72 bronze badges 5- 3 looks like you are victim of same origin policy – NullPoiиteя Commented Dec 2, 2012 at 14:57
- This may help you, stackoverflow./questions/6114436/… – Adil Commented Dec 2, 2012 at 14:58
- 2 There's a special function that does this for you, it's called $.getScript(), and it get's the external javascript file and inserts it. An other way would be to look at how Google does it with stuff like the analytics file, inserting a script tag into the head, and do something like that. Using an Ajax call with jsonp is NOT the way to do it. – adeneo Commented Dec 2, 2012 at 15:00
- Why the down vote? Genuinely interested so I can provide better questions in future :) – davy Commented Dec 2, 2012 at 16:02
- Thanks all - see ment on Darins answer. – davy Commented Dec 2, 2012 at 16:35
1 Answer
Reset to default 6Don't use any AJAX, simply use the $.getScript
function:
$.getScript('http://localhost/62588/scripts/bootStrapper.js').done(callback);
As you know, you could be pointing the <script>
tag to any domain you wish without violating the same origin policy. That's the basis of JSONP. But you don't need any JSONP, because all you need is to reference a script form a remote domain, which is as simple as pointing the <script>
tag to this script or if you want to do it dynamically use the $.getScript
function that jQuery has to offer you.
UPDATE:
The $.getScript
function will append a random cache busting parameter to the url. If you want to get a cached version of your script you could define a custom cachedScript
function as shown in the documentation:
jQuery.cachedScript = function(url, options) {
options = $.extend(options || {}, {
dataType: 'script',
cache: true,
url: url
});
return jQuery.ajax(options);
};
and then:
$.cachedScript('http://localhost/62588/scripts/bootStrapper.js').done(callback);