Patterns 9 patterns
Security
Defense-in-depth patterns for protecting user data and the people who trust your application. Security on the frontend is rarely a single fix. It comes from several layers of protection, each stopping a different kind of attack. These patterns help you restrict where code can come from, treat untrusted input safely, validate requests, and keep sensitive data out of the wrong hands.
- Content Security Policy (CSP) An HTTP header that tells the browser where scripts and other resources can load from, so it can block XSS and other injection attacks.
- CSRF Protection Anti-CSRF tokens and SameSite cookies stop other sites from sending forged requests that use your logged-in users' cookies.
- Input Sanitization Cleaning and validating user-provided data before you render or process it, so your app is protected from injection attacks.
- Output Encoding Escaping data for the place it's rendered prevents XSS, because the browser then treats user input as plain text instead of running it as code.
- PII Redaction Removing or masking personally identifiable information before it gets into your logs, analytics, and error reports.
- SameSite Cookie The SameSite cookie attribute controls when browsers send cookies on cross-site requests, and it helps prevent CSRF attacks.
- Secure Token Storage Keeping authentication tokens in httpOnly cookies with the Secure and SameSite flags stops injected scripts from stealing them.
- Subresource Integrity Integrity hashes on external scripts and stylesheets let the browser check that the files haven't been tampered with.
- Trusted Types Trusted Types makes dangerous DOM sinks like innerHTML reject plain strings, so DOM-based XSS can't get in through an unsanitized assignment.