Почему не срабатывает catch?

Question

[x1nax]

let info = (user) => {
  fetch('https://api.github.com/users/'+ user)
  .then(res =>  res.json())
  .then(res => {
    let newImg = document.createElement("IMG");
    let newp = document.createElement("p");
    let newA = document.createElement("a");
    let newh1 = document.createElement("h1");
    newImg.src = res.avatar_url;
    newh1.innerHTML = res.name;
    newp.innerHTML = res.bio;
    newA.href = res.html_url;
    document.body.appendChild(newA);
    newA.appendChild(newh1);
    document.body.appendChild(newp);
    document.body.appendChild(newImg);
    })
    .catch(err => document.body.innerHTML = 'Ты написал ерунду');
}

info('12312fff');

Answer 1

[Lynn «Кофеман»]

https://learn.javascript.ru/fetch

fetch низкоуровневая функция для работы с HTTP. Ответ 404 с точки зрения fetch ничем не лучше и не хуже чем 200 или 503 и не считается ошибкой.

Промис завершается с ошибкой, если fetch не смог выполнить HTTP-запрос, например при ошибке сети или если нет такого сайта. HTTP-статусы такие как 404 или 500, не являются ошибкой.

Вам нужно самостоятельно проверять код ответа (как в примерах выше) или использовать какую-нибудь библиотеку, например, axios.

Comments

[x1nax]

Спасибо

Answer 2

[Евгений Щербаков]

Для catch нужно кидать ошибку, например
throw new Error('text error');

Comments

[x1nax]

В примере https://learn.javascript.ru/promise

Не используется throw и мне не понятно, в чем принципиальная разница с моим вариантом, для которого нужно использовать throw

[Евгений Щербаков]

У тебя не попадает в catch, потому что не происходит reject промиса.

Если в функции промиса происходит синхронный throw (или иная ошибка), то вызывается reject

[x1nax]

Евгений Щербаков, Я так понимаю, что в этой строчке имеется ввиду, что если во время выполнения условия resolve возникает ошибка, или используется throw new Error(), то вызовется reject.
То есть это как раз дает возможность внести исключения на те ошибки которые не распознаются catch

Для того, чтобы поставить обработчик только на ошибку, вместо .then(null, onRejected) можно написать .catch(onRejected) – это то же самое.

А почему reject не срабатывает на ошибку , которую должен сработать я не понимаю)

[Евгений Щербаков]

Немного вас не понял)
Смотрите, вы делаете какое-то асинхронное действие, и когда оно заканчивается, то промисс переводится в fulfilled (с результатом) или rejected (с ошибкой)

// В ней можно делать любые асинхронные операции,
// А когда они завершатся — нужно вызвать одно из:
// resolve(результат) при успешном выполнении
// reject(ошибка) при ошибке

[Евгений Щербаков]

Видимо ваши операции при завершении не считаются неудачными и они переходят в fulfilled и поэтому игнорируют catch

Answer 3

[Tim]

в таком случае попадет в catch. Скорее всего не попадает потому что сервер возвращает json

let info = (user) => {
    fetch('https://api.github.com/users/' + user)
        .then(res => {
            if (res.status !== 200) {
                throw new Error(res.statusText)
            }
            return res;
        })
        .then(res => res.json())
        .then(res => {
            console.log(res)
        })
        .catch(err => console.error(err));
}