Ajax IndexedDB删除当前的Sucesfull上传

我昨天发布了类似的东西,但它有效,但只删除了数据中的最后一个对象。

我想要发生什么

这个ajax上传将处理大量数据,所以我使用的是indexeddb。 这也将用于手机。 所以我希望它一次上传一个项目,如果一个项目未能删除数据中的先前项目,那么他们就不需要再次上传所有内容。

我试过async = false,这正是我想要的但是这个冰柜浏览器。

当前代码试图注释掉任何可能令人困惑的位,目前这只会在完成后删除最后一项。

function uploadData(e) { //Get Database var transaction = db.transaction(["data"], "readonly"); var objectStore = transaction.objectStore("data"); var cursor = objectStore.openCursor(); //Starts Looping cursor.onsuccess = function(e) { var res = e.target.result; if (res) { if (navigator.onLine) { $('.popup-heading').text('Uploading...'); var passData = { client_id: res.value.client_id, parent_id: res.value.parent_id, storename: res.value.storename, image: res.value.image, key: res.key, }; var jsonData = JSON.stringify(passData); $.ajax({ url: "{{ path('destination_app_ajax') }}", type: "post", // Works but freezes browser /*async, flase*/ data: { "json": passData }, success: function(JsonData) { //Delete item once successfull var t = db.transaction(["data"], "readwrite"); var request = t.objectStore("data").delete(passData.key); t.oncomplete = function(event) { console.log('item deleted'); }; }, error: function() { $('.popup-heading').text('Upload Failed!'); } }); } else { $('.popup-heading').text('Please find stronger signal or wifi connection'); } res. continue (); } } 

}

听起来你对passData有一个范围问题。 在你的循环内部,但在你定义var passData = ...尝试使用匿名函数包装代码块:

 (function() { /* Your code here */ }()); 

这应该会阻止passData泄漏到全局范围,这似乎是您的IDB代码仅适用于最后一个循环的原因。 (每次在AJAX响应完成之前都会重新定义passData 。)

更新 :没有循环,你正在处理回调。 我所看到的是,您正在重新定义每个Ajax请求上的onsuccess处理程序(并覆盖除最后一个之外的所有值),重用相同的事务。 尝试将此事务代码移动到AJAX请求的成功回调中:

 //Get Database var transaction = db.transaction(["data"], "readonly"); var objectStore = transaction.objectStore("data"); var cursor = objectStore.openCursor(); 

这将创建一个闭包并在每个响应上提交delete事务。 这意味着每个AJAX请求有一个事务,每个AJAX请求有一个onsuccess回调(没有重新定义)。

我找到的唯一解决方案是将密钥通过ajax发送到php,然后从中删除。

HTML

 var passData = { ....... key: res.key, }; ..... $.ajax({ url: "yourscript.php", type: "post", data: { "json": passData }, success: function(JsonData) { jsonKey = JSON.parse(JsonData); //Delete item once successfull var t = db.transaction(["data"], "readwrite"); var request = t.objectStore("data").delete(parseInt(jsonKey.key)); t.oncomplete = function(event) { console.log('item deleted', jsonKey.key); }; } 

PHP

  $data = $_POST['json']; $returnKey = json_encode( array( 'key' => $data['key'] ) );