使用ajax加载.js文件跨域

时间:2012-12-02 14:55:56

标签: javascript jquery

我正在尝试使用ajax访问跨域.js文件:

$.ajax({
    type:'get',
    crossDomain:true,
    url: "http://localhost/62588/scripts/bootStrapper.js",
    contentType: "application/json",
    dataType: 'jsonp'    
}).done(callback);

我现在有一个回调:

getBootStrapperScript(function (callback) {         
       //do somethibg
})

我收到以下错误:

XMLHttpRequest cannot load http://localhost/62588/scripts/bootStrapper.js. Origin http://localhost:62607 is not allowed by Access-Control-Allow-Origin.

我一直在阅读有关JSONP但我不确定如何使用它从anoather域加载.js文件。

如果我将上面的代码更改为使用'jsonp'作为数据类型,但我得到了这个错误:

GET http://localhost/62588/scripts/bootStrapper.js?callback=jQuery18206067646441515535_1354459693160&_=1354459696966 404 (Not Found) 

如何加载跨域js文件?

1 个答案:

答案 0 :(得分:6)

不要使用任何AJAX,只需使用$.getScript功能:

$.getScript('http://localhost/62588/scripts/bootStrapper.js').done(callback);

如您所知,您可以将<script>标记指向您希望的任何域,而不会违反same origin policy。这是JSONP的基础。但是您不需要任何JSONP,因为您只需要从远程域引用脚本,这就像将<script>标记指向此脚本一样简单,或者如果您想动态地使用{ {1}} jQuery必须为您提供的功能。


更新:

$.getScript函数会将随机缓存清除参数附加到网址。如果您想获得脚本的缓存版本,可以定义自定义$.getScript函数,如文档中所示:

cachedScript

然后:

jQuery.cachedScript = function(url, options) {
    options = $.extend(options || {}, {
        dataType: 'script',
        cache: true,
        url: url
    });
    return jQuery.ajax(options);
};