- Use CloudFront in front of your S3 bucket, in this way you get custom domains and HTTPS and decrease requests (and its associated costs) to the S3 origin. Don't bother with S3 website hosting, unless you're using another CDN to front the website. Even then, I'd rather use CDN -> CloudFront -> S3 just to prevent setting the bucket as public and leverage some behaviors (see below)
- On CloudFront, remember to set a default root object (this is the index.html file)
- If you are using a router on your SPA, set CloudFront to handle 403 and 404 errors as custom responses - return 200 with the path set as your /index.html
- Getting 403 on CloudFront? Check your bucket policy first!
- Page not updating? Remember to invalidate the cache after updating the files in the bucket.
- Want to avoid CORS shenanigans? You can add your API Gateway endpoint as an custom origin with no caching on the same distribution but on another path.
- Use CloudFront in front of your S3 bucket, in this way you get custom domains and HTTPS and decrease requests (and its associated costs) to the S3 origin. Don't bother with S3 website hosting, unless you're using another CDN to front the website. Even then, I'd rather use CDN -> CloudFront -> S3 just to prevent setting the bucket as public and leverage some behaviors (see below)
- On CloudFront, remember to set a default root object (this is the index.html file)
- If you are using a router on your SPA, set CloudFront to handle 403 and 404 errors as custom responses - return 200 with the path set as your /index.html
- Getting 403 on CloudFront? Check your bucket policy first!
- Page not updating? Remember to invalidate the cache after updating the files in the bucket.
- Want to avoid CORS shenanigans? You can add your API Gateway endpoint as an custom origin with no caching on the same distribution but on another path.