Agent-Skills.md

Agent Skills: Security

Harden Angular apps against XSS, CSP violations, and unauthorized access. Use when implementing XSS protection, Content Security Policy, or auth guards in Angular.

UncategorizedID: hoangnguyen0403/agent-skills-standard/angular-security

Repository

hoangnguyen0403/agent-skills-standard
HoangNguyen0403License: MIT
567164

Install this agent skill to your local

pnpm dlx add-skill https://github.com/HoangNguyen0403/agent-skills-standard/tree/HEAD/skills/angular/angular-security

Skill Files

Browse the full folder contents for angular-security.

Download Skill

Loading file tree…

skills/angular/angular-security/SKILL.md

Skill Metadata

Name
angular-security
Description
Harden Angular apps against XSS, CSP violations, and unauthorized access. Use when implementing XSS protection, Content Security Policy, or auth guards in Angular.

Security

Priority: P0 (CRITICAL)

Principles

  • XSS Prevention: Angular sanitizes interpolated values by default — {{ userInput }} safe. NOT use innerHTML unless absolutely necessary (e.g., trusted static CMS content). For user-generated content, display as text with {{ content }} — never as HTML.
  • Trusted HTML APIs: Mark HTML as trusted only for content you control (e.g., vetted CMS headers). Never mark user-provided data as trusted. Prefer DomSanitizer.sanitize(SecurityContext.HTML, content) and review every trust-marking call as a potential XSS vector.
  • Route Guards: Protect all sensitive routes with functional CanActivateFn (e.g., inject(Router).createUrlTree(['/login'])). Apply with canActivate: [authGuard].

Guidelines

  • CSP: Configure CSP headers on server (not in Angular source). Use nonce-based CSP with script-src 'nonce-{nonce}' and avoid unsafe-inline/unsafe-eval.
  • HTTP: Use Interceptors to attach secure tokens. Use HttpOnly cookies managed by server — not localStorage or sessionStorage because they accessible via XSS.
  • Secrets: Never store API keys or secrets in Angular source code or bundle.

Anti-Patterns

  • No trust-marking on user input: Trust Angular's sanitization; reserve trusted HTML APIs for verified static content only.
  • No localStorage for tokens: Use HttpOnly cookies via interceptors for auth tokens.
  • No secrets in source: Never embed API keys or secrets in Angular bundle code.

References

CSP and secret checklist

  • Use a server-generated, per-response nonce in script-src 'nonce-{nonce}'; do not use a static nonce.
  • Keep controlled provenance explicit: trust-mark only controlled and verified or vetted static CMS content.
  • Do not put API keys or other secrets in the compiled bundle.

Canonical response anchors

  • Additional task-grounded exact anchors: {{ content }}