AWS S3 static website hosting using SSL (ACM)

Arshad Zackeriya
DevOps SriLanka
Published in
4 min readNov 29, 2017

Before AWS introduced the static web hosting with S3 i was paying more than 5$ to 10$ for servers for host my personal portfolio which is a HTML static page. Then i got to know that we can host static pages in AWS using S3 and Route53 services. After that AWS Launched ACM “AWS Certificate Manager” which is a free services you can get a SSL certificate for your web site or the web application, however it supports only for ELB,CloudfrontAWS Elastic Beanstalk,Amazon API Gateway and AWS CloudFormation. I wanted to share my experience to others hope this will helpful for someone. I spent less than 1$ per month as my hosting cost.

Requesting the SSL Certificate from the AWS Certificate Manager

first you have to go to the AWS Certificate Manager and request a SSL certificate, like we request in other vendors we do not need any CSR for request the SSL certificate.

then we have to select a validation method from below

if you select the DNS validation you aws will provide the CNAME records to validate or if you select the Email validation method AWS will send an email to the domain owner. If you have successfully validated the domain names “Issued” text will appear under the status as below.

Creating the S3 Bucket and uploading the files.

First create a S3 Bucket as per to the below steps.

Bucket names are unique, type a name then select the region you want and go to the next section. in the “ Set properties” section no need to select anything right now and you can leave it and go to the “ Set permission” section.

Its really important to select the “Grant public read access to this bucket”. why we have selected this? buckets are always create as private access only unless we chose to go public. since this is a static website we have to give public read permission. then go to review and create the bucket.

If you have followed the steps, a label as “public” should appear on the bucket as below.

lets upload the html,css,js and image files to the bucket, its easy as just drag and drop the files.

again you have to select the “Grant public read access to this object(s)” for your web site files. this time we are granting permissions for the objects we are uploading.

Review and complete the upload. now lets do the magic.

go to the s3 buckets and select your bucket first, then click the “Properties” tab.

select the “Static website hosting”.

Please copy and keep the “Endpoint” url in a text file we need that for later. type the name of your index page html file and error page (404) page name.Once you click save and if all good you should able to access your site using the Endpoint URL.

CloudFront configurations

create a web distribution in the CloudFront section. let me point the important parameters and the fields.

DO NOT SELECT THE S3 BUCKET from the list, please past the S3 “Endpoint” URL instead in the Origin Domain Name field. select “Redirect HTTP to HTTPS” from the Viewer Protocol Policy.

Add your domain names in the alternate domain names filed and select the SSL certificate you have created in the ACM. once done please proceed and create the distribution.

Final DNS changes in the Route53

I am using Route53 as my DNS server if you are using any other dns server don’t worry, copy the domain name from the CloudFront distribution and create a CNAME record in your DNS server.

yourdomain.com — — -> (CNAME) — — -> d16XXXXXXXXX.cloudfront.net

Route53 i am using an alias record, will be writing a separate article about AWS Route53 and i will explain more about alias records.

Once all done you should able to access the site with SSL enabled as below.

yay!! we have done it :) . do let me know your success stories and same as if you have any issues configuring this.

--

--

Arshad Zackeriya
DevOps SriLanka

Enabling DevOPs ☁ | A Cloud Enthusiast | AWS Community Builder | AWS Fanboy!!