jQuery:离线后POST错误(iOS和Chrome)

Question

我已经构建了一个具有离线功能的HTML5 Web应用程序(使用AppCache).程序流程为:

• 在线:在网络上,应用程序预加载一些基本信息("工作").
• 离线:用户将平板电脑与应用程序脱机,然后在应用程序上执行其工作流程(例如检查和评分).
• 在线:平板电脑重新连接到网络后,会将用户的输入同步(或上传)到中央系统/数据库.

我们已决定将Chrome用于所有离线/ HTML5应用程序(因为支持HTML5).在Windows设备上(使用Chrome),同步/上传可以正常运行.如果用户使用iPad(iOS 7,Chrome),他们第一次尝试同步时会抛出错误 - 但是第一个记录IS实际上是同步的.XHResponse对象引发的错误只是"错误".

我们在服务器端使用WebAPI 2.2,在客户端使用jQuery 2.1.1 AJAX.

执行POST 的客户端JavaScript如下:

try {
    var inspections = GetCompleteInspections();
    if (inspections) {
        for (var i = 0; i < inspections.length; i++) {
            var response = null;
            var data = JSON.stringify(inspections[i]);
            $.ajax({
                async: false,
                type: "POST",
                url: "api/",
                data: data,
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (dta, textStatus, xhr) {
                    window.console.log("data:" + dta + "--");
                    if (d && d < 0) {
                        alert("dta is invalid:" + dta + "--");
                        response = "Error Uploading, please try again";
                    } else {
                        $("#inspection_" + i).hide();
                    }
                },
                error: function (xhr, textStatus, errorThrown) {
                    if (textStatus == "timeout") {
                        alert("timeout!");
                        response = "timeout";
                    } else {
                        window.console.log(xhr.responseText);
                        var errorMessage = errorThrown || xhr.statusText;
                        response = errorMessage;
                    }
                }
            });
            if (response) {
                throw response;
            }
        }
    }
    $('#new_records').append("<tr><td>Sync Complete</td></tr>");
    $('#syncButton').hide();
    ClearInspections();
    $("#dialog-sync").dialog("close");
} catch (err) {
    $("#dialog-sync").dialog("close");
    window.alert("An error occurred during upload\n" + err);
}

这似乎只发生在运行Chrome的iOS设备上.Windows设备没有此问题.有没有办法追踪或诊断发生了什么？甚至如何防止错误发生？

Answer 1

我曾经遇到过一个非常相似的问题，我以一种非常粗俗的方式解决了这个问题：

在进行同步之前，我从网络加载了一个可见的 1x1 透明 png（使用随机查询字符串设置源以避免缓存）。然后，当该图像加载（onload 事件）时，我开始 JavaScript 调用。

直到今天，我不知道是否存在一些潜在的网络问题，或者这是否只是通过在启动时引入时间延迟来解决它，但问题从未再次出现，也没有在野外出现。想想看，可能是时候重构该代码了......