Configuring an Amazon Web Services static site to use Cloudflare
You can use Cloudflare to proxy sites that rely on Amazon Web Services (AWS) to store static content using Amazon’s Simple Storage Service (S3).
This article assumes that:
- your site is associated with a registered domain, and
- you have static content, such as images or HTML pages, to add to your S3 bucket.
To get started, follow the instructions below.
Configure your AWS S3 buckets
In this guide, let’s assume that you’d like your site to be available via both:
- A subdomain URL, such as
- the apex domain (also known as “root domain”) URL, such as
To accomplish this, you will need to configure two S3 buckets by completing the tasks below.
Task 1 - Set up an S3 bucket for a subdomain
To create and configure your subdomain S3 bucket, follow these instructions from Amazon:
- Use the AWS management console to . For the Bucket name, use the subdomain URL without the
https://part; for example,
- Then, . After you save the static website hosting configuration, you can skip disabling public access for your bucket.
Task 2 - Set up an S3 bucket for a apex domain
After you’ve set up your subdomain bucket, you can create and configure your apex domain bucket. Follow these instructions from Amazon:
- Use the AWS management console to . For the Bucket name, use the domain URL without the
https://part; for example,
- Next, you need to redirect requests from this bucket’s URL to the subdomain bucket URL you created. Follow the steps in . For Target Bucket or Domain, enter the same bucket name that you used for the subdomain bucket in Task 1; for example,
Configure bucket policies to allow Cloudflare IP addresses
Now that you’ve created your buckets and enabled hosting for static content, you can set up permissions to allow Cloudflare to access your bucket. This ensures that your site only responds to requests coming from the Cloudflare proxy. This is the used by the Cloudflare proxy.
To set up your policy:
- Follow these instructions from Amazon to .
- For the step where you enter the policy in the Bucket policy editor, use this sample to fill out the needed JSON code, making sure to replace:
$ curl -I -L example.comHTTP/1.1 301 Moved PermanentlyDate: Tue, 23 Jan 2018 23:17:44 GMTConnection: keep-aliveCache-Control: max-age=3600Expires: Wed, 24 Jan 2018 00:17:44 GMTLocation: https://example.com/Server: cloudflareCF-RAY: 3e1e77d5c42b8c52-SFO-DOG
Upload static content to your S3 bucket
Set up your site on Cloudflare
Before setting up your site on Cloudflare, ensure you have the URLs or endpoints for both your subdomain and root buckets. For each bucket, you can find the URL in the AWS S3 console under Properties > Static website hosting > Endpoint.
To get started:
- Follow the instructions to . If you already have an account, you can go directly to Add a domain to Cloudflare.
- When you get to the step to verify your DNS records in the DNS query results screen, you will need to create two new CNAME records for the subdomain and apex domain URLs, respectively.
- Click Add Record to create the subdomain DNS record (e.g.,
www.example.com). Follow instructions for adding a CNAME record in .
- In the Name field, enter the subdomain name; for example, www.
- In the Value field, enter the subdomain bucket endpoint. Do not include the
- Click Save.
- Next for the apex domain (e.g.
example.com), click Add Record. Follow instructions for adding a CNAME record in .
- In the Name field, enter the apex domain name; for example, example.com.
- In the Value field, the apex domain bucket endpoint. Do not include the
- Click Save.
- Since S3 static sites do not support HTTPS by default, use a to set the SSL Mode to .
- To finish, .
Once your site is fully configured in Cloudflare, your visitors can access your AWS S3 hosted content using either the subdomain or apex domain endpoint you set up.
I keep getting “Invalid hostname: Use ‘@’ to represent the root domain.” when creating DNS records in Cloudflare.
- Make sure you are creating CNAME records and not another record type.
Cloudflare is my domain name registrar and I don’t know how to change my nameservers.
- You don’t need to change the nameservers if you are already using Cloudflare as a domain name registrar.
My static HTML pages show up as HTML code without any formatting on my domain.
- Ensure that you have selected the correct metadata options in Set Properties > Metadata > Header: Content-Type, Value: text/html.