почему оповещение не работает в http.onload из XMLHttpRequest?

Question

const http = new XMLHttpRequest();
const url = 'http://192.168.1.10/';
http.open('get', url, false);
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
http.onload = function () {
    if(http.status === 200 || http.status == 0) {
         alert("succeed")
    } else {
          alert("failed")
    }
}
http.send();

почему, хотя он не получил http.status === 200, он не предупредил не удалось!

Answer 1

Обновление: сервер может быть в автономном режиме, и OP хочет повторить попытку при истечении времени ожидания Ajax.

Чтобы «исправить» эту проблему, вы можете заключить оператор http.send() в блок try-catch,например:

...
try {
  http.send();
} catch(e) {
  //e.name would be "NetworkError" if the server is offline.
  console.log(e);
}

Если обнаружен «NetworkError», обнаружен отключенный сервер, а через некоторое время можно повторить запрос Ajax.

---

В этом есть 3 проблемыпроблема:

1. Согласно скриншоту ошибки (net::ERR_CONNECTION_TIMED_OUT), целевой сервер (http://192.168.1.10/) не отвечает.Пожалуйста, проверьте, доступен ли он.

2. В коде Content-Type определяется как application/x-www-form-urlencoded, что означает, что форма отправлена.Однако Ajax-запрос - это запрос GET без какой-либо логики отправки данных.Это довольно странная комбинация, от которой может отказаться логика браузера или сервера.Если вы просто хотите поиграть с запросом Ajax GET, нет необходимости настраивать Content-Type.

3. Событие load (http.onload в вопросе) XMLHttpRequest не поддерживается хорошо , пожалуйста, используйте onreadystatechange, предложенный @ Katie.

Answer 2

просто используйте XMLHttpRequest.onerror функцию, которая была сделана для таких ситуаций. но вам может понадобиться использовать асинхронный запрос (true).

const http = new XMLHttpRequest();
const url = 'http://192.168.1.10/';
http.open('get', url, true);
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
http.onload = function () {
    if(http.status === 200 || http.status == 0) {
         alert("succeed")
    }
}
http.onerror = function () {         
        alert("failed")
};
    http.send();

Answer 3

Вы можете попытаться отловить ошибку, используя onreadystatechange, например:

const http = new XMLHttpRequest();
const url = 'http://192.168.1.10/';
http.open('get', url, true);
http.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
http.setRequestHeader("Access-Control-Allow-Origin:", "*");
http.setRequestHeader("Access-Control-Allow-Methods", "GET,POST,PUT");
http.onreadystatechange = function (oEvent) {  
    if (http.readyState === 4) {  
        if (http.status === 200) {  
           console.log(http.responseText);
           alert("succeed");
        } else {  
           console.log("Error", http.statusText); 
           alert("failed");
        }  
    }  
}; 
http.send();

Взято из документации здесь: https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/onreadystatechange