Goal: to create a static website hosted on S3 and Cloudflare securely — by which I mean restrict access to the contents of the bucket to Cloudflare only.
First we’ll create your S3 bucket. Login to the AWS console and head over the S3 service and click the big blue + Create Bucket button to start the wizard that will guide you through creating your bucket.
The first question it’ll ask you is for a name. The name that you will need to enter will need to match the eventual hostname website you plan to host. I’m going to create
testing.mattandre.ws so I’ve named the bucket that:-
Leave the rest as default and hit Next.
On the Configure options you can leave all the other options as default.
Again leave this as default (Block all public access), which at first might not seem intuitive as we’re making a public website. But don’t worry, in a later step we will grant permission just to Cloudflare to access the content.
Assuming you’ve followed everything correctly so far — go ahead and hit Create Bucket.
Staying in the AWS console for the S3 service, click into your newly created empty bucket, and click Properties.
Then, click the Static website hosting box — and choose Use this bucket to host a website.
You’ll need to enter the Index document, which I’ll set to be their suggestion,
Make sure to take note of the
Endpoint — you’ll need that later! In my case this is
Next, click the Permissions tab of your S3 bucket (between Properties and Management) and click Bucket Policy.
Take a copy of the following JSON, take care to replace
testing.mattandre.ws (my bucketname) with your bucket name, then paste it into the Bucket policy editor. Then click Save.
(This grants Cloudflare’s IP ranges read-only access to your S3 bucket contents)
Strictly speaking not necessary but useful to check everything is working.
I uploaded an
index.html file with the contents
<h1>Hello world</h1> to my S3 bucket.
- Login to your Cloudflare dashboard
- Click on the domain that you’ll be setting up a static website on (in my case
- Then click DNS
- Click Add record
- Set the Type to be
- Set the Name to be the subdomain (or leave blank if you are creating a static website on the root of your website)
- Set the Target to be equal to the Endpoint that you were given in step 5 but remove the
/suffix. In my case this is
- Leave TTL and Proxy Status to be their defaults (Auto and Proxied)
- Click Save
You’re done — load up your domain to see the fruits of your hard work: https://testing.mattandre.ws.