Question

我正在尝试从其他域获取json，我的代码如下：

var token = '';
function getData(){
  console.log("get data suc");
  for (var i=0; i < urls.length; i++){
     var code = 'http://example.com/api/'+ urls[i];
     $.ajax({
       async: false,
       url: code,
       type: 'GET',
       dataType: 'jsonp',
       success: function(data) { showData(data); },
       error: function() { console.log('ajax Failed!'); },
       beforeSend: setHeader,
     });
  }
}
function showData(data){
  $("<tr></tr>").append("<td>" + data + "</td>")
    .appendTo("#results");
  console.log(data);
}
function setHeader(xhr) {
  xhr.setRequestHeader('Authorization', token);
}

此结果应显示为我从数组网址提供的密钥的顺序。例如：urls = [1,2,3,4]→应该[一，二，三，四] 但我总是得错了订单！（例如：[两个，一个，三个，四个]或[三个，四个，两个，一个]）发生了什么？那“async：false”不起作用吗？为什么？

Answer 1

您使用的jsonp请求不支持async:false。

默认情况下，所有请求都是异步发送的（即设置为默认为true）。如果需要同步请求，请将此选项设置为假。跨域请求和dataType：“jsonp”请求没有支持同步操作。请注意，同步请求可能暂时锁定浏览器，在请求时禁用任何操作很活跃。

所以试试

function getData() {
    function request(urls, i) {
        var code = 'http://example.com/api/' + urls[i];
        $.ajax({
            async: false,
            url: code,
            type: 'GET',
            dataType: 'jsonp',
            success: function (data) {
                showData(data);
            },
            error: function () {
                console.log('ajax Failed!');
            },
            beforeSend: setHeader,
        }).always(function () {
            i++;
            if (i < urls.length) {
                request(urls, i);
            }
        });
    }
    console.log("get data suc");
    request(urls, 0);
}

Answer 2

您的假设是正确的，async: false不适用于JSONP请求。

如果您确实需要同步行为，则需要一系列请求，其中第一个成功回调启动第二个，依此类推。但实际上，如果您只是按照它们出现的顺序处理响应，那将是更好的选择。

例如，您可以传递索引变量：

function getCallback(i) {
   return function(data) {
      showData(data, i);
   };
};

...

$.ajax({
   ...
   success: getCallback(i)
 });

...

function showData(data, i){
   // use 'i' here to determine where to insert the record
}

我设置ajax async：false但不工作

2 个答案: