檢測所有XMLHttpRequest調用完成

我有Javascript代碼將文件上傳到服務器。每次上傳都使用XMLHttpRequest對象完成。檢測所有XMLHttpRequest調用完成

xhr = new XMLHttpRequest(); 

//... 

xhr.open('POST', 'https://<bucket>.s3.amazonaws.com/', true); 
xhr.send(fd);

並行上傳工作正常。問題是我需要檢測它們全部何時完成，因爲我必須進行最終提交，但只有在所有上傳完成後。

我第一次嘗試是保存在一個數組中的所有XHR對象，但我不知道如何處理:-(

var arrayxhr = []; 

//... 

//A loop { 
    xhr = new XMLHttpRequest(); 
    arrayxhr.push(xhr); 

    xhr.open('POST', 'https://<bucket>.s3.amazonaws.com/', true); 
    xhr.send(fd); 
//} 

//And now?

我發現這個jQuery函數https://api.jquery.com/ajaxcomplete/做的，但同樣的，我不「噸真的知道如何使用它。

你能幫助我嗎？

TIA，

來源

2014-11-21 Mario S

如果你可以使用jQuery可以使用jQuery AJAX Deferred接口/方法和$.when方法。 $.ajax/$.post/$.get和其他的jQuery AJAX方法總是返回jQuery Deferred對象：

$.when($.get('someUrl'), $.get('anotherUrl')).then(function() { 
    //all request complete 
});

在本地JavaScript您可以使用本機Promise或承諾庫：

關於Promises的好文章 - http://www.html5rocks.com/en/tutorials/es6/promises/。

本地Promise與XMLHttpRequest例如：

function doAjaxRequest(method, url, data){ 
    var promise = new Promise(); 
    var xhr = new XMLHttpRequest(); 
    xhr.open(method, url, true); 

    // Register the event handler 
    xhr.onload = function(){ 
    if(xhr.status === 200){ 
     promise.resolve("Done"); 
    } else{ 
     promise.reject("Failed"); 
    } 
    }; 

    data = data || {}; 

    xhr.send(data); 

    return promise; 
} 

Promise.all(doAjaxRequest('post', 'someUrl'), doAjaxRequest('post', 'anotherUrl')).then(function (values) { 
    //all request complete 
});

來源

2014-11-21 08:34:36 Pinal

，承諾的事情似乎就是我要找的。我現在正在檢查... – 2014-11-21 08:42:37

它現在不是跨瀏覽器，但是您可以使用其中一個豐富的庫和polyfills – Pinal 2014-11-21 08:44:17

還要添加一個本地Promise示例。 – Pinal 2014-11-21 08:49:33

好了，這是不完全的回答我的問題（檢測到異步調用完成），但這個答案對我的作品。我複製到這裏，以防萬一它可以幫助別人：

2：在客戶端，創建一堆文件上傳和上傳一次一個，呼籲「完整」的回調下一個之前的。

https://stackoverflow.com/a/15557631/1893936

來源

2014-11-25 09:26:31

檢測所有XMLHttpRequest調用完成

回答

相關問題