XMLHttpRequest - Daten erneut senden bei xhr-Fehler

Question

Ich verwende eine XMLHttpRequest innerhalb eines Versprechens. Da der Server manchmal im Leerlauf ist, würde ich gerne 3 Versuche machen, wenn ein Fehler auftritt.

Wenn Sie jedoch wie folgt vorgehen, erhöhen Sie den Object state must be opened Fehler in Zeile xhr.send() in der function sendData(). Warum?

Ich denke, die xhr ist bereits geöffnet. Was wäre der richtige Weg, dies zu erreichen?

function _callService(url, postData) { 
    return new Promise(function(resolve, reject) { 
     var xhr = new XMLHttpRequest(); 
     var attempts = 0; 
     xhr.open("POST", url); 
     xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
     xhr.onreadystatechange = function() { 
      if (xhr.readyState == 4 && xhr.status == 200) { 
        resolve(xhr.response); 
       } 
      } 
     }; 
     xhr.addEventListener("error", onXhrError); 

     function sendData() { 
      //here I get the Object state must be opened when this is called from onXhrError listener 
      xhr.send(postData); 
     }; 

     function onXhrError() { 
      console.log("onXhrError"); 
      if (attempts < 3) { 
       attempts += 1; 
       sendData(); 
      } else { 
       reject("OnXhrError") 
      } 
     }; 

     sendData(); 
    }); 

Answer 1

Schedule _callService(url, postData, attempts) wieder statt sendData() genannt zu werden, siehe multiple, sequential fetch() Promise.

function callService(attempts) { 
 
    return new Promise(function(resolve, reject) { 
 
    setTimeout(function() { 
 
     if (attempts < 3) 
 
     reject(++attempts) 
 
     else 
 
     resolve("done"); 
 
    }, Math.floor(Math.random() * 1200)) 
 
    }).catch(function(err) { 
 
    throw err 
 
    }) 
 
} 
 

 
function request(n) { 
 
    return callService(n) 
 
    .then(function(data) { 
 
     console.log(data); 
 
     return data 
 
    }) 
 
    .catch(function(err) { 
 
     console.log(err); 
 
     return typeof err === "number" && err < 3 ? request(err) : typeof err !== "number" ? new Error(err) : "requested " + err + " times"; 
 
    }) 
 
} 
 

 
request(0) 
 
    .then(function(done) { 
 
    console.log("done:", done) 
 
    }) 
 
    .catch(function(err) { 
 
    console.log(err) 
 
    })