javascript url調用執行兩次

Question

我試圖在 javascript 警報框中顯示此 json 數據，但它顯示了兩次（相同的內容）。 它正在工作，但我不知道為什么它會顯示兩個警報。 （javascript 不是我的首選語言）。

這是來自名為的 URL 的響應：

{
  "type": "error",
  "response": {
    "message": "Could not start app"
  }
}

這是我正在使用的代碼：

<script type="text/javascript">
       
        function call() {
            const Http = new XMLHttpRequest();
            const url='https://url_to_get_the_response';
            Http.open("GET", url);
            Http.send();
            Http.onreadystatechange = (e) => {
                if (Http.responseText) {
                alert(Http.responseText);
               }
           }
    }
    </script>

我收到兩個警報，都包含相同的內容（.json 結果）。 我只想要其中之一。

我試過添加一個return; 並break call; 在if (Http.responseText)部分。 添加return; 在if語句中沒有做任何事情並添加了break call; 停止工作。

對此有何建議？ 謝謝。

Answer 1

你的做法是正確的。 onreadystatechange事件會被多次觸發，因為readyState屬性從 API 調用的開始到結束都會發生變化。

為XMLHttpRequest對象中的適當readyState和status值添加 if 條件。 解決這個問題。

您可以在此處閱讀有關這些屬性的更多信息readyState , status

 function call() { const Http = new XMLHttpRequest(); const url='https://jsonplaceholder.typicode.com/todos/1'; Http.open("GET", url); Http.send(); Http.onreadystatechange = (e) => { if (Http.readyState == 4 && Http.status == 200 && Http.responseText) { alert(Http.responseText); } } }

 <button onclick='call()'>Call</button>