Skip to content

AWS CloudFront CDN Guide

Overview

CloudFront is a content delivery network that caches and serves content from edge locations close to users. Use it for serving media files, static assets, and web applications with HTTPS and low latency.

When to Use CloudFront

Content TypeOriginCloudFront?
Processed media (images, files)S3 public bucketYes
Static assets (JSON, config)S3 public bucketYes
Web applications (SPA)S3 static hostingYes
API endpointsAPI GatewayUsually no (API Gateway handles its own edge)

Response Header Policies

Create reusable response header policies before creating distributions:

No-Cache Policy

For dynamic content that must not be cached in the browser:

  • Name: no-caching-in-browser
  • Custom Header: Cache-Control: no-store, no-cache, must-revalidate, max-age=0
  • Origin Override: Yes

CORS Policy

For content served to web applications from different origins:

  • Name: simple-cors-with-origin-override
  • CORS: Enabled
  • Allow Origin: All origins (or restrict to known domains)
  • Allow Methods: OPTIONS, GET, HEAD
  • Origin Override: Yes

Distribution Configuration

For each distribution:

SettingValue
OriginS3 website endpoint (not the bucket ARN)
Viewer Protocol PolicyRedirect HTTP to HTTPS
Alternate Domain NameYour subdomain (e.g., media.domain.com)
SSL CertificateUS East ACM certificate
Default Root Objectindex.html (for web apps)

SPA Routing

For single-page applications, configure custom error responses:

  • Error Code 404 → Response Page /index.html → Response Code 200

This routes all paths to the SPA router.

Cache Management

  • Use cache invalidation (/*) after deploying new content
  • Set appropriate Cache-Control headers at the S3 origin for static assets
  • CloudFront distributions take 15-30 minutes to deploy or update

Alternatives

ServiceWhen to Use
CloudflareCloud-agnostic, includes DNS and DDoS protection
FastlyAdvanced edge computing needs
AWS CloudFrontDeep AWS integration, same-account billing

Released under the MIT License.