Блог

Главная - Вопросы по программированию - Попытка поймать не работает даже при возникновении ошибки

Попытка поймать не работает даже при возникновении ошибки

#javascript #reactjs #try-catch

#javascript #reactjs #try-catch

Вопрос:

У меня есть некоторый код, который выполняется при отправке формы. Он отправляет сообщения в маршрут API.

   handleSubmit = async () => {
    try {
      const response = await fetch(`${API_URL}/project`, {
        method: "post",
        body: JSON.stringify({
          name: this.state.name,
          description: this.state.description
        }),
        headers: { "Content-Type": "application/json" }
      });
      return response ? response.json() : response;
    } catch (error) {
       console.log(error)
    }
  };

Проблема в том, что при тестировании этого я меняю маршрут API на заведомо неверный маршрут, чтобы вызвать ошибку. Однако код catch не попадает.
Я неправильно настроил try-catch?

Комментарии:

1. Вы пробовали проверять сетевой трафик, чтобы увидеть, что вы получаете в ответ? 404, в который я не верю, будет считаться исключением, это будет просто ответ, который вам нужно проверить, например

2. Да, я возвращаю 404: итак, что будет считаться исключением?

3. Исключение — это конкретный объект, который создается на основе кода, который не выполнялся должным образом. 404 не является неожиданным в коде, поэтому, по сути, вам нужно проверить код состояния ответа и посмотреть, равно ли оно 404, а затем обрабатывать, как хотите оттуда. Возможно, вы захотите включить туда и другие статусы, например, что-то вроде 200 может быть единственным допустимым ответом

Ответ №1:

Проблема, с которой вы сталкиваетесь, заключается в том, что получение 404 не является исключением. Чтобы справиться с этим, вы должны добавить некоторый код, который будет проверять код состояния ответа и оттуда определять, что следует сделать. Например, вы получите ответ и используете следующее:

 if(response.status == 404)
    //Code for not receiving the content you expect

Проблема в том, что существует множество потенциальных ответов, которые вы можете получить обратно, которые не будут тем, что вы ищете, поэтому я бы порекомендовал вносить в белый список определенные диапазоны ответов, а не искать те, которые являются проблемой. Например

 if(response.status >= 200 amp;amp; response.status <= 299)
    //Code to run when you receieve a good response

Это пример, вам решать, какие ответы вы хотите обработать.

Ответ №2:

fetch выдает ошибку только в том случае, если произошла ошибка при создании или получении ответа. HTTP 404 следует рассматривать как «успешный» ответ, и пользователь должен решить, что делать с таким ответом.

Если вы хотите отклонить ответы, отличные от 20x, и у вас уже есть бизнес-логика для обработки ошибок в вашем catch коде, вы можете создать новую ошибку и обработать ее вместе с другими ошибками:

 try {
    const response = await fetch(`${API_URL}/project`, {
    ...
    if (response.status >= 200 amp;amp; response.status < 300) {
        return response.json()
    } else {
        var error = new Error(response.statusText || response.status)
        error.response = response
        throw(error)
    }
} catch (error) {
   console.log(error)
}

Ответ №3:

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

 handleSubmit = () => {
    fetch(`${API_URL}/project`, {
        method: "post",
        body: JSON.stringify({
            name: this.state.name,
            description: this.state.description
        }),
        headers: { "Content-Type": "application/json" }
    }).then((response) => {
        return response ? response.json() : response;
    }).catch((error) => {
        console.log(`fetch specific error: ${error}`)
    });
};
Метки: