@zlodiak

Почему аякс-запрос завершается с ошибкой?

ajax делает запрос на сервер и в ответ получает приблизительно такой ответ:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title></title>
</head>
<body>
    <img src="bla" alt="">
</body>
</html>

при этом код ответа сервера 200. и на вкладке хрома network/response отображается изображение(не url или текст, а именно изображение).

но несмотря на это отрабатывает коллбек error, а не success. подскажите пожалуйста что нужно поменять в запросе чтобы отработал коллбек success и я смог бы обработать ответ средствами javascript.

вот сам запрос:
var xhr = new XMLHttpRequest();
// xhr.responseType = 'text';
xhr.open('GET', '//realtyminer.simbirsoft/api/proxy/image?url=' + imageUrl);
xhr.send();

if (xhr.status != 200) {
  // success
  console.log( xhr.status + ': ' + xhr.statusText );
} else {
  // error
  console.log( xhr.responseText );
}


UPD:
if (xhr.status == 200) {
        console.log( 'success', xhr );
      } else {
        console.log( 'error' + xhr.status + ': ' + xhr.statusText );
      }
  • Вопрос задан
  • 76 просмотров
Пригласить эксперта
Ответы на вопрос 3
Rsa97
@Rsa97
Для правильного вопроса надо знать половину ответа
Потому что у вас условие обратное, если не 200 - удачно, если 200 - ошибка.
Ответ написан
tsepen
@tsepen
Frontend developer
Если так
if (xhr.status === 200) {

У тебя же приходит статус 200, а ты его как ошибку получается обрабатываешь

А вообще лучше для запросов использовать fetch https://learn.javascript.ru/fetch
Ответ написан
virtual_hack2root
@virtual_hack2root
.NET Core, JS, DevOps
Используйте Промисы

const loadImage = url => {
  return new Promise(function(resolve, reject) {

    //Open a new XHR
    var request = new XMLHttpRequest();
    request.open('GET', url);

    // When the request loads, check whether it was successful
    request.onload = function() {
      if (request.status === 200) {
        // If successful, resolve the promise
        resolve(request.response);
      } else {
        // Otherwise, reject the promise
        reject(Error('An error occurred while loading image. error code:' + request.statusText));
      }
    };

    request.send();
  });

};


const embedImage = url => {
  loadImage(url).then(function(result) {
      const img = new Image();
      var imageURL = window.URL.createObjectURL(result);
      img.src = imageURL;
      document.querySelector('body').appendChild(img);
    },
    function(err) {
      console.log(err);
    });
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы