How to deliver websites via CloudFront

Learn the steps to using Amazon CloudFront for developing and testing a website.

Amazon CloudFront is a useful tool for AWS developers in speeding up and testing a large website. It saves costs of frequently accessed static content -- like website images, videos, media files and software downloads. Performance is better than with the websites launched from Amazon S3 buckets.

You start with Amazon S3 Console before you use CloudFront. You create an S3 bucket (s3-example.com) for the root domain. Click the bucket to get inside. To fill the empty bucket with website files, right-click and select Upload.

If you have a folder of many website files, consider uploading the entire folder rather than wasting your time uploading one file at a time. To upload, click Enable Enhanced Uploader (BETA) -- a Java™ Applet. Make sure you have installed Java SE 7 Update 51 or later.

To enable website hosting:

  • Right-click the bucket and then open Properties.
  • Click Static Website Hosting and select Enable website hosting.
  • In the Index Document box, type index.html.
  • In the Error Document box, type error.html. All error types are directed to the same error page.
  • Click Save.

To make your content available to the public:

  • Click Permissions.
  • Click Add Bucket Policy.
  • Copy and paste it in the Bucket Policy Editor.

{
 "Version":"2012-10-17",
 "Statement":[{
    "Sid":"AddPerm",
    "Effect":"Allow",
     "Principal": {
      "AWS": "*"
     },
   "Action":["s3:GetObject"],
   "Resource":["arn:aws:s3:::example.bucket.com/*"
   ]
  }
 ]
}

  • Click Save.

To enable logs:

  • Click Logging.
  • Check off Enabled.
  • In the Target Bucket box, type logs.s3-example.com.
  • In the Target Prefix box, type logs/.

The default Storage Class is Standard. The default Server Side Encryption is None. If the root domain contains sensitive data, choose AES-256.

To test if your website is working, use the endpoint provided to you when you enable website hosting. It contains a region endpoint for the bucket (in red).

Next, create the second bucket for the www.subdomain. To redirect requests to the root domain:

  • Right-click the bucket and then open Properties.
  • Click Static Website Hosting and then select Redirect all requests to another host name.
  • Enter s3-example.com.
  • Click Save.

The redirection works only when you've registered the www.subdomain with a domain registrar of your choice.

Testing the performance of a very large website via the CloudFront distribution does not require domain registration. The fee that you may pay is based on the global edge locations you are deploying to, and the volume of data that is transferred from those edge locations.

To create a CloudFront distribution:

  • Open the Amazon CloudFront console.
  • Click Create Distribution.
  • Accept Web as the default delivery method. The Web option replaces the Download option in the earlier versions of CloudFront.
  • Click Continue to go to the next page.

Once you get to the Create Distribution page, do the following:

  • In the Origin Domain Name box, enter the Amazon S3 static website hosting endpoint for your bucket: s3.example.com.s3-website-us-east-1.amazonaws.com. Ignore the downlist from the box.
  • The Origin Value is automatically filled in for you.
  • Leave Origin Protocol Policy, HTTP Port and HTTPS Port at their default settings.
  • Leave the values under Default Cache Behavior Settings as their default settings.

Under Distribution Settings:

  • Accept Price Class set to Use All Edge Locations (Best Performance). CloudFront employs a network of edge locations that cache copies of popular files close to your viewers. It ensures that end-user requests are sent to the closest edge location. Shorter distances mean a website will perform faster and save you the costs of frequently accessing the website.
  • Set Alternate Domain Names (CNAMEs) to root domain (s3-example.com) and www.subdomain. Alias records are created from the specified domain names.
  • Set Default Root Object to index.html.

To keep track of the tasks you have performed,

  • Set Logging to On.
  • In Bucket for Logs, select the logging bucket (logs.s3-example.com).
  • Set Log Prefix to cdn/.

You don't need Cookie Logging and Comment. Make sure Distribution State is set to Enabled.

When you're done, click Create Distribution. It may take up to 15 minutes to attain the distribution status of deployment. When deployed, a CloudFront domain name is created. To test if it's working, you can link on it from the panel.

In conclusion, if you are satisfied with the performance with the CloudFront distribution, you can register with a domain register. When you start over, you will need to configure Amazon Route 53 as your DNS provider to a hosted zone.

This was first published in April 2014

Dig deeper on AWS tools for development

Pro+

Features

Enjoy the benefits of Pro+ membership, learn more and join.

0 comments

Oldest 

Forgot Password?

No problem! Submit your e-mail address below. We'll send you an email containing your password.

Your password has been sent to:

-ADS BY GOOGLE

SearchCloudApplications

SearchSOA

TheServerSide

SearchSoftwareQuality

SearchCloudComputing

Close