Frontend Security Boundaries
A React frontend runs in an adversarial environment. Users can inspect and modify client-side JavaScript, requests, and local storage. Therefore, authorization must be enforced on the server.
Avoid injecting untrusted HTML. Prefer React's normal text rendering and sanitize content when HTML must be rendered from untrusted sources. Protect authentication tokens according to the application's threat model and understand the tradeoffs between cookies, memory, and browser storage.
Frontend validation improves UX; server authorization and validation provide security.
Never trust the client
A hidden button, disabled input, or client-side role check is not authorization. The server must enforce permissions.
Key Takeaways
- The browser is not a trusted security boundary.
- Avoid unsafe HTML injection.
- Authorization must be enforced server-side.