时间戳

首页 > 解决方案 > javascript url调用执行两次

javascript - javascript url调用执行两次

问题描述

我试图在 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;and 。在语句中添加没有做任何事情并添加停止它的工作。break call;if (Http.responseText)return;ifbreak call;

对此有何建议？谢谢。

标签： javascriptxmlhttprequest

解决方案

你的做法是正确的。onreadystatechange事件被触发多次，因为readyState属性从 API 调用的开始到结束发生变化。

readyState 在为对象中的适当和status值添加 if 条件时XMLHttpRequest。解决了这个问题。

您可以在此处阅读有关这些属性的更多信息 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>

推荐阅读