Kordant/tasks/web-production/01-security-headers-cors.md

01. Security Headers & CORS Configuration

meta: id: web-production-01 feature: web-production priority: P1 depends_on: [] tags: [security, infrastructure, production]

objective:

• Implement comprehensive security headers and CORS configuration to protect against common web vulnerabilities

deliverables:

• Security headers middleware in web/src/middleware.ts or Nitro config
• CORS configuration for API endpoints
• Content Security Policy (CSP) headers
• Remove X-Powered-By and other identifying headers

steps:

1. Add helmet-like security headers via Nitro hooks or Vite plugin:
   • Strict-Transport-Security (HSTS)
   • X-Content-Type-Options: nosniff
   • X-Frame-Options: DENY
   • X-XSS-Protection: 1; mode=block
   • Referrer-Policy: strict-origin-when-cross-origin
   • Permissions-Policy for camera, microphone, geolocation
2. Implement CSP header allowing only necessary sources:
   • script-src: 'self', stripe.com, clerk.dev
   • style-src: 'self', 'unsafe-inline' (needed for Tailwind)
   • img-src: 'self', data:, blob:, gravatar.com
   • connect-src: 'self', api endpoints, websocket URL
   • frame-src: 'self', stripe.com (for Checkout)
3. Configure CORS for /api/trpc endpoints:
   • Allow origins: production domain, mobile app origins
   • Allow methods: GET, POST
   • Allow headers: Content-Type, Authorization, x-api-key
   • Credentials: true
4. Remove server-identifying headers (X-Powered-By, Server)
5. Add tests verifying headers are present on all responses

tests:

• Unit: Test each header is present and correct value
• Integration: Test API endpoints return correct CORS headers
• Security scan: Use securityheaders.com or similar to verify A+ rating

acceptance_criteria:

• All 8 security headers present on every HTTP response
• CSP blocking inline scripts except nonce/hash approved
• CORS preflight requests handled correctly for API endpoints
• SecurityHeaders.com scan returns A+ rating
• No server version information leaked in headers

validation:

• Run curl -I https://localhost:3000 and verify headers
• Run automated security header scanner
• Check browser dev tools Network tab for all response headers

notes:

• SolidStart/Nitro may require custom plugin for headers
• CSP 'unsafe-inline' for styles is acceptable with Tailwind v4 but document the trade-off
• Consider using nonce-based CSP once Tailwind supports it fully