Use your domain for a static website in an Amazon S3 bucket
This getting started tutorial shows you how to perform the following tasks:
Register a domain name, such as example.com
Create an Amazon S3 bucket and configure it to host a website
Create a sample website and save the file in your S3 bucket
Configure Amazon Route 53 to route traffic to your new website
When you're finished, you'll be able to open a browser, enter the name of your domain, and view your website.
Note
You can also transfer an existing domain to Route 53, but the process is more complex and time-consuming than registering a new domain. For more information, see Transferring registration for a domain to Amazon Route 53.
Topics
- Prerequisites
- Step 1: Register a domain
- Step 2: Create an S3 bucket for your root domain
- Step 3 (optional): Create another S3 Bucket, for your subdomain
- Step 4: Set up your root domain bucket for website hosting
- Step 5 : (optional): Set up your subdomain bucket for website redirect
- Step 6: Upload index to create website content
- Step 7: Edit S3 Block Public Access settings
- Step 8: Attach a bucket policy
- Step 9: Test your domain endpoint
- Step 10: Route DNS traffic for your domain to your website bucket
- Step 11: Test your website
- Step 12 (optional): Use Amazon CloudFront to speed up distribution of your content
Prerequisites
Before you begin, be sure that you've completed the steps in Set up Amazon Route 53.
Step 1: Register a domain
To use a domain name (such as example.com), you must find a domain name that isn't already in use and register it. When you register a domain name, you reserve it for your exclusive use everywhere on the internet, typically for one year. By default, we automatically renew your domain name at the end of each year, but you can turn off automatic renewal. For more information, see Registering a new domain.
Step 2: Create an S3 bucket for your root domain
Amazon S3 lets you store and retrieve your data from anywhere on the internet. To organize your data, you create buckets and upload your data to the buckets by using the AWS Management Console. You can use Amazon S3 to host a static website in a bucket. The following procedure explains how to create a bucket.
To create an S3 bucket for your root domain
Open the Amazon S3 console at https://console.aws.amazon.com/s3/
. -
Choose Create bucket.
-
Enter the following values:
- Bucket name
-
Enter the name of your domain, such as example.com.
- Region
-
Choose the Region closest to most of your users.
Make note of the Region that you choose; you'll need this information later in the process.
-
To accept the default settings and create the bucket, choose Create bucket.
Step 3 (optional): Create another S3 Bucket, for your subdomain
In the preceding procedure, you created a bucket for your domain name, such as example.com. This allows your users to access your website by using your domain name, such as example.com.
If you also want your users to be able to use www.your-domain-name
, such as
www.example.com, to access your sample website, create a second S3 bucket. Configure
the second bucket to route traffic to the first bucket.
To create an S3 bucket for www.your-domain-name
-
Choose Create bucket.
-
Enter the following values:
- Bucket name
-
Enter www.
your-domain-name
. For example, if you registered the domain name example.com, enter www.example.com. - Region
-
Choose the same Region that you created the first bucket in.
-
To accept the default settings and create the bucket, choose Create.
Step 4: Set up your root domain bucket for website hosting
Now that you have an S3 bucket, you can configure it for website hosting.
To allow website hosting on your S3 bucket
Open the Amazon S3 console at https://console.aws.amazon.com/s3/
. -
In the Buckets list, choose the name of the bucket that you want to enable for static website hosting.
-
Choose Properties.
-
Under Static website hosting, choose Enable.
-
Choose Use this bucket to host a website.
-
Under Static website hosting, choose Enable.
-
In Index document, enter the file name of the index document, typically
index.html
.The index document name is case sensitive and must exactly match the file name of the HTML index document that you plan to upload to your S3 bucket. When you configure a bucket for website hosting, you must specify an index document. Amazon S3 returns this index document when requests are made to the root domain or any of the subfolders.
-
(Optional) To provide your own custom error document for 4XX class errors, in Error document, enter the custom error document file name.
If you don't specify a custom error document and an error occurs, Amazon S3 returns a default HTML error document.
-
(Optional) If you want to specify advanced redirection rules, in Redirection rules, enter XML to describe the rules.
For more information, see Configuring advanced conditional redirects in the Amazon Simple Storage Service User Guide.
-
Choose Save changes.
-
Under Static website hosting, note the Endpoint.
The Endpoint is the Amazon S3 website endpoint for your bucket. After you finish configuring your bucket as a static website, you can use this endpoint to test your website, as shown in Step 9: Test your domain endpoint.
After you use the following steps to edit settings for public access and add a bucket policy that allows public read access,you can use the website endpoint to access your website.
Step 5 : (optional): Set up your subdomain bucket for website redirect
After you configure your root domain bucket for website hosting, you can optionally
configure your subdomain bucket to redirect all requests to the root-domain. For example,
you can configure all requests for www.example.com
to be redirected to
example.com
.
To configure a redirect
On the Amazon S3 console, in the Buckets list, choose your subdomain bucket name (for example,
www.example.com
).Choose Properties.
Under Static website hosting, choose Edit.
Choose Redirect requests for an object.
In the Target bucket box, enter your root domain, for example,
example.com
.For Protocol, choose http.
Choose Save changes.
Step 6: Upload index to create website content
When you allow static website hosting on your bucket, you enter the name of the index
document (for example, index.html
). After you allow static
website hosting for the bucket, you upload an HTML file with this index document
name to your bucket.
To upload an index file
-
Copy the following example text you can use as a simple one-page website for this tutorial, paste it into a text editor, and save it as index.html:
<html> <head> <title>Amazon Route 53 Getting Started</title> </head> <body> <h1>Routing Internet Traffic to an Amazon S3 Bucket for Your Website</h1> <p>For more information, see <a href="https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/getting-started.html">Getting Started with Amazon Route 53</a> in the <emphasis>Amazon Route 53 Developer Guide</emphasis>.</p> </body> </html>
-
In the Buckets list, choose the name of the bucket that you want to enable static website hosting for.
-
In the Amazon S3 console, choose the name of the bucket that you created in the procedure To allow website hosting on your S3 bucket (click the linked bucket name).
-
Choose Upload, Add Files, select index.html from where you saved it, and then Upload.
-
If you created and error document, for example,
404.html
, follow steps 3 through 5 to upload it.
Step 7: Edit S3 Block Public Access settings
By default, Amazon S3 blocks public access to your account and buckets. If you want to use a bucket to host a static website, use these steps to edit your public access settings.
Warning
Before you complete this step, review Blocking public access to your Amazon S3 storage to ensure that you understand and accept the risks involved with allowing public access. When you turn off block public access settings to make your bucket public, anyone on the internet can access your bucket. We recommend that you block all public access to your buckets.
To route traffic to your website
Open the Amazon S3 console at https://console.aws.amazon.com/s3/
. Choose the name of the bucket that you have configured as a static website.
Choose Permissions.
Under Block public access (bucket settings), choose Edit.
Clear Block all public access, and choose Save changes.
Amazon S3 turns off Block Public Access settings for your bucket. To create a public, static website, you might also have to edit the Block Public Access settings for your account before adding a bucket policy. If account settings for Block Public Access are currently turned on, you see a note under Block public access (bucket settings).
Step 8: Attach a bucket policy
After you edit Amazon S3 Block Public Access settings, you can add a bucket policy to grant public read access to your bucket objects. When you grant public read access, anyone on the internet can access your bucket.
Warning
Before you complete this step, review Blocking public access to your Amazon S3 storage to ensure that you understand and accept the risks involved with allowing public access. When you turn off block public access settings to make your bucket public, anyone on the internet can access your bucket. We recommend that you block all public access to your buckets.
To route traffic to your website
Open the Amazon S3 console at https://console.aws.amazon.com/s3/
. -
Under Buckets, choose the name of your bucket.
-
Choose Permissions.
-
Under Bucket Policy, choose Edit.
-
Copy the following bucket policy and paste it into a text editor. This policy grants everyone on the internet (
"Principal":"*"
) permission to get the files ("Action":["s3:GetObject"]
) in the S3 bucket that is associated with your domain name ("arn:aws:s3:::
).your-domain-name
/*"{ "Version":"2012-10-17", "Statement":[{ "Sid":"AddPerm", "Effect":"Allow", "Principal":"*", "Action":[ "s3:GetObject" ], "Resource":[ "arn:aws:s3:::
your-domain-name
/*" ] }] } -
Update the value for
Resource
toyour-domain-name
, for exampleexample.com
. -
Choose Save changes.
Step 9: Test your domain endpoint
After you configure your domain bucket to host a public website, you can test your endpoint. You can test the endpoint only for your domain bucket because your subdomain bucket is set up for website redirect and not static website hosting.
Note
Amazon S3 does not support HTTPS access to the website. If you want to use HTTPS, you can use Amazon CloudFront to serve a static website hosted on Amazon S3.
For more information, see Requiring HTTPS for Communication Between Viewers and CloudFront.
Under Buckets, choose the name of your bucket.
Choose Properties.
At the bottom of the page, under Static website hosting, choose your Bucket website endpoint.
Your index document opens in a separate browser window.
Step 10: Route DNS traffic for your domain to your website bucket
You now have a one-page website in your S3 bucket. To start routing internet traffic for your domain to your S3 bucket, perform the following procedure.
To route traffic to your website
Open the Route 53 console at https://console.aws.amazon.com/route53/
. -
In the navigation pane, choose Hosted zones.
Note
When you registered your domain, Amazon Route 53 automatically created a hosted zone with the same name. A hosted zone contains information about how you want Route 53 to route traffic for the domain.
-
In the list of hosted zones, choose the name of your domain.
-
Choose Create record.
Note
Each record contains information about how you want to route traffic for one domain (such as example.com) or one subdomain (such as www.example.com or test.example.com). Records are stored in the hosted zone for your domain.
Choose Switch to wizard.
-
Choose Simple routing and choose Next.
-
Choose Define simple record.
-
In Record name, accept the default value, which is the name of your hosted zone and your domain.
-
In Record type, choose A ‐ Routes traffic to an IPv4 address and some AWS resources.
-
In Value/Route traffic to, choose Alias to S3 website endpoint.
-
Choose the Region.
-
Choose the S3 bucket.
The bucket name should match the name that appears in the Name box. In the Choose S3 bucket list, the bucket name appears with the Amazon S3 website endpoint for the Region where the bucket was created, for example,
s3-website-us-west-1.amazonaws.com (example.com)
.Choose S3 bucket lists a bucket if one of the following is true:
You configured the bucket as a static website.
The bucket name is the same as the name of the record that you're creating.
The current AWS account created the bucket.
If your bucket does not appear in the Choose S3 bucket list, enter the Amazon S3 website endpoint for the Region where the bucket was created, for example,
s3-website-us-west-2.amazonaws.com
. For a complete list of Amazon S3 website endpoints, see Amazon S3 Website endpoints. For more information about the alias target, see "values/route traffic to" section in Values specific for simple alias records. -
For Evaluate target health, choose No.
-
Choose Define simple record.
(Optional) To add an alias record for your subdomain
(www.example.com
)
If you created a bucket for your subdomain, add an alias record for it also.
-
Under Configure records, choose Define simple record.
-
In Record name for your subdomain, type
www
. -
In Record type, choose A ‐ Routes traffic to an IPv4 address and some AWS resources.
-
In Value/Route traffic to, choose Alias to S3 website endpoint.
-
Choose the Region.
-
Choose the S3 bucket, for example,
s3-website-us-west-2.amazonaws.com (example.com)
.If your bucket does not appear in the Choose S3 bucket list, enter the Amazon S3 website endpoint for the Region where the bucket was created, for example,
s3-website-us-west-2.amazonaws.com
. -
For Evaluate target health, choose No.
-
Choose Define simple record.
-
On the Configure records page, choose Create records.
Step 11: Test your website
To verify that the website is working correctly, open a web browser and browse to the following URLs:
http://
your-domain-name
, for example,example.com
– Displays the index document in theyour-domain-name
buckethttp://www.
your-domain-name
for example,www.example.com
– Redirects your request to theyour-domain-name
bucket
In some cases, you might need to clear the cache to see the expected behavior.
For more advanced information about routing your internet traffic, see Configuring Amazon Route 53 as your DNS service. For information about routing your internet traffic to AWS resources, see Routing internet traffic to your AWS resources.
Step 12 (optional): Use Amazon CloudFront to speed up distribution of your content
CloudFront is a web service that speeds up distribution of your static and dynamic web content, such as .html, .css, .js, and image files, to your users. CloudFront delivers your content through a worldwide network of data centers called edge locations. When a user requests content that you're serving with CloudFront, the user is routed to the edge location that provides the lowest latency (time delay), so that content is delivered with the best possible performance.
If the content is already in the edge location with the lowest latency, CloudFront delivers it immediately.
If the content is not in that edge location, CloudFront retrieves it from an Amazon S3 bucket or an HTTP server (for example, a web server) that you have identified as the source for the definitive version of your content.
For information about using CloudFront to distribute the content in your Amazon S3 bucket, see Adding CloudFront when you're distributing content from Amazon S3 in the Amazon CloudFront Developer Guide.