異步xhr請求內setInterval不工作| Javascript

我正在構建一個跟蹤庫來將事件發送到後端。應該每5秒創建一個事件（可配置）並將其發送到跟蹤隊列中，並且應將跟蹤隊列發送到後端並每5秒清空一次（也可配置）。預期的行爲是應該每5秒發送一次事件到後端。異步xhr請求內setInterval不工作| Javascript

當我只是console.logging事件，一切都按預期工作，但是當我實現了xhr請求時，間隔事件只創建了大約9秒左右。所以一個事件會被髮送到後端，每兩次'post'函數被觸發一次。

sendData: function(){ 
    var toSend = [].concat(Tracking.__tracking_queue); 
    if(toSend.length !== 0){ 
     var sendData = this.__stringifyAndSetHeaders(toSend); 
     Tracking.postData(sendData); 
    } 
}, 

postData: function(sendData){ 
    var xhr = new XMLHttpRequest(); 
    xhr.onload = function() { 
     console.log(xhr.responseText); 
     Tracking.__tracking_queue = []; 
    }; 
    xhr.open("POST", sendData.url, true); 
    Object.keys(sendData.headers).forEach(function(key){ 
     xhr.setRequestHeader([key], sendData.headers[key]); 
    }); 
    xhr.send(sendData.body); 
}

後端正在接收數據，但沒有在正確的時間。 sendData從setInterval循環中調用。

setInterval(function(){ 
     self.sendData() 
    }, 5000);

我有同樣的設置完美的工作之前，在使用axios另一個文件，但我不能在這個用例使用Axios公司。

來源

2017-04-10 dedles

你試過只調用'sendData（）'而不是'self.sendData（）'嗎？ – brk

'Tracking .__ tracking_queue = [];'似乎在錯誤的位置被調用。如果在構建數據和返回Ajax調用之間添加了某些內容，則會丟失數據。 – epascarello

創建一個重現問題的演示。這些函數還應該在一個對象變量內部添加一些錯誤處理 – charlietfl

您正在重置錯誤位置的跟蹤數據。您讀取數據，而不是發出請求，請求完成後，您刪除數據。有一段時間，數據可以在請求和完成之間進入隊列。

sendData: function(){ 
    var toSend = [].concat(Tracking.__tracking_queue); 
    if(toSend.length !== 0){ 
     var sendData = this.__stringifyAndSetHeaders(toSend); 
     Tracking.__tracking_queue = []; //clear it here 
     Tracking.postData(sendData); 
    } 
}, 

postData: function(sendData){ 
    var xhr = new XMLHttpRequest(); 
    xhr.onload = function() { 
     console.log(xhr.responseText); 
     //Tracking.__tracking_queue = []; //don't clear it here 
    }; 
    xhr.open("POST", sendData.url, true); 
    Object.keys(sendData.headers).forEach(function(key){ 
     xhr.setRequestHeader([key], sendData.headers[key]); 
    }); 
    xhr.send(sendData.body); 
}

來源

2017-04-10 14:31:31 epascarello

謝謝，那正是問題所在。 – dedles

異步xhr請求內setInterval不工作| Javascript

回答

相關問題