Frontend System Design
/Advanced
JWT Security
Definition
JSON Web Tokens are stateless authentication tokens. Storing them in localStorage makes them completely vulnerable to XSS. They must be stored in `HttpOnly`, `Secure`, `SameSite` cookies.
Explain Like I'm New
If you leave your house key (JWT) on the welcome mat (localStorage), anyone can steal it. Put it in a locked mailbox (HttpOnly Cookie) that only the mailman (the browser) can access.
Terminal Output
bash / terminal
// SECURE COOKIE CONFIGURATION (Node.js)
res.cookie('token', jwtToken, {
httpOnly: true, // Prevents JS access (Beats XSS)
secure: true, // Only sent over HTTPS
sameSite: 'strict', // Prevents sending cross-site (Beats CSRF)
maxAge: 3600000
});
Interview Questions
basic
- What is the core concept of JWT Security?
- What are the pros and cons of JWT Security?
intermediate
- How does JWT Security impact SEO and initial page load times?
- When would you NOT choose to use JWT Security?
advanced
- How does JWT Security fit into a heavily scaled microservices architecture?
- What are the security implications of JWT Security?
trick
- Can you combine JWT Security with other rendering strategies on the same page?