Is it possible to throw an error on purpose inside the .then() block in axios? For instance, if the api responds with 204 status code, could I throw an error and run the catch block?
For example:
axios.post('link-to-my-post-service', { json-input }).then(response => { if (response.status === 200) { //proceed... } else { // throw error and go to catch block } }).catch(error => { //run this code always when status!==200 });
EDIT
I tried this, but it didn't work:
var instance = axios.create({ validateStatus: function (status) { return status == 200; } }); axios.post('link-to-my-post-service', {input: myInput}, instance) .then(response => { dispatch({ type: "FETCH_SUCCESS", payload: response.data }); }).catch(error => { dispatch({ type: "FETCH_FAILED", payload: error }); });
When I get a status code 204, still the executed block is then() block instead of the catch block.
EDIT 2
The correct answer using Ilario's suggestion is this:
var instance = axios.create({ validateStatus: function (status) { return status == 200; } }); instance.post('link-to-my-post-service', {input: myInput}) .then(response => { dispatch({ type: "FETCH_SUCCESS", payload: response.data }); }).catch(error => { dispatch({ type: "FETCH_FAILED", payload: error }); });
Now when the status code is not equal to 200 the catch block code is executed.
get('https://example.com/does-not-exist'); const data = res. data; console. log(data); } catch (err) { if (err. response) { // ✅ log status code here console.
By default, the axios HTTP library throws an error anytime the destination server responds with a 4XX / 5XX error (for example, a 400 Bad Request ). Since axios raises an error, your workflow will stop at this step. See the axios docs for more information.
It's not possible to retrieve response bodies for non 200 HTTP responses because Axios throws an exception for non 2xx codes. This does not complies to the browser Fetch API. Some APIs return data even if the response code is not 200 OK.
If you give a look at the GitHub Project Page you will notice following option description.
/* `validateStatus` defines whether to resolve or reject the promise for a given * HTTP response status code. If `validateStatus` returns `true` (or is set to `null` * or `undefined`), the promise will be resolved; otherwise, the promise will be */ rejected. validateStatus: function (status) { return status >= 200 && status < 300; // default },
So you could create an Instance with your own configuration.
var instance = axios.create({ validateStatus: function (status) { return status == 200; }, });
You could also set defaults. These will be applied to every request.
axios.defaults.validateStatus = () => { return status == 200; };
UPDATE 1
To set the config only on a specific operation you could replace "config" with your desired values or methods.
axios.post(url[, data[, config]])
UPDATE 2
I tried this, but it didn't work.
You cannot pass the instance to axios.post(). You must call post on the new instance.
var instance = axios.create({ validateStatus: function (status) { return status == 200; } }); instance.post('url', data, config);
Thank you very much for your suggestions. The answer was simpler than I expected.
I didn't want to set any default options to change the behavior of axios, so I just tried something like the code below, and it worked. Every time the code throw new Error("Error");
is executed, the catch block code is executed after that.
axios.post('link-to-my-post-service', { json-input }).then(response => { if (response.status === 200) { //proceed... } else { // throw error and go to catch block throw new Error("Error"); } }).catch(error => { //when throw "Error" is executed it runs the catch block code console.log(error) });
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With