Axios Handling Errors

How can I get the status code from an HTTP error in Axios?

What you see is the string returned by the toString method of the error object. (error is not a string.)

If a response has been received from the server, the error object will contain the response property:

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

How to properly handle axios errors and how to get detailed error descriptions?

The error can occur at different parts - Request, Response.

Request errors occur when there is no response. Like 404 etc, which has no default response.

Response errors have when API sends custom response to handle errors.

I used to handle this way:

const handleErrorResponse = (error) => {
let errorResponse;
if(error.response && error.response.data) {
// I expect the API to handle error responses in valid format
errorResponse = error.response.data;
// JSON stringify if you need the json and use it later
} else if(error.request) {
// TO Handle the default error response for Network failure or 404 etc.,
errorResponse = error.request.message || error.request.statusText;
} else {
errorResponse = error.message;
}
throw new Error(errorResponse);
}

now,

axios.get(/foo/bar)
.then(res => doSOmething())
.catch(err => handleErrorResponse(err))

The I use error handling the error response as string.
The same you can use it with axios interceptor should you need.

Getting error handler data from post request in AXIOS

Actually the error is stocked in your response const, did you tried :

await axios.post(url).catch((err) => { console.error(err) });

Edit : I found out this issue on github, i hope she can be revelant for solve your problem :

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

https://github.com/axios/axios/issues/960

Accessing the HTTP error body data in an axios catch clause

You need to access the response object within error.

function (ent) {
return axios
.post(config.ROOT_API + '/api/backstory/', {new_parent_entity: ent, child_entity: this.entity})
.then(({data}) => {
console.log(data)
})
.catch((e) => {
console.log(e.response) // this returns
})

Handle error in axios.get and data received in react/js

I'm not sure what error you're facing with the search problem.

The other one's the error you get when you pass undefined to Object.keys or Object.values function.

I'm gonna guess the API returns some data for invalid links so chart is not undefined. In the code, you're checking to make sure chart is not undefined. But most likely, chart['Time Series (Daily)'] is undefined.

I don't know enough about your requirements to suggest a fix. But you could add an additional check and make it so...

const stockPrices = useMemo(() => chart && chart['Time Series (Daily)'] && Object.values(chart['Time Series (Daily)']).map(i => i['1. open']).reverse(), [chart]); 
const stockDates = useMemo(() => chart && chart['Time Series (Daily)'] && Object.keys(chart['Time Series (Daily)']).map(x => x.replace(/\d{4}-/, "")).reverse(), [chart]);

But I think it'd be better to fix the fetch code.

axios.get(baseUrl)
.then(res => {
if (res.data?.['Time Series (Daily)']) {
setChart(res.data);
}
else {
setChart(undefined);
//maybe set some error states so you can display the appropriate message?
}
})

How to catch network errors with Axios request interceptor?

Did you try?

return Promise.reject(error);

like this:

axios.interceptors.response.use(function (response) {
// Any status code that lie within the range of 2xx cause this function to trigger
// Do something with response data
return response;
}, function (error) {
// Any status codes that falls outside the range of 2xx cause this function to trigger
// Do something with response error
return Promise.reject(error);
});


Related Topics



Leave a reply



Submit