Это может показаться глупым, но я пытаюсь получить данные об ошибке при сбое запроса в Axios.

аксиомы
  .get ('foo.com')
  .then ((ответ) => {})
  .catch ((error) => {
    console.log (ошибка); // Регистрирует строку: Ошибка: запрос завершился неудачно с кодом состояния 404
  });

Можно ли вместо строки получить объект, возможно, с кодом состояния и содержимым? Например:

Object = {status: 404, reason: 'Not found', body: '404 Not found'}

Sebastian Olsen

Ответов: 14

Ответы (14)

Вы видите строку, возвращаемую методом toString объекта error. (ошибка не строка.)

Если от сервера получен ответ, объект error будет содержать свойство response:

axios.get('/foo')
  .catch(function (error) {
    if (error.response) {
      console.log(error.response.data);
      console.log(error.response.status);
      console.log(error.response.headers);
    }
  });

Я использую эти перехватчики, чтобы получить ответ об ошибке.

const HttpClient = axios.create({
  baseURL: env.baseUrl,
});

HttpClient.interceptors.response.use((response) => {
  return response;
}, (error) => {
  return Promise.resolve({ error });
});

Это мой код: Работай на меня

 var jsonData = request.body;
    var jsonParsed = JSON.parse(JSON.stringify(jsonData));

    // message_body = {
    //   "phone": "5511995001920",
    //   "body": "WhatsApp API on chat-api.com works good"
    // }

    axios.post(whatsapp_url, jsonParsed,validateStatus = true)
    .then((res) => {
      // console.log(`statusCode: ${res.statusCode}`)

            console.log(res.data)
        console.log(res.status);

        // var jsonData = res.body;
        // var jsonParsed = JSON.parse(JSON.stringify(jsonData));

        response.json("ok")
    })
    .catch((error) => {
      console.error(error)
        response.json("error")
    })

Вся ошибка может быть показана только с помощью error.response:

axios.get('url').catch((error) => {
      if (error.response) {
        console.log(error.response);
      }
    });

С Axios

    post('/stores', body).then((res) => {

        notifyInfo("Store Created Successfully")
        GetStore()
    }).catch(function (error) {

        if (error.status === 409) {
            notifyError("Duplicate Location ID, Please Add another one")
        } else {
            notifyError(error.data.detail)
        }

    })

Как сказал @Nick, результаты, которые вы видите, когда вы console.log объект JavaScript Error, зависят от точной реализации console.log, который варьируется и (imo) делает проверку ошибок невероятно раздражающей.

Если вы хотите увидеть полный объект Error и всю информацию, которую он несет, минуя метод toString (), вы можете просто использовать JSON.stringify:

axios.get('/foo')
  .catch(function (error) {
    console.log(JSON.stringify(error))
  });

Вы можете использовать оператор распространения (...), чтобы поместить его в новый объект, например:

axios.get('foo.com')
    .then((response) => {})
    .catch((error) => {
        console.log({...error}) 
})

Имейте в виду: это не будет экземпляром ошибки.

It's indeed pretty weird that fetching only error does not return an object. While returning error.response gives you access to most feedback stuff you need.

I ended up using this:

axios.get(...).catch( error => { return Promise.reject(error.response.data.error); });

Which gives strictly the stuff I need: status code (404) and the text-message of the error.

Это известная ошибка, попробуйте использовать "axios": "0.13.1"

https://github.com/mzabriskie/axios/issues/378

У меня была такая же проблема, поэтому я использовал "axios": "0.12.0". У меня отлично работает.

В конфигурации запроса появилась новая опция validateStatus. Вы можете использовать его, чтобы указать, чтобы исключения не генерировались, если status <100 или status> 300 (поведение по умолчанию). Пример:

const {status} = axios.get('foo.com', {validateStatus: () => true})

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

axios.get('foo.com')
    .then((response) => {})
    .catch((error) => {
        console.log({error}) // this will log an empty object with an error property
    });

Надеюсь, это кому-нибудь поможет.

С TypeScript легко найти то, что вам нужно, с правильным типом.

Это упрощает все, потому что вы можете получить все свойства типа с автозаполнением, чтобы вы могли знать правильную структуру вашего ответа и ошибки.

import { AxiosResponse, AxiosError } from 'axios'

axios.get('foo.com')
  .then((response: AxiosResponse) => {
    // Handle response
  })
  .catch((reason: AxiosError) => {
    if (reason.response!.status === 400) {
      // Handle 400
    } else {
      // Handle else
    }
    console.log(reason.message)
  })

Кроме того, вы можете передать параметр обоим типам, чтобы сообщить, что вы ожидаете внутри response.data вот так:

import { AxiosResponse, AxiosError } from 'axios'
axios.get('foo.com')
  .then((response: AxiosResponse<{user:{name:string}}>) => {
    // Handle response
  })
  .catch((reason: AxiosError<{additionalInfo:string}>) => {
    if (reason.response!.status === 400) {
      // Handle 400
    } else {
      // Handle else
    }
    console.log(reason.message)
  })
Axios. get('foo.com')
.then((response) => {})
.catch((error) => {
    if(error. response){
       console.log(error. response. data)
       console.log(error. response. status);

      }
})

Чтобы получить код статуса http, возвращенный с сервера, вы можете добавить validateStatus: status => true в параметры axios:

axios({
    method: 'POST',
    url: 'http://localhost:3001/users/login',
    data: { username, password },
    validateStatus: () => true
}).then(res => {
    console.log(res.status);
});

Таким образом, каждый HTTP-ответ разрешает обещание, возвращенное от axios.

https://github.com/axios/axios#handling-ошибки

2022 WebDevInsider