在iPad上使用JQuery时出现Ajax错误

概述我们的某个生产网络应用中存在问题,但仅限于iPad / iOS8. 基本上,在我们的应用程序中,用户通过点击代表不同产品的图像将产品添加到他的购物车.当图像被轻击时,产品被“选中”并进行ajax异步调用;此电话更新我们的购物车.每次异步调用持续5-10秒. 当用户按顺序多次点击时,会出现问题(但仅限在iPad上,而不是在Chrome桌面上等).然后,第n个ajax调用失败并显示“错误0”.注意：当 我们的某个生产网络应用中存在问题,但仅限于iPad / iOS8.

基本上,在我们的应用程序中,用户通过点击代表不同产品的图像将产品添加到他的购物车.当图像被轻击时,产品被“选中”并进行AJAX异步调用;此电话更新我们的购物车.每次异步调用持续5-10秒.

当用户按顺序多次点击时,会出现问题(但仅限在iPad上,而不是在Chrome桌面上等).然后,第n个AJAX调用失败并显示“错误0”.注意：当一个已经执行时,我们无法阻止第二个AJAX调用(正如一些答案所暗示的那样),因为购物车不会正确更新.

我在Jsfiddle示例中跟踪了这种行为,你可以在这里找到：

http://jsfiddle.net/oc1ktv6u/30/

function updateCart(){var data = {        Json: $.toJsON({            text: 'some text',array: [1,2,'three'],object: {                par1: 'another text',par2: [3,'one'],par3: {}            }        }),delay: Math.round(Math.random()*12)}$.AJAX({    url:"/echo/Json/",data:data,type:"POST",success:function(response)    {       $(".target").append("+");    },error:function(xhr,AJAXOptions,thrownError)     {        alert("There was an error in the AJAX call: ["+xhr.status+"] ["+thrownError+"]");    }});}

我的主要问题是：

>为什么会发生这种情况(以及为什么,显然只在iPad / Safari上)？

解决方法 正如其他答案所提到的那样,您应该有一个队列来处理这些请求,并确保按照创建顺序处理它们：

var active = false;var requests = [];var updateCart = function (data) {if(active) {    requests.push(data);} else {    $.AJAX({        type: 'POST',url: url,data: data,beforeSend: function() {            active = true;            //show loading on the cart symbol or something to tell the user there is a process going on,UX goodness        },success : function() {            active = false;            if(requests.length > 0) {                next = requests.shift();                updateCart(next);            }        }    });};

这个网站似乎可以让您深入了解一次可用的活动连接数量,您可以在iPad http://www.browserscope.org/?category=network上进行测试

我自己运行它并且提到了17个最大连接,但我也很好奇你使用这些iPad的网络,如果它比较慢,比如3G或Edge,那么这些连接可能会很快恢复.我在Wifi上测试我的iPad并且无法在小提琴上重现你的错误.希望这有助于至少诊断问题.

总结

以上是内存溢出为你收集整理的在iPad上使用JQuery时出现Ajax错误全部内容，希望文章能够帮你解决在iPad上使用JQuery时出现Ajax错误所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。