API函数被调用两次导致重复

Question

我正在尝试向远程服务器发送获取 API 请求。响应非常好，正如我想要的那样。我正在尝试将响应存储在一个表中。但这里的问题是该processRequest()函数被调用了两次，这会产生重复的结果。我正在使用的警报也显示了两次。document.getElementById("ndviHsearch").onclick = function getndviHdata(){   var ndvihconvdataTime=[];   var ndvihStd=[];   var ndvihp25=[];   var ndvihmin=[];   var ndvihmax=[];   var ndvihmedian=[];   var ndvihmean=[];   var ndvihp75=[];   var ndviHfidValue = document.getElementById("ndviHfid").value;   var ndviHstartDateValue = document.getElementById("ndviHstartDate").value;   var ndviHendDateValue = document.getElementById("ndviHendDate").value;   table = document.getElementById("ndviHtable");   const xhr = new XMLHttpRequest();   ndviHstartDateValue = new Date(ndviHstartDateValue).getTime() / 1000;   ndviHendDateValue = new Date(ndviHendDateValue).getTime() / 1000;   xhr.open("GET","https://api.agromonitoring.com/agro/1.0/ndvi/history?polyid="+ndviHfidValue+"&start="+ndviHstartDateValue+"&end="+ndviHendDateValue+"&appid=APIKEY");   xhr.setRequestHeader("Content-Type","application/json");   xhr.send();   xhr.onreadystatechange = processRequest;   function processRequest(e) {     if (xhr.status==200){       response = JSON.parse(xhr.responseText);       alert (response.length);       for (var i=0; i<response.length; i++){         var dt = response[i].dt;         // Unixtimestamp         var unixtimestamp = dt;         // Months array         var months_arr = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];         // Convert timestamp to milliseconds         var date = new Date(unixtimestamp*1000);            var year = date.getFullYear();         var month = months_arr[date.getMonth()];         var day = date.getDate();         var hours = date.getHours();         var minutes = "0" + date.getMinutes();         var seconds = "0" + date.getSeconds();         }    }    

Answer 1

您还需要检查 readyState 值(xhr.readyState == 4 && xhr.status == 200)

函数 xhr.onreadystatechange = processRequest;将在每次 xhr 状态更改时执行，您需要检查是否readyState == 4还有status  == 200，然后执行您的操作。