Question

我正在尝试使用jquery的$.ajax或$.getJSON从其他服务器获取文件，但是我正在点击access-control-allow-origin墙，并且jsonp选项看起来不像为我工作。

该网站正在使用jQuery 1.5.1。

以下是我的三项测试：

使用基本的$ .ajax，请求的网址永远不会附加?callback=?：

$.ajax({
    url: url,
    datatype: 'jsonp',
    error: function(){console.log('error');},
    success: function(){console.log('success');}
});

使用基本的$ .ajax进行黑客攻击，仍会遇到跨网站问题：

$.ajax({
    url: url + '.jsonp?callback=?',
    datatype: 'jsonp',
    error: function(){console.log('error');},
    success: function(){console.log('success');}
});

使用$ .getJSON可以解决跨站点问题，但永远不会触发错误情况：

$.getJSON(url + '?callback=?',
    function(data){
        console.log('success');
    })
    .error(function(){
        console.log('error');
    })
    .success(function(){
        console.log('success!');
    });

任何人都能看到我做错了什么？最后，我正在尝试测试是否存在url，如果不存在则执行错误操作。

修改：我尝试访问的网址不存在。我期待触发错误案例。

Answer 1

为了能够从javascript访问外部资源。远程资源必须在响应头中包含access-control-allow-origin。如果您可以控制该资源，则需要将此响应标头添加到*（如果您想要更受限制的访问控制，则需要添加您的域名。）

在此处详细了解：http://enable-cors.org/

如果您不控制该外部资源。解决方案更棘手。有些人利用YUI来做跨域的ajax调用。见这里：http://jpvalappil.wordpress.com/2010/01/04/cross-domain-ajax-the-yui-way/。

如果您正在编写chrome扩展程序，则API允许您向您的扩展程序授予权限，以便从js访问其他域的资源。

Answer 2

您可以使用jQuery-JSONP。此脚本允许您捕获错误（尽管没有任何有意义的错误消息）。

   $.jsonp({
      "url": "http://gdata.youtube.com/feeds/api/users/"+userId+"?callback=?",
      "data": {
          "alt": "json-in-script"
      },
      "success": function(userProfile) {
          // handle user profile here 
      },
      "error": function(d,msg) {
          alert("Could not find user "+userId);
      }
    });

主流浏览器支持：

Internet Explorer 6 +
Firefox 2 +
Chrome 1 +
Safari 3 +
Opera 9 +

Answer 3

您必须指定超时：

$.ajax({
    dataType: "jsonp",
    url : url,
    timeout : 1000
})
    .done(function(data) {logdata(data); })
    .fail(function() { logdata("error"); });

Answer 4

您使用的是数据类型，但您应该使用dataType。

jQuery ajax和getJSON请求命中访问控制允许来源问题

4 个答案: