What's the recommended command, library or tool for making API calls within react-router?

[binarykitchen]

Hello all,

In short, I'm stuck with HTTP 302 redirects being ignored for unauthenticated users. In my case, I expect a redirect happening back to the login page within react-router.

Sounds like a basic question.

Yet, here is the longer version: when you pick Axios for example, fetch the user resource unauthenticated, it grabs the new location within the HTTP 302 header right-away and does another API call without my will (this within the react-route loader).

Axios shouldn't make a subsequent call. The new location should be passed over to react-router to change the page, in my example, back to the login page.

This makes me question Axios, whether it's suitable for react-router. I've researched, read the documentation, there is no mention of this use case. To me, it feels like Axios is too bloated and shouldn't do subsequent API calls automatically. Should I go back to the native fetch?

How do you handle 302 redirects for unauthenticated users in react-router based apps? Is Axios still recommended?

Just starting a discussion. Thanks for all your inputs :)

[GabenGar]

Do you perform these API calls in client or server loader?
Not to mention 302 is a wrong status for API to return for auth-dependent requests.

[binarykitchen]

API calls are from the client side, within React effects, for example.

Yes, I realised 302 was wrong. Express.js default redirect() function uses 302 which was misleading. Had to add 401 manually to make it work.