Bagaimana saya bisa mendapatkan kode status dari kesalahan http di Axios?

Ini mungkin tampak bodoh, tapi saya mencoba untuk mendapatkan data kesalahan ketika permintaan gagal di Axios.

axios.get('foo.com')
    .then((response) => {})
    .catch((error) => {
        console.log(error) //Logs a string: Error: Request failed with status code 404
    })

Alih-alih string, apakah mungkin untuk mendapatkan objek dengan kode status dan konten? Sebagai contoh:

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

Apa yang Anda lihat adalah string yang dikembalikan oleh toStringmetode errorobjek. ( errorbukan string.)

Jika respons telah diterima dari server, errorobjek akan berisi responseproperti:

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

Seperti yang dikatakan @Nick, hasil yang Anda lihat saat Anda objek console.logJavaScript Errorbergantung pada implementasi tepat console.log, yang bervariasi dan (imo) membuat pengecekan kesalahan sangat mengganggu.

Jika Anda ingin melihat Errorobjek lengkap dan semua informasi yang dibawanya melewati toString()metode ini, Anda bisa menggunakan JSON.stringify :

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

Saya menggunakan pencegat ini untuk mendapatkan respons kesalahan.

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

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

Dengan TypeScript, mudah untuk menemukan apa yang Anda inginkan dengan tipe yang tepat.

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)
  })

Anda bisa menggunakan operator spread ( ...) untuk memaksanya ke objek baru seperti ini:

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

Sadarilah: ini tidak akan menjadi contoh Kesalahan.

Ini adalah bug yang dikenal, coba gunakan "axios": "0.13.1"

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

Saya memiliki masalah yang sama sehingga akhirnya saya gunakan "axios": "0.12.0". Ini bekerja dengan baik untuk saya.

Ada opsi baru yang disebut validateStatusdalam permintaan konfigurasi. Anda dapat menggunakannya untuk menentukan untuk tidak membuang pengecualian jika status <100 atau status> 300 (perilaku default). Contoh:

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

Anda bisa memasukkan kesalahan ke dalam objek dan mencatat objek, seperti ini:

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

Semoga ini bisa membantu seseorang di luar sana.

Untuk mendapatkan kembali kode status http dari server, Anda dapat menambahkan validateStatus: status => trueopsi axios:

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

Dengan cara ini, setiap respons http menyelesaikan janji yang dikembalikan dari aksioma.

https://github.com/axios/axios#handling-errors