Catch statement not working when request fails

Question

export const registerUser = formData => async dispatch => {

    try {
        const response = await fetch('http://localhost:5000/api/users', {
            method: 'POST',
            body: formData
        })

        const data = await response.json()
        console.log(data)

        dispatch({
            type: 'auth/setToken',
            payload: data.token
        })
    } catch (err) {
        console.log(err)
    }
}

In the above code, I'm sending form data to post route. To test this out, I submitted form without any data and expected some errors from backend like name, email can't be empty. But even though request fails and gets 400 from backend, it's still not executing catch statement instead I get the errors assigned to data variable.

`fetch` doesn't throw on non-200 – Daniel A. White Mar 20 '23 at 18:15 — Daniel A. White, Mar 20 '23 at 18:15

score 0 · Answer 1 · answered Mar 20 '23 at 18:06

0

fetch does not reject on a HTTP error status, so you'll need to check response.ok.

const response = await fetch('http://localhost:5000/api/users', {
    method: 'POST',
    body: formData
});
if (!response.ok) {
    // handle unsuccessful request
    return;
}

answered Mar 20 '23 at 18:06

Unmitigated

76,500
11
62
80

In this case, will ```catch``` statement ever be used? – Yash Sharma Mar 20 '23 at 18:08
@YashSharma The catch will be used when there's a network failure. – Unmitigated Mar 20 '23 at 18:09
Ok, appreciated :) – Yash Sharma Mar 20 '23 at 18:12

Catch statement not working when request fails

1 Answers1