intermediate

Mixed content

Explain why HTTPS pages block or upgrade insecure subresources, how mixed content breaks apps, and how CSP and asset hygiene help.

Mixed content happens when an HTTPS page loads subresources over HTTP. Browsers block active mixed content (scripts, XHR, iframes) and may warn or upgrade passive content (images, video).

Backend impact: APIs referenced as `http://` in frontend config break after HSTS rollout. Redirect chains that downgrade to HTTP cause subtle failures. CSP `upgrade-insecure-requests` helps migrate legacy asset URLs.

					Content-Security-Policy: upgrade-insecure-requests
Strict-Transport-Security: max-age=31536000; includeSubDomains
				

Node services should generate absolute URLs with the correct scheme from trusted configuration (`X-Forwarded-Proto` behind proxies), not from client-supplied Host headers alone.

On interviews: trace a broken login after enabling HTTPS; explain HSTS preload implications; separate browser mixed-content rules from server-side outbound HTTP calls.

Common pitfalls: hard-coded `http://` API base URLs in SPAs; trusting `X-Forwarded-Proto` without validating proxy trust; mixed WebSocket schemes.

The trade-off is balancing simplicity, performance, safety, and operability — name which axis you optimized and what cost you accepted.

Checklist:

  • Serve all browser-facing assets over HTTPS.
  • Build URLs from trusted base config.
  • Use HSTS after verifying full HTTPS coverage.
  • Audit third-party embeds for HTTP dependencies.