запрос Http посылает 2 раза через AJAX

Question

Мой AJAX код выглядит следующим образом:

data = new FormData(); 
    // data=""; 
    paths = ""; 


    // Create a new HTTP requests, Form data item (data we will send to the server) and an empty string for the file paths. 
    xhr = new XMLHttpRequest(); 


    // Set how to handle the response text from the server 
    xhr.onreadystatechange = function(ev){ 
     //console.debug(xhr.responseText); 
    // console.log("success"+xhr.responseText); 

    try{ 
     console.log($.parseJSON(xhr.responseText)); 

     var data=$.parseJSON(xhr.responseText); 

     if(data.success=="yes"){ 

      projectCounter++;    
      var projectName=$.parseJSON(data.arguments); 
      console.log(projectName.projectName); 

      console.log('update table'); 

      if(projectCounter==2){ 

       UploadComplete(projectName.projectName); 

      } 


     } 

    } 
    catch(e){} 

    }; 

    // Loop through the file list 
    for (var i in files){ 
     // Append the current file path to the paths variable (delimited by tripple hash signs - ###) 
     paths += files[i].webkitRelativePath+"###"; 
     // Append current file to our FormData with the index of i 
     data.append(i, files[i]); 
    }; 
    // Append the paths variable to our FormData to be sent to the server 
    // Currently, As far as I know, HTTP requests do not natively carry the path data 
    // So we must add it to the request manually. 
    data.append('paths', paths); 
    // console.log(paths); 
    // Open and send HHTP requests to upload.php 
    xhr.open('POST', "upload.php", true); 
    console.log(data); 

    xhr.send(this.data); 

вопрос я столкнулся в том, что он отправляющий запрос HTTP 2 раза. Я получаю ответ Http 2 раза. Я написал console.log («Таблица обновлений»), и он показывает 2 раза. Я очень смущен, почему я получаю 2 ответа Http вместо того, что я отправляю только 1 запрос?

Answer 1

Вы получаете несколько событий readyState в ходе запроса. То, что вы хотите здесь, должно только быть уведомлено, когда запрос завершен.

удлиняет ваш обработчик с этим:

if(xhr.readyState === 4 //ready) { 

} 

UPDATE: Исходная задача была решена с простой проверкой равенства (нетипизированной), что приводит к предположению, что в некоторых браузерах readyState является string typed field, содержащим number ,

if(xhr.readyState == 4 //ready) { 

} 

Answer 2

Вы не тестируете readyState в своем обработчике onreadystatechange. Функция будет срабатывать при каждом изменении состояния. Обычно прерывание функции (путем возврата), когда readyState не сделано.

xhr.onreadystatechange = function(ev){ 
    if (this.readyState !== 4) { 
     return; 
    } 
    // ... 

Answer 3

Я думаю, проблема в том, что вы не проверяете значение readyState xhr. onreadystatechange код обратного вызова должен быть заключен, если заявление:

if (xhr.readyState === 4) { 
    // your code here... 
} 

Только тогда, когда readyState 4, запрос на самом деле сделано.

С уважением, Уди