Saya memiliki lingkungan yang persis sama. Coba ini:

axios.post('/formulas/create', {
    name: "",
    parts: ""
})
.then(response => { 
    console.log(response)
})
.catch(error => {
    console.log(error.response)
});

Ubah dari console.log(error) menjadi console.log(error.response) di catch .

Anda juga dapat menggunakan pencegat global dan hanya menolak error.response . Masalahnya adalah ketika console.log mencoba untuk menampilkan kesalahan, representasi string dicetak, bukan struktur objek, jadi Anda tidak melihat properti .response .

Jika ada yang bertanya-tanya bagaimana cara menolak hanya properti response , berikut cara melakukannya:

axios.interceptors.response.use((response) => {
    return response;
}, function (error) {
    // Do something with response error
    if (error.response.status === 401) {
        console.log('unauthorized, logging out ...');
        auth.logout();
        router.replace('/auth/login');
    }
    return Promise.reject(error.response);
});

Bagian yang penting adalah return Promise.reject(error.response);

Ini menghasilkan hasil yang sama jika solusi di atas mengacaukan sintaks file JS Anda saat membuat indentasi atau mengecilkan :)

.post('ajax/register/otp', this.registerData)
.then(function (response) {
       return otpSent(response)
})
.catch(function (error) {
      console.log(error.response);
 });

@gopal-g itu tidak terdefinisi untuk saya.

Nah @pedro-mass dalam hal ini mungkin tidak ada respons dari sisi server. dalam skenario saya, respons saya adalah JSON ketika kesalahan terjadi, saya bisa mendapatkan respons menggunakan error.response

@gopal-g Jika saya menonton tab Jaringan di alat dev, saya dapat melihat responsnya. Ini adalah 401 jika itu membuat perbedaan.

Saya memiliki kesalahan yang sama dengan @pedro-mass 's.

ini kode saya

async function test () {
try {
  let res = await axios.get('/xxxxx/xxxx')

} catch (e) {
  console.log(e.response) // undefined
}
}

menggunakan "error.response" tidak berfungsi, bagi saya. Masalah terjadi ketika saya memutuskan server database dan server web saya mengembalikan kesalahan 500.

Tab jaringan di alat pengembang

kode tanggapan: 500
badan tanggapan:

{
  "error": {
    "statusCode": 500,
    "name": "Error",
    "message": "read ETIMEDOUT",
    "code": "ETIMEDOUT",
    "errno": "ETIMEDOUT",
    "syscall": "read",
    "stack": "Error: read ETIMEDOUT\n    at exports._errnoException (util.js:1050:11)\n    at TCP.onread (net.js:582:26)"
  }
}

kesalahan konsol chrome:

Uncaught (in promise) Error: Request failed with status code 500
    at createError (createError.js:15)
    at settle (settle.js:18)
    at XMLHttpRequest.handleLoad (xhr.js:77)

Versi: kapan

"aksios": "^0.15.3"

Ada tangkapan di catch : jika kesalahan terjadi sebelum permintaan dibuat, maka di catch Anda tidak akan memiliki properti err.response , karena... yah.. .tidak ada tanggapan. Jadi, catch akan menangkap kesalahan apa pun . Hal yang sama berlaku dalam situasi seperti dari @fabiorecife ketika tidak ada respons karena kegagalan jaringan. Jangan perlakukan err sebagai kesalahan HTTP karena tidak selalu demikian.

@alsofronie jadi apa metode penanganan yang disukai (membedakan satu dari yang lain) misalnya kegagalan preflight seperti 413?

Saya mendapatkan masalah serupa - Chrome devtools menunjukkan 401 , responsnya adalah {"message":"Identity token has expired"} dan saya catch( (error) => {...}) - tetapi error.response kosong. Saya bertanya-tanya apakah ini karena panggilan OPTIONS terkait dengan GET memiliki status 200 . Apa yang harus dilakukan dalam kasus ini dan di mana tempat yang tepat untuk mengambil kode status 401 ?

@robbiemu Saya pikir ini sudah didokumentasikan: https://github.com/axios/axios#handling -errors

@mrchief terima kasih untuk ini, bagus untuk membahasnya lagi. Dalam kasus saya, solusi ini berfungsi dalam banyak kasus tetapi masalah saat ini yang saya alami adalah bahwa objek error.response ada, tetapi bidangnya undefined , panggilan apa pun ke nilai di dalam response menghasilkan kesalahan.

@paolavness Saya sarankan untuk membuka masalah baru daripada berkomentar di sini. Tidak banyak menonton masalah tertutup. Atau bahkan mungkin menanyakannya di StackOverflow.

@mrchief Ah ini sudah ditutup, terima kasih telah menunjukkannya. akan melakukan.

Saya memiliki masalah yang sama. Pada akhirnya, saya mengubah kode kesalahan dari 401 menjadi 403 dan semuanya bekerja seperti yang saya harapkan. Saya menduga alasan objek kesalahan kosong dan kesalahan javascript yang dihasilkan ada hubungannya dengan pernyataan ini yang saya temukan di dokumentasi untuk kesalahan 401:

"Respons [Kesalahan 401] harus menyertakan bidang header WWW-Otentikasi yang berisi tantangan yang berlaku untuk sumber daya yang diminta."

Jadi, jika Anda akan menggunakan kesalahan 401, Anda harus menyertakan bidang tajuk www-otentikasi. Jika Anda tidak ingin melakukan ini, gunakan saja kesalahan 403.

Selamat pagi teman-teman, saya mengalami masalah ini, namun, saya memperbaikinya dengan mengubah konfigurasi Apache saya untuk mengaktifkan kor di server saya. Lihat tautan di bawah ini

https://enable-cors.org/server_Apache.html

Anda dapat men-debug semua respons hanya dengan console.log(JSON.stringify(error))

axios.post(url)
.kemudian((tanggapan) => {
// sesuatu
})
.catch((tanggapan) => {
if (respon.status == tidak ditentukan) {
waspada('tidak sah')
}
})

Saya memiliki masalah yang persis sama dengan yang dijelaskan oleh @fabiorecife . Saya menyelesaikannya tetapi itu bukan solusi yang paling elegan dan saya tidak mengerti mengapa ini diperlukan.

.catch(error=>{
let errorObject=JSON.parse(JSON.stringify(error));
console.log(errorObject);
dispatch(authError(errorObject.response.data.error));
})

Ini menghasilkan hasil yang diharapkan dalam variabel errorObject .

@petruscurtu Saya memiliki masalah yang sama！ Dosisnya tidak bekerja untuk saya！

Saya tidak tahu mengapa itu melempar 'tidak ada Access-control-allow-Origin', tetapi server telah mengaturnya! Header responsnya ok

Terselesaikan. Api auth tidak merespon header kanan yang harus memiliki Access-control-allow-origin

@luxueyan Saya tidak tahu apa masalahnya karena saya tidak tahu bagaimana Anda menangani CORS di server Anda. Sejauh menyangkut aksioma, saya dapat melihat objek konfigurasi dan permintaan di output konsol Anda. Saya pikir Anda harus memeriksa output itu. Ini mungkin terkait dengan format respons yang dikirim kembali oleh server Anda.

@luxueyan Tampaknya Anda telah mengatur Access-control-allow-origin untuk http://localhost:8081 (dengan asumsi ini disetel pada server dengan alamat ini http://10.31.143.32:8080 ?) Dapatkah Anda memeriksa apa URL yang Anda 'menjalankan proyek ini dari? Apakah itu http://localhost:8081 ? Jika tidak, meskipun nomor portnya berbeda, maka itu melanggar aturan domain CORS.

@petruscurtu Outputnya adalah 'JSON.parse(JSON.stringify(error))' di pencegat respons. Tidak ada properti respons

@chiefie Saya yakin bahwa pengaturan 'Access-control-allow-origin' baik-baik saja karena api ajax lainnya dapat merespons konten yang benar！Hanya kode capcha api yang salah。 ketika kedaluwarsa， itu kesalahan respons dengan status 478 dan aksio tidak bisa dapatkan badan tanggapan！

Memperbarui! Itu adalah kesalahan api server, tidak memiliki pengaturan kor di header. Sekarang bekerja dengan baik.

Terima kasih @juliano-barros itu karena cross-origin. Sekarang semua permintaan ajax saya berfungsi dengan baik.

Kesalahan mentah ini terjadi setiap kali server tidak dapat dijangkau/CORS tidak valid.
error.response hanya akan menjadi undefined .

Saya baru saja membuat IntegrationError yang berisi pesan, status, dan data respons... tetapi selalu mengikuti struktur yang sama. Dengan cara ini saya dapat memisahkan aksio/kesalahan mentah dari penanganan saya.

Axios guys, ini seharusnya kesalahan HTTP menurut saya... termasuk error.response .
Ini dapat diperiksa seperti di atas

Kemarin adalah peringatan satu tahun masalah ini. Apakah akan pernah "diperbaiki" atau dianggap sebagai "bukan masalah" pada saat ini?

@frostshoxx Jadi saya pikir ini adalah "bukan masalah". Sementara saya mengalami masalah yang sama seperti orang lain, saya sekarang mengerti apa yang terjadi dan saya dapat melihat bahwa ini bukan bug atau masalah, tetapi hanya cara dunia bekerja.

Untuk semua orang yang bingung (dan untuk merayakan masalah ini yang berusia satu tahun) izinkan saya menjelaskan apa yang terjadi dan bagaimana mendapatkan respons server Anda.

Bagaimana Anda Berakhir Di Sini?

Ada banyak alasan Anda mungkin menemukan gurun .catch() . Terkadang Axios menemukan kesalahan di awal permintaan. Ini terkadang terjadi dengan permintaan CORS. Ketika Axios OPTIONS tidak tersedia, Axios panik dan mengirim Anda ke .catch() sebelum benar-benar mendapat respons dari server, jadi respons tidak tersedia dalam kasus ini.

Beberapa dari Anda mungkin berkata, "Tidak, saya melihatnya di DevTools, jadi responsnya kembali!". Ini tidak selalu benar karena terkadang Axios akan memulai permintaan HTTP, mengalami kesalahan, membatalkan sendiri dan mengirim Anda ke .catch() sebelum server merespons kembali. Beberapa milidetik setelah Axios menjalankan fungsi .catch() server Anda mungkin kembali dengan respons, yang muncul di DevTools karena masih mendengarkan respons. Namun, Axios sudah lama selesai pada saat ini, jadi response tidak tersedia karena tidak ada pada saat Axios memulai fungsi .catch() .

Anda yang mendapatkan pesan tentang kesalahan 4XX atau 5XX dari server, beruntung! Biasanya ada respons dari server yang tersedia untuk Anda karena untuk mendapatkan kesalahan ini, Axios harus menunggu respons server penuh. Dalam kasus ini, Axios mengirim Anda ke .catch() dengan response tetapi Axios membungkus respons dalam objek error miliknya sendiri yang dibuat dengan cepat.
Jadi, jika Anda mendapatkan kesalahan 5XX atau 4XX , Anda mungkin memiliki respons server yang tersedia untuk Anda, tetapi itu terkubur DALAM!

Coba error.response.data.data.message . Ini dipastikan berfungsi untuk permintaan API Laravel yang mengembalikan kesalahan server.

Pengguna non-Laravel -- Anda setidaknya perlu membuka error.response.data untuk mendapatkan respons inti dari server, tetapi sebagian besar server kemudian membungkus respons mereka dalam objek data{} mengharuskan Anda untuk membuka lapisan lebih dalam, dan akhirnya akses properti respons yang Anda inginkan seperti .message dari sana.

Tapi Saya Melakukan Console.Log dan Tidak Ada Respon!

Ya saya tahu, tetapi cobalah untuk mengeluarkan error.response.data hanya untuk menghibur saya.

Untuk beberapa alasan Axios memodifikasi keluaran console.log(error) pada objek kesalahan. Saya tidak yakin mengapa mereka melakukan ini, tetapi jika Anda malah menulis console.log(JSON.stringify(error)) Anda akan melihat seluruh objek dengan segala kemegahannya.

Ini adalah JSON serial yang sulit dibaca setelah sekitar 2 lapisan. Jadi, Anda harus menyalin semuanya dan menempelkannya ke prettifier JSON untuk menjelajahi struktur objek kesalahan.

Jika Anda mendapatkan kesalahan 500 atau kesalahan jenis 400 (atau benar-benar kode kesalahan yang disediakan server) di Axios, maka itu berarti bahwa permintaan telah selesai dan bahwa respons server tersedia untuk Anda!

Masalahnya adalah bahwa itu sangat dalam, dan karena Axios memodifikasi output dari console.log(error) yang dilakukan kebanyakan orang untuk melihat objek error{} , kebanyakan orang tidak tahu bahwa objek itu ada. Tapi itu ada!

@VSG24 kawan !! itu jawaban yang menyelamatkan jiwa :D

fwiw, JSON.stringify(error) meledak di 0.18.0 karena referensi melingkar.

Saya menyiapkan pencegat yang memberi saya respons server pada kesalahan

axios.interceptors.response.use(
  response => {
    // do someting on response
    return response
  },
  error => {
    // do someting on errir
    return Promise.reject(error.response.data) // => gives me the server resonse
  }
)

    try {
      const { data } = await htttp.post(login, payload)
      // do someting with data
    } catch (e) {
      console.log(e) // server response data
    }

@alimirayman Tampaknya berfungsi dengan baik jika kita tidak harus mengawasi setiap permintaan. Tetapi, ketika Anda harus melacak setiap permintaan, tidak masuk akal jika penangan kesalahan diulang di setiap lokasi dalam kode saya. Kecuali saya mengerti salah ( yang mungkin terjadi ) , axios tidak harus memastikan server telah mengembalikan kesalahan sebelum melempar kesalahan ?

@howe29 gunakan circular-json

Saya menemukan utas ini seperti banyak utas lainnya dan saya menggunakan axios dengan modul vue.js dan vuex.

Tindakan modul vuex saya menangkap kesalahan axios dan menjalankan commit(ERROR_HAPPENED, error) untuk menjalankan mutasi ERROR_HAPPENED dari modul vuex. Tetapi kesalahan muncul tanpa properti responsnya yang mengakibatkan error.response menjadi tidak terdefinisi jika saya mencoba menyetel respons ke status vuex.

Jika saya console.log(error.response) dalam aksi, sebelum komit(), saya dapat melihat responsnya. Jadi kemungkinan besar sedang dihancurkan oleh vuex.

Baik komit(ERROR_HAPPENED, error.response.data) atau periksa apakah itu 401 dalam tindakan dan jalankan beberapa komit lain tergantung pada kode status. Karena mangling ini hanya terjadi dengan kode 401. Kesalahan lain seperti 404 atau 500 diteruskan ke mutasi saya.

Tidak hancur. Vuex tidak merusak ini, bahkan oleh bug.
Beberapa jenis kesalahan, sebagian besar di dalam pencegat Axios, menyebabkan ini tidak terekspos.

Beberapa pembaruan?

@AllanPinheiroDeLima maaf atas balasan yang terlambat, tetapi saya rasa tidak ada orang yang menulis pencegat di setiap lokasi kode siapa pun. Kami menulis pencegat satu kali pada basis kode dan menggunakannya sebagai kelas pembantu, itu nomor 1. Nomor 2, pertanyaan awal adalah mereka tidak mendapatkan _server error response_, sebaliknya, mereka mendapatkan _javascript error_ di try catch blok. ada 2 solusi satu untuk mengubah cara server merespons kesalahan atau cara frontend menangkap kesalahan. axios kesalahan pencegat pada dasarnya bertindak sebagai middleware untuk memecahkan masalah itu jika Anda tidak ingin mengubah cara Anda untuk membuat kode atau mengubah basis kode yang besar.

Ya saya setuju. Saya menemukan solusi untuk masalah ini dengan membuat integrasi ke server saya sendiri alih-alih menggunakan keycloak mentah. Dengan cara ini saya bisa mencegat kesalahan di server dan kemudian mengirim yang terbaca ke ujung depan. Saya pikir itu satu-satunya cara untuk menyelesaikan masalah seperti ini untuk saat ini :)

Saya memiliki masalah yang sama belum. Menggunakan pencegat di Axios console.log('interceptors', JSON.stringify(error)) saya mendapatkan log ini interceptors {"config":{"transformRequest":{},"transformResponse":{},"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":-1,"headers":{"Accept":"application/json, text/plain, */*","Content-Type":"application/json;charset=utf-8"},"method":"post","url":"http://localhost:5000/api/autenticacao/login","data":"{\"siglaInstituicao\":\"NEAS\",\"usuario\":\"emersoncpaz\",\"senha\":\"belle1903\"}"},"request":{}} tetapi chrome devtools Response saya memiliki respons yang benar dari api: A network-related or instance-specific error occurred while establishing a connection to SQL Server. The server was not found or was not accessible. Verify that the instance name is correct and that SQL Server is configured to allow remote connections. (provider: Named Pipes Provider, error: 40 - Could not open a connection to SQL Server) Bagaimana cara mendapatkan respons ini dari axios?

Adakah alasan kesalahan 5xx tidak ditangani oleh blok tangkap (tidak mengembalikan objek respons)? Kode status 502 muncul di konsol DevTool tetapi tidak ditangani oleh Axios.

Ini bekerja untuk saya (dengan laravel abort helper: abort(500, 'message'))
```
.catch(kesalahan => {
console.log(error.response.data.message);
});

```

Adakah yang punya contoh kerja lengkap selain potongan kode yang mengatakan ini berhasil? Potongan 1 baris tidak banyak membantu jika Anda tidak tahu siapa yang mereka maksud di utas ini, di mana mereka meletakkan potongan kode itu, seperti apa kode kerja terakhirnya?

Saya mencoba menangkap kesalahan di inerceptor dan berdasarkan kode kesalahan, akhiri permintaan di sana dengan pengalihan jika 401 untuk masuk, atau jika 422 biarkan permintaan kembali ke komponen panggilan untuk memungkinkan pembaruan kesalahan formulir.

Ada ide?

Saya menggunakan aksioma Nuxt dan pencegat onResponseError saya terlihat seperti:

$axios.onResponseError(error => {
    const code = parseInt(error.response && error.response.status)
    console.log(code, 'Axios onResponseError')
    console.log(error.response.status, 'status')
    console.log(error.config, 'config')
    console.log(error.response, 'response')
    // Do something with response error
    if (error.response.status === 401) {
      console.log('unauthorized, logging out ...')
      app.$auth.logout()
      redirect('/login')
    }
    if (code === 400) {
      // redirect('/400')
      console.log(`400 onResponseError`)
    }
    if (code === 408) {
      console.log(`A timeout happened on url onResponseError`)
    }
    if (code === 418) {
      console.log(`A teapot onResponseError`)
    }
    if (code === 428) {
      console.log(`428 onResponseError`)
      // redirect('/login')
    }
    return Promise.reject(error)
  })

Dan panggilan sampel akan terlihat seperti:

async postRecord (clear = false) {
      try {
        const { r } = await this.$axios.$post(this.endPoint, this.formData)
        console.log(r, 'response')
        // do something with response
      } catch (e) {
        console.log(e, 'error in crud') // server response data
        // i should never get here if error since the interceptor should kill the request if 401
       // for testing this request is returning a 401
      } finally {
        this.submitted = false
      }
    },

Terima kasih,
Dave

Ketika tidak ada internet, error.response tidak terdefinisi - apakah ini cara terbaik?

Saya mendapatkan kesalahan dalam teks biasa, saya harus menggunakan yang berikut ini untuk mengonversi kesalahan dalam suatu objek.

var errorObj = JSON.parse(JSON.stringify(error));

Ini turun ke server dan bukan aksioma, sudahkah Anda mencoba menggali ke dalam
error.response.status, jika tidak terdefinisi maka Anda tahu itu adalah Internet
masalah koneksi atau kesalahan sintaks di JS Anda

Pada Rabu, 2 Jan 2019, 15:40 Ibrahim Azhar Armar < [email protected]
menulis:

Saya mendapatkan kesalahan dalam teks biasa, saya harus menggunakan yang berikut ini untuk mengonversi kesalahan dalam
Sebuah Objek.

var errorObj = JSON.parse(JSON.stringify(error));

—
Anda menerima ini karena Anda berkomentar.
Balas email ini secara langsung, lihat di GitHub
https://github.com/axios/axios/issues/960#issuecomment-450896476 , atau bisukan
benang
https://github.com/notifications/unsubscribe-auth/AEETt2r3bt2QCixDlzh4fZvWp_1rPkxuks5u_NMEgaJpZM4N9Ljl
.

@kgrosvenor Saya meletakkan skrip server untuk tidur dan menunggu aksio untuk memicu batas waktu. Saya percaya server pada saat ini tidak merespons sehingga memicu panggilan balik di axios.

Saya mendapatkan pesan kesalahan yang benar namun konsol menunjukkannya dalam teks biasa, oleh karena itu sepertinya hanya masalah pemformatan, yang sepertinya tidak terkait dengan server.

Jika ya, saya mencoba memahami apa yang menyebabkan ini di server?

Kemungkinan besar Anda mencapai batas waktu, coba periksa apakah 'respons' ada dalam kesalahan

axios.get()
.then(function(done) {
   //fine and can get done.data
})
.catch(function(err) {
  //catch the error, check it has a response object with lodash 
  if(_.has(err, 'response') {
     console.log(error.response.status);  
     console.log(error.response.data);
 } 
 else {
    console.log("Most likely a server timeout or an internet connection error");
    console.log("error response property is undefined")
 }
}); 

Pemrogram Java mengirimi saya pesan kesalahan dengan kesalahan 500 dan saya tidak dapat menangani pesan itu. Jadi saya memintanya untuk mengembalikan status 200 dengan pesan kesalahan sebagai tanggapan tetapi dia marah kepada saya dan mengatakan bahwa klien HTTP-nya melihat semua pesan dengan status 500. Dia berpikir bahwa saya bodoh karena saya tidak dapat menemukan pesan kesalahan dengan status 500. Bagaimana saya menjelaskan kepadanya bahwa axios tidak menangani 500 pesan kesalahan?

Pemrogram Java mengirimi saya pesan kesalahan dengan kesalahan 500 dan saya tidak dapat menangani pesan itu. Jadi saya memintanya untuk mengembalikan status 200 dengan pesan kesalahan sebagai tanggapan tetapi dia marah kepada saya dan mengatakan bahwa klien HTTP-nya melihat semua pesan dengan status 500. Dia berpikir bahwa saya bodoh karena saya tidak dapat menemukan pesan kesalahan dengan status 500. Bagaimana saya menjelaskan kepadanya bahwa axios tidak menangani 500 pesan kesalahan?

Sebenarnya, Anda harus dapat menangani kesalahan dengan status 500, Anda dapat memeriksa status http sebagai tanggapan dan memutuskan bagaimana menanganinya di sisi klien. Ini sudah didokumentasikan di tautan ini (https://github.com/axios/axios#handling-errors)

Inilah cara saya menangkap kesalahan 500 dari server, dan itu berhasil untuk saya.

.catch(function (error) {
    var errorObj = JSON.parse(JSON.stringify(error));
    console.log(errorObj);
    if (errorObj.code == 'ECONNABORTED') {
        alert('Connection timed out.');
    }
});

Anda dapat menangani 500 status apa pun, tetapi praktik yang sangat buruk untuk mengembalikannya dengan sengaja dari sisi server menurut saya ...

Saya juga mendapatkan error.response undefined lalu saya mencoba kode di bawah ini.

axios.interceptors.response.use(function (response) {
  return response;
}, function (error) {
  // Do something with response error
  let {response} = error;
  // response?.status === 401 es7 way.
  if (response && response.status === 401) {
    // Do logout;
    // Redirect to login;
    return Promise.reject(error.response);
  } 
  else if (error.response){
    // Do something.
    console.log('some API_CLIENT error');
    return Promise.reject(error.response);
  }
 return Promise.reject(error);
});

Ini terlalu buruk, penanganan kesalahan itu penting.

Bagaimana kabarmu sekarang? Saya masih mengalami masalah yang sama dengan versi 0.18.0!

masalah yang sama dengan saya: @nuxtjs/axios v5.0.0

Ini adalah bug

Pemberitahuan Daniel [email protected]于 2019年2月28日周四 04:39写道：

Biarkan saya meringkas diskusi ini.

tl; dr:
SEMUA ORANG Tidak dapat menangkap kesalahan HTTP adalah masalah.
PENGEMBANG Tidak dapat menangkap kesalahan HTTP bukanlah masalah.

—
Anda menerima ini karena Anda berkomentar.
Balas email ini secara langsung, lihat di GitHub
https://github.com/axios/axios/issues/960#issuecomment-468020991 , atau bisukan
benang
https://github.com/notifications/unsubscribe-auth/AAN8CbMHohyuSZHYlcieD_5yUqizpkSYks5vRuzygaJpZM4N9Ljl
.

Anda harus menyebutkan masalah ini di README, sangat membantu. Terima kasih!

https://github.com/axios/axios/issues/960#issuecomment -320659373

Setuju dengan poster lain. Memiliki objek dengan struktur yang tidak dapat diprediksi diberikan ke catch tergantung pada titik di mana kesalahan terjadi bukanlah hal yang bagus. Baik error.response dan JSON.stringify(error) dapat error sendiri tergantung pada penyebabnya. Pendekatan yang disarankan di https://github.com/axios/axios#handling -errors juga tidak mencerahkan.

Harus melakukan semua akrobat ini untuk mengembalikan pesan kesalahan yang menakutkan adalah memalukan pada tahun 2019. Ini akan memalukan pada tahun 1990. Serius orang-orang JS, tingkatkan permainan Anda. Pelajari beberapa desain API dan kenali 'keputusan kreatif' Anda yang menghabiskan ribuan orang berjam-jam men-debug kekacauan yang sengaja Anda abaikan.

Bagi mereka yang berjuang dengan referensi melingkar, Anda dapat melakukan sesuatu seperti ini:

try {
// your axios request
} catch (error) {
  const { response } = error;
  const { request, ...errorObject } = response; // take everything but 'request'
  res.status(response.status);
  return res.json(errorObject); // or use 'return res.json(response.data.error);' then you don't need to omit the 'request'
}

Bagi mereka yang berjuang dengan referensi melingkar, Anda dapat melakukan sesuatu seperti ini:

try {
// your axios request
} catch (error) {
  const { response } = error;
  const { request, ...errorObject } = response; // take everything but 'request'
  res.status(response.status);
  return res.json(errorObject); // or use 'return res.json(response.data.error);' then you don't need to omit the 'request'
}

Terimakasih teman! kode itu bekerja dengan baik untuk saya.

Masalahnya ada di "lib/core/enhanceError". Objek permintaan ditambahkan ke kesalahan. Masuk akal untuk menambahkan respons ke jawaban karena hanya ada satu parameter dalam API berbasis janji (permintaan perpustakaan mengembalikan kesalahan sebagai parameter pertama dan respons sebagai yang kedua). Tetapi tidak masuk akal untuk menambahkan semua permintaan. Perubahan kode sangat sederhana https://github.com/geoblink/axios/pull/1/files
Saya dapat membuka pr ke cabang utama jika tampaknya penting (saya tidak melakukannya karena masalah sudah ditutup)

Anda dapat membuat pembungkus fungsi yang akan Anda panggil setiap kali membuat permintaan

const api = async (uri, data) => {
  try {
    const { data: response } = await axios({
      url: domain + uri,
      method: 'POST',
      data,
    });

    return response.data;
  } catch (error) {
    throw error.response.data;
  }
};

Kemungkinan besar Anda mencapai batas waktu, coba periksa apakah 'respons' ada dalam kesalahan

axios.get()
.then(function(done) {
   //fine and can get done.data
})
.catch(function(err) {
  //catch the error, check it has a response object with lodash 
  if(_.has(err, 'response') {
     console.log(error.response.status);  
     console.log(error.response.data);
 } 
 else {
    console.log("Most likely a server timeout or an internet connection error");
    console.log("error response property is undefined")
 }
}); 

Ini berhasil untuk saya. Terima kasih

menggunakan "error.response" tidak berfungsi, bagi saya. Masalah terjadi ketika saya memutuskan server database dan server web saya mengembalikan kesalahan 500.

Tab jaringan di alat pengembang

kode tanggapan: 500
badan tanggapan:

{
  "error": {
    "statusCode": 500,
    "name": "Error",
    "message": "read ETIMEDOUT",
    "code": "ETIMEDOUT",
    "errno": "ETIMEDOUT",
    "syscall": "read",
    "stack": "Error: read ETIMEDOUT\n    at exports._errnoException (util.js:1050:11)\n    at TCP.onread (net.js:582:26)"
  }
}

kesalahan konsol chrome:

Uncaught (in promise) Error: Request failed with status code 500
    at createError (createError.js:15)
    at settle (settle.js:18)
    at XMLHttpRequest.handleLoad (xhr.js:77)

Versi: kapan

"aksios": "^0.15.3"

SAMA DISINI...

Dalam pengalaman saya:

"Ubah dari console.log(error) ke console.log(error.response) di tangkapan."

bekerja lebih baik dengan console.log(error.response.data) di tangkapan.

axios.interceptors.response.use(null, error => {
kembali error.respon;
});

getClients: async (status) => {
const res = menunggu axios.get( ${BASE_API}/clients );
console.log('res',res);
jika (res){
state.commit("setClient", res.data);
}
}

Pilihan lain

/**
 * Whenever error.message is accessed we want to se the full API error message (JSON) if it's present
 * not just some generic http status code + message
 * see https://github.com/axios/axios/issues/960 for context
 *
 * <strong i="6">@param</strong> axios
 */
export function extractAPIErrorResponse(axios: AxiosInstance) {
    axios.interceptors.response.use(undefined, function (error: AxiosError) {
        (error as any).originalMessage = error.message;
        Object.defineProperty(error, "message", { get: function () {
            if (!error.response) {
                return (error as any).originalMessage;
            }
            return JSON.stringify(error.response.data);
        }});
        return Promise.reject(error);
    })
}

Mencoba{
Tunggu ini.$axios .....
}tangkap(e)
{
console.log(e)

}

axios.get("https://......") 
     .then( response => {
          return response
}).catch( () => {
         store.dispatch("errorComponentMethod")   // if there's an error, method is dispatched
})
//////////////////////////////////////
actions : {
      errorComponentMethod(){
              router.push("/errorComponent")     // method routes to error component
      }
}

Terima kasih banyak ! Sangat membantu!

masih mendapatkan masalah ini. pada chrome debugger, responsnya benar tetapi axios mengembalikan "Request failed with status code 403" sebagai gantinya

Saya masih mengalami ini dan saya benar-benar bingung. Saya mencoba menangkapnya adalah komentar di atas - tetapi mengapa tepatnya aksio kembali tidak terdefinisi ketika ada kesalahan?
try{ const res = await axios.get("someurl"); return res; } catch(e) { console.log(e); }
res tidak terdefinisi meskipun server mengirim kembali respons dengan pesan di dalamnya untuk MENGAPA itu tidak berhasil. Dan saya tidak bisa mendapatkan data itu... kenapa??

**EDIT: menemukan bug saya - tidak ada yang salah bagi saya dengan axios. Lihat komentar saya dua komentar ke bawah. Singkatnya pencegat saya tidak meneruskan data kesalahan kembali melalui pipa axios jadi saya selalu tidak terdefinisi.

@HoogsterInc Lihat definisi TypeScript di sini
Anda bisa melakukan sesuatu seperti ini

try {
   axios.get(...)
} catch (error) {
   if (error.reponse) {
      // http status 4x, 5xx
   } else {
      // network error like timeout, connection refused etc...
   }
}

Terima kasih atas tanggapan yang mencoba membantu @konstantinblaesi -- Saya menemukan masalah saya.

Bagi saya, saya memiliki pencegat yang disiapkan untuk memeriksa otentikasi pengguna, yang jika mereka menjadi tidak diautentikasi dengan mengirim kode kesalahan tertentu. Namun saya tidak meneruskan data kesalahan ketika kesalahan tidak cocok dengan kode yang tidak diautentikasi ... hiks ... kesalahan buruk yang konyol. Jadi setelah memeriksa kode kesalahan yang tidak diautentikasi, saya memastikan untuk mengembalikan Promise.reject(error); - Itu memecahkan masalah saya dan data kesalahan sudah penuh sekarang.

Anda dapat menggunakan err.toJSON()

catch((err) => {
    console.log(err.toJSON()); // Return error object
});

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

(ditetapkan untuk global)

di main.js

import axios from 'axios'

var instance = axios.create(
 { validateStatus: function (status) {
    return status < 600; #you can change this with another value
  }
 });

atau
(ditetapkan untuk tertentu)

  axios.post('/formulas/create', {
       name: "",
       parts: ""
  }, { validateStatus: function (status) {
          return status < 600; // Reject only if the status code is greater than or equal to 500
        }})
    .then( 
   (response) => { console.log(response) },
   (error) => { console.log(error) }
   );

Axios & tangkap 500 data respons kesalahan

const log = console.log;

  updateData(options = {}, flag = false){
    let url = `/opapi/appDownloadGuide/update`;
    let message = '更新成功!';
    let errorMessage = '更新失败!';
    if (flag) {
      message = '添加成功!';
      errorMessage = '添加失败!';
      url = `/opapi/appDownloadGuide/add`;
    }
    axios
    .post(url, options)
    .then(res => {
      // ❓🤔️500 , 在这里拦不住呀？
      log(`res`, res, res.status);
      return res.data;
    })
    .then(json => {
      const {
        code,
        success,
        data,
        errorCode,
        errorHint,
      } = json;
      if(code === 200) {
        this.$message({
          type: 'success',
          message,
        });
        this.init();
      } else{
        this.$message({
          type: 'error',
          message: `${errorMessage}: ${errorHint ? errorHint : ""}`,
        });
      }
    })
    .catch(err => {
      // 👌在这里拦截 error data!
      log(`error.response`, err.response);
      const {
        data,
        status,
        statusText,
      } = err.response;
      this.$message({
        type: "error",
        message: `${statusText}-${status}: ${data || ""}`,
        // message: "不能重复创建",
      });
      console.error(`500 err`, err);
    });
  },

https://stackoverflow.com/questions/38798451/how-to-catch-and-handle-error-response-422-with-redux-axios

Saya memiliki lingkungan yang persis sama. Coba ini:

axios.post('/formulas/create', {
  name: "",
  parts: ""
})
.then(response => { 
  console.log(response)
})
.catch(error => {
    console.log(error.response)
});

_Ubah dari console.log(error) menjadi console.log(error.response) di catch _.

Anda juga dapat menggunakan pencegat global dan hanya menolak error.response . Masalahnya adalah ketika console.log mencoba untuk menampilkan kesalahan, representasi string dicetak, bukan struktur objek, jadi Anda tidak melihat properti .response .

Tidak bekerja untuk saya

@gopal-g itu tidak terdefinisi untuk saya.

@gopal-g ya sama tidak terdefinisi yang saya dapatkan.

Saya menggunakan Axios 0.19.2. Saya menambahkan solusi @konstantinblaesi :

Pilihan lain

/**
 * Whenever error.message is accessed we want to se the full API error message (JSON) if it's present
 * not just some generic http status code + message
 * see https://github.com/axios/axios/issues/960 for context
 *
 * <strong i="9">@param</strong> axios
 */
export function extractAPIErrorResponse(axios: AxiosInstance) {
    axios.interceptors.response.use(undefined, function (error: AxiosError) {
        (error as any).originalMessage = error.message;
        Object.defineProperty(error, "message", { get: function () {
            if (!error.response) {
                return (error as any).originalMessage;
            }
            return JSON.stringify(error.response.data);
        }});
        return Promise.reject(error);
    })
}

Ini berhasil untuk saya, terima kasih banyak @konstantinblaesi ! Saya tidak mengerti mengapa perilaku default Axios tidak seperti ini -- perilaku standarnya adalah membuang bagian "pesan" dari kesalahan asli, yang menurut saya adalah bagian terpenting!

Untuk memperjelas, di aplikasi saya, server saya mengembalikan kesalahan 400 (yang seharusnya merupakan respons):

% curl -X POST http://my-server/api -d '{"foo": "bar"}'
{"status": 400, "message": "missing param XYZ"}

dan tanpa perbaikan ini, saya mendapatkan dari Axios objek kesalahan yang hanya berisi name , stack , config (yang memiliki permintaan asli), dan tidak ada "respon". Tetapi dengan perbaikan ini kesalahan berisi properti message dari server.

Adapun mengapa tidak ada properti "response" tanpa perbaikan ini, tampaknya terkait dengan settle di axios.js sekitar baris 1171:

        module.exports = function settle(resolve, reject, response) {
          var validateStatus = response.config.validateStatus;
          if (!validateStatus || validateStatus(response.status)) {
            resolve(response);
          } else {
            reject(createError(
              'Request failed with status code ' + response.status,
              response.config,
              null,
              response.request,
              response
            ));
          }
        };

dan Anda dapat melihatnya tidak melewati response.message saat membuat kesalahan. Selain itu, di aplikasi saya, saya tidak melihat respons di error.response , tidak ada properti seperti itu -- saya tidak mengerti itu. Tapi bagaimanapun perbaikan di atas bekerja untuk saya.

Saya mencoba menangkap kesalahan validasi dari server.

Kode:

axios.post('/formulas/create', {
       name: "",
       parts: ""
})
.then( 
  (response) => { console.log(response) },
  (error) => { console.log(error) }
);

Keluaran log konsol

Error: Request failed with status code 422
    at createError (app.js:6765)
    at settle (app.js:29489)
    at XMLHttpRequest.handleLoad (app.js:6600)

Keluaran tab jaringan
{"name":["Bidang nama wajib diisi."],"parts":["Bidang bagian wajib diisi."]}

Saya seharusnya melihat objek yang berisi validasi formulir JSON karena itu adalah respons di tab jaringan saya, sepertinya saya mendapatkan keluaran tangkapan JS?

Juga mencoba yang berikut ini:

axios.post('/formulas/create', {
  name: "",
  parts: ""
})
.then(response => { 
  console.log(response)
})
.catch(error => {
    console.log(error)
});

Hasil yang sama

Lebih banyak orang tampaknya memiliki masalah yang sama menggunakan lingkungan yang sama dengan saya di sini.
https://laracasts.com/discuss/channels/vue/issues-with-axios-catch-method

• Versi aksio: ^0.16.2
• VueJS 2.3.4
• Vue-template-compiler 2.3.4
• Laravel-campuran
• Lingkungan: simpul v6.4.0, chrome 58, Mac OSX 10.12.4

axios.post('/formula/buat', {
nama: "",
bagian: ""
})
.kemudian(
(tanggapan) => { console.log(tanggapan) },
).catch(err => consol.log(err.response.data)});

error.response adalah sebuah objek , ia akan menampilkan [objek, objek] di log konsol.
Anda harus menggunakan error.reposne.data untuk mengakses pesan kesalahan.
lihat: https://itnext.io/javascript-error-handling-from-express-js-to-react-810deb5e5e28

@chandukasm ya, tetapi dalam kasus saya, saya _not_ memiliki error.response -- itu tidak ditentukan, meskipun permintaan dikirim dan respons diterima oleh express. Lihat juga komentar saya di atas; pesan diabaikan (diganti dengan pesan umum) bahkan ketika ada respons.

error.response adalah sebuah objek , ia akan menampilkan [objek, objek] di log konsol.
Anda harus menggunakan error.reposne.data untuk mengakses pesan kesalahan.
lihat: https://itnext.io/javascript-error-handling-from-express-js-to-react-810deb5e5e28

jika Anda melihat [objek, objek] di console.log maka lakukan saja JSON.stringify(error.response) untuk melihat kesalahan yang sebenarnya.

Tidak ada objek error.response .

return this.$axios
  .post(postUrl, payload, { responseType: 'json' })
  .then(
    (response) => {
      this.message = `RESP: ${JSON.stringify(response)}`;
    },
    (reason) => {
      this.message = `REAS: ${JSON.stringify(reason)}`;
    }
  )
  .catch((err) => {
    this.message = `CATCH: ${JSON.stringify(err)}`;
  });

payload berisi nilai buruk dengan sengaja untuk memicu HTTP 422, yang di Postman berfungsi seperti yang diharapkan dan server (LB4) mengembalikan kesalahan lengkap dalam format JSON yang menjelaskan di mana data input salah, tetapi dalam aksio, objek error.response tidak ditentukan .