当$.ajax()不起作用时,并行调用$

Parallel calls $.when with $.ajax() not working

本文关键字:并行 调用 ajax 不起作用      更新时间:2023-09-26

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <title>Sample Title</title>
</head>
<body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> </script>
    <script>
        $.when(
            // Get the first call
            $.ajax("delay_test.php"),
            // Get the second call
            $.ajax("delay_test.php")
        ).then(function(first,second) {
            $("body").append("Done: "+first[0]+"<br>Done: "+second[0]);
        });
    </script>
</body>
</html>

我还编写了一个php代码来测试这一点,看看它是否真的避免了在第一次调用完成后进行第二次调用。

<?php
    sleep(5);
    echo date("H:i:s");
?>

但我收到的是5秒的差异:

Done: 15:27:55
Done: 15:28:00

是我做错了什么还是误解了什么?

首先,让我说您可以通过在AJAX请求中使用cache:false来解决问题:

$.when(
  // Get the first call
  $.ajax({url:"delay.php",cache:false}),
  // Get the second call
  $.ajax({url:"delay.php",cache:false})
).then(function(first,second) {
  $("body").append("Done: "+first[0]+"<br>Done: "+second[0]);
});

现在让我扩展一下,说我不太确定为什么。chrome正在等待第一个AJAX请求发送第二个请求的结果;也许是在等待它是否应该从缓存中提取结果。也许有更了解Chrome的人可以说出原因。我在IE 11中没有这个问题,也没有测试FireFox、Safari、Opera等。

或者,如果您不想使用对象并定义urlcache(cache:false选项只是在URL上附加一个时间戳,使其唯一(,则可以在URL的末尾附加一个GET变量。类似于:

$.when(
  // Get the first call
  $.ajax("delay.php?r1"),
  // Get the second call
  $.ajax("delay.php?r2")
).then(function(first,second) {
  $("body").append("Done: "+first[0]+"<br>Done: "+second[0]);
});

编辑:另一种选择是在PHP脚本中不设置缓存头。如果你使用这种方法,你可能必须首先清除缓存,因为你的浏览器可能已经缓存了它:

header("Cache-Control: no-store, no-cache, must-revalidate, max-age=0");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");

尽管上面的建议在我的测试中不起作用。