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

I've built an HTML5 web application with offline capabilities (using AppCache). The program flow is:

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

Online: While on the network, the app pre-loads some base information ("working").
在线:在网络上，应用会预载一些基本信息(“工作”)。
Offline: The user takes the tablet with the app offline, then performs their workflow on the app (e.g. inspections and grading).
脱机:用户将平板电脑与app脱机，然后在app上执行他们的工作流程(例如检查和评分)。
Online: Once the tablet reconnects to the network, it syncs (or uploads) the user's input into the central system/database.
在线:一旦平板电脑重新连接到网络，它会同步(或上传)用户的输入到中央系统/数据库。

We have made a business decision to use Chrome for ALL offline/HTML5 applications (because of HTML5 support). On a Windows device (using Chrome), the sync/upload works with no problems. If the user is using an iPad (iOS 7, Chrome), the first time they try to sync, an error is thrown - however the very first record IS actually synced. The error that is thrown by the XHResponse object is just "error".

我们已经做出了一个商业决定，将Chrome用于所有的离线/HTML5应用程序(因为支持HTML5)。在Windows设备上(使用Chrome)，同步/上传没有问题。如果用户正在使用iPad (iOS 7, Chrome)，第一次尝试同步时，就会抛出一个错误——然而，第一个记录实际上是同步的。XHResponse对象抛出的错误就是“error”。

We are using WebAPI 2.2 on the server side, and jQuery 2.1.1 AJAX on the client side.

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

The client-side JavaScript that performs the POST is as follows:

执行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);
}

This only appears to happen on iOS devices running Chrome. Windows devices do not have this issue. Is there any way to trace or diagnose what is going on? Or even how to prevent the error from happening?

这似乎只发生在运行Chrome的iOS设备上。Windows设备没有这个问题。有什么方法可以追踪或诊断正在发生的事情吗?甚至如何防止错误发生?

1 个解决方案

#1

I had a very similar problem once which I hacked around in a truly gross way:

有一次，我遇到了一个非常相似的问题，我用一种非常粗俗的方式来处理:

Before doing the sync, I loaded a visible 1x1 transparent png from the network (set the source with a random query string to avoid caching). Then when that image loaded (onload event) I started the JavaScript calls.

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

To this day I don't know if there's some underlying network issue or if this only solved it by introducing a time delay on startup, but the problem never recurred and hasn't come up in the wild. Come to think of it, it's probably time to refactor that code...

到目前为止，我还不知道是否存在潜在的网络问题，也不知道这是否只是通过在启动时引入延时来解决的，但是这个问题从来没有出现过，也没有出现过。想想看，可能是时候重构代码了……

1 个解决方案

#1

更多相关文章

随机推荐