javascriptaxios

Can I throw error in axios post based on response status


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.


Solution

  • 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);