Security in Angular

Angular Official Docs are pretty great! — Security in Angular is important!

Things we should remember:

🔐 Best Practices
➖ Stay updated with Angular library releases.
➖ Avoid altering Angular core
➖ Steer clear of APIs marked “Security Risk”.

🔐 XSS Prevention
➖ Block malicious code entry to DOM.
➖ Angular treats all values as untrusted by default.
➖ Sanitizes values inserted into DOM from templates.
➖ Templates are trusted; avoid creating them with user input.

🔐 Sanitization and Security Contexts
➖ Angular sanitizes values for HTML, styles, and URLs.
➖ Context-specific: HTML, Style, URL, Resource URL.
➖ Development mode warnings for sanitization changes.

🔐 Direct DOM API Use & Explicit Sanitization
➖ Use Angular templates over direct DOM interaction.
➖ For unavoidable cases, use Angular sanitization functions.

🔐 Trusting Safe Values
➖ Use DomSanitizer for necessary executable code or URLs.
➖ Context-specific methods like bypassSecurityTrustHtml.

🔐 Content Security Policy (CSP)
➖ Prevents XSS via web server configuration.
➖ Requires unique per-request nonces for Angular to render styles.

🔐 Enforcing Trusted Types
Use HTTP headers with one of the following Angular Policies:
➖ angular
➖ angular#unsafe-bypass
➖ angular#unsafe-jit
➖ angular#bundler

🔐 Server-side XSS Protection
➖ Avoid creating Angular templates on the server side.
➖ Use templating languages that auto-escape values.

🔐 HTTP-level Vulnerabilities
➖ Built-in support for CSRF/XSRF and XSSI.
➖ Cooperate server and client for anti-XSRF technique.

🔐 Auditing Angular Applications
➖ Follow regular web app security principles.
➖ Audit Angular-specific APIs marked as sensitive.

A more in-depth look can be found in Docs:
angular .dev/guide/security

Let’s get connected! You can find me on:
- Medium: https://medium.com/@nhannguyendevjs
- dev.to: https://dev.to/nhannguyendevjs
- Linkedin: https://www.linkedin.com/in/nhannguyendevjs/
- X (formerly Twitter): https://twitter.com/nhannguyendevjs