javascript - 在 IOS 中触发触摸时，HTML5 Web SQL 事务无错误地跳过

Question

我在 IOS 设备上进行数据库事务时遇到问题。 如果用户不触摸手机，一切都会按预期进行。 如果用户点击/滚动/触摸屏幕，一些交易会直接调用它们的 successCallback，而不会调用实际的交易回调。

此处的简化示例:http://jsfiddle.net/Tk9rv/

要测试，只需打开 http://jsfiddle.net/Tk9rv/embedded/result/在 IOS 上的移动 safari 中，加载时不要触摸设备。您将看到正在生成的调试消息列表，如下所示:

database is running
table will be cleared
store method called for '10'.
about to insert '10'.
transaction successful for '10'
store method called for '9'.
about to insert '9'.
transaction successful for '9'
store method called for '8'.
about to insert '8'.
transaction successful for '8'
[...]

现在，重新加载页面并在加载时随机滚动和点击。 您会看到一些“即将插入...”消息丢失。

database is running
table will be cleared
store method called for '10'.
about to insert '10'.
transaction successful for '10'
store method called for '9'.
about to insert '9'.
transaction successful for '9'
store method called for '8'.
transaction successful for '8' <-- WHERE IS MY "about to insert '8'." ???
store method called for '7'.
about to insert '7'.
transaction successful for '7'
[...]

这是因为transactionCallback被完全跳过了!但为什么？为什么触发 successCallback 而不是 errorCallback？

[这是一个简化的例子，请不要告诉我不要做这个 setTimeout 的东西。在现实世界中，有数据被异步加载然后被插入... :) ]

我觉得这里也有类似的问题HTML5 Web SQL transaction Missing In Action但也没有解决方案或提示。

有什么想法吗？我卡住了……谢谢!

Answer 1

我们的测试表明，每当键盘显示时也会发生此行为，并且会阻止 onblur 或 onfocus 事件中的事务(尽管不是 onkey{down|up|press})。使用 setTimeout 会导致严重的性能问题。我们发现 .transaction() 成功回调会被触发，即使没有调用交易回调，所以想出了这个对我们很有效的方法:

var oldOpenDatabase = window.openDatabase;
window.openDatabase = function() {
    var db = oldOpenDatabase.apply(window, arguments);

    var oldTrans = db.transaction;
    db.transaction = function(callback, err, suc) {
        var db = this;
        var params = arguments;
        var hasRun = false;
        oldTrans.call(db, function(tx){
            hasRun = true; callback(tx);
        }, err||function(){}, function(tx) {
            if(hasRun){
                if (suc != undefined)
                    suc(tx); 
                return;
            }
            else {
                oldTrans.apply(db, params);
            }
        });
    }

    return db;
}

此代码检查事务回调是否已在成功处理程序中触发，如果没有，则再给它一次机会。