Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
  • Overview
  • Transcript

2.8 CloudFront: Content Distribution

Static hosting on S3 (Simple Storage Service) and CloudFront is a very common strategy for distributing static site assets or other media. In this lesson, we are going to host a static website on S3 and use CloudFront to leverage the AWS content distribution network to make it available with low latency all over the world.

Related Links

2.8 CloudFront: Content Distribution

Hi, welcome back to Explore Amazon.Services. In this lesson, we are going to look at the simple storage solution as three. And the content distribution service, Cloud Run. Before I start setting up our homepage I'm going to show you where the content comes from. I use the cost results from the Building Static Websites of Jekyll cost, with Guy Routledge, he owns Tuts+. If you want to know how he created it, go check it out. To start off we need to create the bucket. I call it tutsplus-sample-site-cdn, and put it into the Oregon region. To place files in the buckets we can either use a compatible client on the computer or simply drag and drop the files and folders into the upload form. After that is done, we can create a CloudFront distribution. You can either create a distribution for hosting, content, or live streaming or a RTMP distribution to distribute video content stored on S3 over the flash media server protocol. Then we have to set our origin. We're going to choose the S3 bucket we created before. The origin path can point to a subfolder, if you only want to make a part of the content available. You can also restrict bucket access to only allow access over CloudFront. The service takes care of setting up identities and policies. You also have to specify the cache behavior. This will be the protocol allowed HTTP methods and auto settings. Then you also have to choose which locations you want to distribute to and eventual alternate the main names. You can also use a certificate you uploaded in IAM for HTTPS. Then we set the root object to index.html, which gets requested when you don't specify any file or folder in your HTTP request. Whenever you change the CloudFront settings, it takes a while before the changes have propagated to all locations, so be patient. I am now going to show you some more settings for your distribution. First, you can have multiple origins under a single distribution. You specify the Xs of these origins of behaviors. In our case there is only the default behavior that tracks everything to all on the origin. You can also specify error codes for each HTTP status code. Geo Restrictions are another feature of CloudFront. To make a content only available in, for example Austria, or exclude certain countries in a blacklist. Whenever you have data in your cache that needs to be changed immediately, you can create an invalidation which removes one or more objects from the cache. Now that we are done with our tour through the distribution settings, we can see if the distribution was deployed. It says it's done, but don't let that fool you. If you create the distribution for the first time, it will take several hours to be completely set up. When the setup is done, we can visit our distribution by its CloudFront URL. And you can see the homepage works just fine. But when I click on the hire me page, it doesn't work and I get an access denied response, although we set a root object. This is because the root object only works on the very root of the distribution and not on folders. To make it work we have to set up S3 static website hosting and ease the access restrictions of it. The setup is very fast and easy. We just enable website hosting in the bucket. Set the index and arrow documents which in this case also work in folders, and update our pocket policies to add viewing permissions for everyone. This means that our S3 bucket would be directly accessible with its URL. But that is also problematic, since nobody will try to find out the URL for the bucket anyways, because it makes no sense to do so. To make use of it in our distribution, we need to create a new origin that doesn't point to the bucket, but the static website URL. We also have to update the default behavior to use this new origin. When the changes are deployed, we can visit our site and try it out. When I go to the about page, it works. Great. We can also visit the page from our S3 website domain now. A quick note at the end though, when you want to create an S3 website without CloudFront, and use a C name in your DNS, the bucket name has to be exactly the domain you're using to point to it, otherwise it won't find the bucket. Now you know how to host a website or any other asset on S3 and use CloudFront to deliver it fast and efficiently to your users all over the world. In the next lesson we're going to set up a domain for use with AWS using the route 53 DNS service. See you there.

Back to the top