full-stack-fastapi-template
full-stack-fastapi-template copied to clipboard
Replace plaintext auth tokens with HttpOnly cookies
Overview
Currently authentication tokens are sent in plain text format. This can be a security vulnerability because attackers can run malicious JS scripts in the browser to access the user's token and perform session hijacking. A recommended solution for this vulnerability is to send auth tokens in a Cookie with the HttpOnly flag set. HttpOnly cookies’ content is not accessible from JavaScript, preventing XSS attacks from stealing these tokens.
Backend changes:
- We use the original
create_access_tokenfunction to generate the JWT token but instead of returning it directly in the/loginendpoint, we return a JSONResponse with an http-only cookie, which contains the token. - In the updated
get_current_userfunction, now there is anAPIKeyCookiedependency, but the way we decode the JWT token didn't change. - I implemented the
/logoutendpoint which deletes the cookie. - The cookie has a predefined expiration – after it expires, the user gets logged out automatically when they try to navigate to another page (which sends an authenticated request to the backend).
- Updated the backend tests accordingly
Frontend changes:
- In the frontend API calls, we should set the
withCredentials=trueparameter to include the cookies in the requests - Instead of sending the token in the headers, we should use the cookies request parameter
- Instead of storing the
access_tokeninlocalStorage(the token is not accessible from JS anymore), now we store theis_authenticatedboolean value and use it to check authentication and remove it during logout