This tutorial will give you a step by step instruction on how to host your static website on Amazon S3 and then map it to your existing or new domain.
Why to host website on Amazon S3.
If you already have a website, you probably deal with one of the hosting providers, which offers you a certain amount of server space with a limited bandwidth that your website can consume per month for a fixed fee. Every time your site exceeds the quota, it’s very likely you’ll be switched off and asked either to keep within the package or upgrade to more expensive one. With Amazon S3 you pay only for what you use. There is no limitations or minimal fee. You pay only for disk space and bandwidth your website consumes. You even can start using Amazon absolutely for free. You will get the first 5 GB of storage and 15GB of data transfer out each month for one year with no charge.
Learn more about this free offer and Amazon S3 pricing.
All you will need.
To host your website you will need Amazon S3 account and a freeware Amazon S3 client - Cloudberry S3 Explorer. If you don’t have your account or haven’t used any amazon s3 browser before, read our step-by-step instruction which will help you create s3 account and connect it to Cloudberry S3 Explorer.
Sign-up for Amazon S3 account
Download Free Cloudberry S3 Explorer
Get started.
After you get equipped with Amazon S3 account connected to Cloudberry S3 Explorer, you are ready to start. Just launch S3 Explorer and create a new bucket in the right hand part of the S3 file manager. Insure that the bucket you created has exactly the same name as your website. For instance, if you want to host http://www.mybrandnewsite.com, the bucket must have ‘mybrandnewsite.com’ name.
Now upload all your website pages with images, CSS and other files to the bucket, you’ve just created. You can do that by dragging & dropping files and folders from the left side pane to the right side or by selecting all files you want to copy and pressing F5.
Make S3 bucket public.
When you have all your webpages in the bucket you need to make it public. In other words, you need to allow any Internet user to access information stored in the bucket. There are two ways you can do that. The first one is ACL and the second is Bucket Policy. To open access to your bucket with ACL settings, you need to select your bucket and then click on “ACL Settings” button in the tool panel just above the list of buckets.
You will see the dialog box where you must choose “Public (everyone)” option and check the box “Apply for all subfolders and files”.
If you prefer Bucket Policy to grant read access to the bucket and all files and folders inside it, you must select the bucket and click on “Bucket Policy” button located on the toolbar. The advantage of using Bucket Policies is that it applies to all new files in the bucket automatically. It’s recommended to use only one of two options, either ACL settings or Bucket policy.
After you will click the “Bucket Policy” button you will see the dialog where you need to choose “Policy Script” folder and paste the script below:
{
"Version":"2008-10-17",
"Id":"http referer policy example",
"Statement":[
{
"Sid":"Allow get requests referred by www.mybrandnewsite.com, mybrandnewsite.com and IP address",
"Effect":"Allow",
"Principal":"*",
"Action":"s3:GetObject",
"Resource":"arn:aws:s3:::mybucket/*",
"Condition":{
"StringLike":{
"aws:Referer":[
"http://www.mybrandnewsite.com/*",
"http://mybrandnewsite.com/*",
"http://***.***.***.***/*"
]
}
}
}
]
}
IMPORTANT! You need to put your bucket name as well as website address and IP address instead of lines marked with red. The most important is that you insert your site addresses in aws:Referer element and your bucket name in resource element.
Prevent hotlinking.
Using of Bucket Policy will give you one more benefit. The following clause takes care of preventing hotlinking. Just replace the URLs and IP address with the ones related to your website:
"Condition":{
"StringLike":{
"aws:Referer":[
"http://www.mybrandnewsite.com/*",
"http://mybrandnewsite.com/*",
"http://***.***.***.***/*"
Turn your bucket into a website.
The last thing you should do is enable website function for the bucket. To do this, right click on your bucket and choose “Website”. You will see the dialog box in which you should put mark on “Turn on Website” and enter page names for index.html and error.html documents.
Now your S3 bucket can be accessed as the website by typing in web browser URL that was automatically generated. In my case it looks like http://mybrandnewsite.com.s3-website-us-west-1.amazonaws.com/. Here is how the URL is formed http://<bucketname>.s3-website-<region-endpoint>.amazonaws.com.
You need to put your bucket name instead of <backetname> and a region endpoint instead of <region-endpoint>. If you don’t know the region you can find it in the bucket properties in Cloudberry Explorer. Right click on the bucket and choose “Properties”. Region of you bucket location is the second line of the list.
Then check what address you need in the box below and you will get the generated web URL of your bucket. Don’t forget to check if the URL you’ve compiled is actually working. Just paste it in your browser and if your website appears, everything is fine, if not try to make the URL once more.
Map S3 bucket to your domain.
The last step is to get rid of the ugly URL generated by Amazon and map your S3 bucket to the domain you want Internet users find your website at. It is also quite easy to do. All you have to do is to configure appropriate CNAME in your hosting provider control panel. All hosting provider offers a way to create CNAMEs and you will just have to find out the details. To create a CNAME record you will have to specify an alias which is URL Amazon S3 generated for your bucket.
You will probably have to wait for a while before the changes will affect.
+++
As always we would be happy to hear your feedback and you are welcome to post a comment.
CloudBerry S3 Explorer is a Windows freeware product that helps managing Amazon S3 storage and CloudFront . You can download it at http://www.cloudberrylab.com/free
CloudBerry S3 Explorer PRO is a Windows program that helps managing Amazon S3 storage and CloudFront . You can download it at http://www.cloudberrylab.com/pro It is priced at $39.99
Like our products? Please help us spread the word about them. Learn here how to do it.
Want to get CloudBerry Explorer PRO for FREE? Make a blog post about us!
Why to host website on Amazon S3.
If you already have a website, you probably deal with one of the hosting providers, which offers you a certain amount of server space with a limited bandwidth that your website can consume per month for a fixed fee. Every time your site exceeds the quota, it’s very likely you’ll be switched off and asked either to keep within the package or upgrade to more expensive one. With Amazon S3 you pay only for what you use. There is no limitations or minimal fee. You pay only for disk space and bandwidth your website consumes. You even can start using Amazon absolutely for free. You will get the first 5 GB of storage and 15GB of data transfer out each month for one year with no charge.
Learn more about this free offer and Amazon S3 pricing.
All you will need.
To host your website you will need Amazon S3 account and a freeware Amazon S3 client - Cloudberry S3 Explorer. If you don’t have your account or haven’t used any amazon s3 browser before, read our step-by-step instruction which will help you create s3 account and connect it to Cloudberry S3 Explorer.
Sign-up for Amazon S3 account
Download Free Cloudberry S3 Explorer
Get started.
After you get equipped with Amazon S3 account connected to Cloudberry S3 Explorer, you are ready to start. Just launch S3 Explorer and create a new bucket in the right hand part of the S3 file manager. Insure that the bucket you created has exactly the same name as your website. For instance, if you want to host http://www.mybrandnewsite.com, the bucket must have ‘mybrandnewsite.com’ name.
Now upload all your website pages with images, CSS and other files to the bucket, you’ve just created. You can do that by dragging & dropping files and folders from the left side pane to the right side or by selecting all files you want to copy and pressing F5.
Make S3 bucket public.
When you have all your webpages in the bucket you need to make it public. In other words, you need to allow any Internet user to access information stored in the bucket. There are two ways you can do that. The first one is ACL and the second is Bucket Policy. To open access to your bucket with ACL settings, you need to select your bucket and then click on “ACL Settings” button in the tool panel just above the list of buckets.
You will see the dialog box where you must choose “Public (everyone)” option and check the box “Apply for all subfolders and files”.
If you prefer Bucket Policy to grant read access to the bucket and all files and folders inside it, you must select the bucket and click on “Bucket Policy” button located on the toolbar. The advantage of using Bucket Policies is that it applies to all new files in the bucket automatically. It’s recommended to use only one of two options, either ACL settings or Bucket policy.
After you will click the “Bucket Policy” button you will see the dialog where you need to choose “Policy Script” folder and paste the script below:
{
"Version":"2008-10-17",
"Id":"http referer policy example",
"Statement":[
{
"Sid":"Allow get requests referred by www.mybrandnewsite.com, mybrandnewsite.com and IP address",
"Effect":"Allow",
"Principal":"*",
"Action":"s3:GetObject",
"Resource":"arn:aws:s3:::mybucket/*",
"Condition":{
"StringLike":{
"aws:Referer":[
"http://www.mybrandnewsite.com/*",
"http://mybrandnewsite.com/*",
"http://***.***.***.***/*"
]
}
}
}
]
}
IMPORTANT! You need to put your bucket name as well as website address and IP address instead of lines marked with red. The most important is that you insert your site addresses in aws:Referer element and your bucket name in resource element.
Prevent hotlinking.
Using of Bucket Policy will give you one more benefit. The following clause takes care of preventing hotlinking. Just replace the URLs and IP address with the ones related to your website:
"Condition":{
"StringLike":{
"aws:Referer":[
"http://www.mybrandnewsite.com/*",
"http://mybrandnewsite.com/*",
"http://***.***.***.***/*"
Turn your bucket into a website.
The last thing you should do is enable website function for the bucket. To do this, right click on your bucket and choose “Website”. You will see the dialog box in which you should put mark on “Turn on Website” and enter page names for index.html and error.html documents.
Now your S3 bucket can be accessed as the website by typing in web browser URL that was automatically generated. In my case it looks like http://mybrandnewsite.com.s3-website-us-west-1.amazonaws.com/. Here is how the URL is formed http://<bucketname>.s3-website-<region-endpoint>.amazonaws.com.
You need to put your bucket name instead of <backetname> and a region endpoint instead of <region-endpoint>. If you don’t know the region you can find it in the bucket properties in Cloudberry Explorer. Right click on the bucket and choose “Properties”. Region of you bucket location is the second line of the list.
Then check what address you need in the box below and you will get the generated web URL of your bucket. Don’t forget to check if the URL you’ve compiled is actually working. Just paste it in your browser and if your website appears, everything is fine, if not try to make the URL once more.
| The regions and their endpoints: US Standard : s3-website-us-east-1.amazonaws.com US West (Northern California) : s3-website-us-west-1.amazonaws.com EU (Ireland) : s3-website-eu-west-1.amazonaws.com Singapore ( Asia Pacific ) : s3-website-ap-southeast-1.amazonaws.com Tokyo ( Asia Pacific ) : s3-website-ap-northeast-1.amazonaws.com |
Map S3 bucket to your domain.
The last step is to get rid of the ugly URL generated by Amazon and map your S3 bucket to the domain you want Internet users find your website at. It is also quite easy to do. All you have to do is to configure appropriate CNAME in your hosting provider control panel. All hosting provider offers a way to create CNAMEs and you will just have to find out the details. To create a CNAME record you will have to specify an alias which is URL Amazon S3 generated for your bucket.
You will probably have to wait for a while before the changes will affect.
+++
As always we would be happy to hear your feedback and you are welcome to post a comment.
CloudBerry S3 Explorer is a Windows freeware product that helps managing Amazon S3 storage and CloudFront . You can download it at http://www.cloudberrylab.com/free
CloudBerry S3 Explorer PRO is a Windows program that helps managing Amazon S3 storage and CloudFront . You can download it at http://www.cloudberrylab.com/pro It is priced at $39.99
Like our products? Please help us spread the word about them. Learn here how to do it.
Want to get CloudBerry Explorer PRO for FREE? Make a blog post about us!
Posts
