Пълен прихващане на AJAX грешки в JavaScript

Промисът, който връща fetch, се разрешава с грешка само ако е възникнала мрежова грешка. Ако сървърът върне отговор със статус 404 или 500, тогава промисът ще бъде разрешен успешно, но същевременно статусът ok ще бъде зададен на false.

Нека прихванем и двата типа грешки:

javascriptbutton.addEventListener('click', function() {
  let promise = fetch('/ajax.html')
  .then(
    response => {
      if (response.ok) {
        return response.text();
      } else {
        console.log('лош статус на отговора');
        return '';
      }
    },
  ).then(
    text => {
      console.log(text);
    }
  ).catch(
    error => {
      console.log(error);
    }
  );
});

Нека направим така, че грешката, свързана с лош HTTP статус на отговора, също да се прихваща от блока catch. За целта ще я прокараме нататък чрез throw:

javascriptbutton.addEventListener('click', function() {
  let promise = fetch('/ajax.html')
  .then(
    response => {
      if (response.ok) {
        return response.text();
      } else {
        throw new Error('лош статус на отговора');
      }
    },
  ).then(
    text => {
      console.log(text);
    }
  ).catch(
    error => {
      console.log(error);
    }
  );
});