How do you handle authentication tokens in a React app securely?
Model answer
Prefer HttpOnly, Secure, SameSite cookies set by the server, since JavaScript cannot read them, which reduces token theft through XSS. Storing tokens in localStorage is simple but exposed to XSS. Protect against XSS (escape output, use a content security policy), add CSRF protection when using cookies, and keep short-lived access tokens with refresh.
The server must enforce authorisation. The client only controls what is shown.
Learn this topic
TanStack Query (React Query): Fetching, Caching and Updating Server Data in the course React.js Full Course: Beginner to Advanced.
Sign in to add your own answer.
More questions
- How do you show loading and error states when fetching data?
- What does TanStack Query (React Query) give you over useEffect and fetch?
- What is the difference between server state and client state?
- When do you need Redux, Zustand or another state library?
- What is Redux Toolkit and why is it recommended over plain Redux?
- What is optimistic UI and how can you build it?