{"id":6420,"date":"2021-05-18T18:13:21","date_gmt":"2021-05-18T12:43:21","guid":{"rendered":"https:\/\/www.skynats.com\/?p=6420"},"modified":"2025-04-10T16:16:39","modified_gmt":"2025-04-10T10:46:39","slug":"how-to-host-static-website-in-aws-s3","status":"publish","type":"post","link":"https:\/\/www.skynats.com\/blog\/how-to-host-static-website-in-aws-s3\/","title":{"rendered":"How to Host Static Website in AWS S3"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">Amazon Simple Storage Service (Amazon S3) is an object storage service that offers industry-leading scalability, data availability, security, and performance. Here you will learn how to host a static website in aws s3.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">On our <a href=\"https:\/\/www.skynats.com\/aws-management\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span style=\"color:#036e9b\" class=\"has-inline-color\">AWS management <\/span><\/a><span class=\"has-inline-color has-primary-color\">plan<\/span>, our team will configure AWS S3 to host your html website and can make it live under your domain. AWS team will be available 24\/7 for any support services.<\/p>\n\n\n\n<h2 class=\"wp-block-heading has-small-font-size\" id=\"h-1-create-an-s3-bucket-named-www-example-com\"><strong>1. Create an S3 Bucket named www.example.com<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Sign in to the AWS Management Console and open the Amazon S3 console<\/li>\n\n\n\n<li>Select the Create bucket option.<\/li>\n\n\n\n<li>Fill in the Bucket&#8217;s name (www.example.com).<\/li>\n\n\n\n<li>Select the Region where the bucket will be created.<\/li>\n\n\n\n<li>Choose Build to accept the default settings and create the bucket.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading has-small-font-size\" id=\"h-2-configure-s3-bucket-for-static-hosting\"><strong>2. Configure S3 Bucket for Static hosting<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Sign in to the AWS Management Console and open the Amazon S3 console<\/li>\n\n\n\n<li>Select the bucket with name as www.example.com<\/li>\n\n\n\n<li>Choose Properties<\/li>\n\n\n\n<li>Under\u00a0Static website hosting, choose\u00a0Edit<\/li>\n\n\n\n<li>Choose\u00a0Use this bucket to host a website.<\/li>\n\n\n\n<li>Under\u00a0Static website hosting, choose\u00a0Enable.<\/li>\n\n\n\n<li>Enter the index document&#8217;s file name, which is usually index.html, in Index document.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Your bucket is set up to host static websites, and you now have an S3 website url that looks like this<br>http:\/\/www.example.com.s3-website-us-east-1.amazonaws.com\/<\/p>\n\n\n\n<h3 class=\"wp-block-heading has-small-font-size\" id=\"h-3-grant-public-access-to-the-bucket\"><strong>3. Grant Public Access to the Bucket<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Since your bucket hosts your static website, it must be available from anywhere on the planet. This is referred to as &#8220;anonymous bucket control.&#8221; Before adding your bucket policy, you must first complete the steps below to enable public access.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Select your bucket<\/li>\n\n\n\n<li>Select the \u201cPermissions\u201d tab at the top.<\/li>\n\n\n\n<li>Under Block public access (bucket settings), choose Edit.<\/li>\n\n\n\n<li>Clear Block all public access, and choose Save changes.<\/li>\n<\/ul>\n\n\n\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"799\" height=\"433\" src=\"https:\/\/www.skynats.com\/blog\/wp-content\/uploads\/2021\/05\/Screenshot-2021-05-18-at-4.49.54-PM.png\" alt=\"Host Static Website in AWS S3\" class=\"wp-image-6423\" srcset=\"https:\/\/www.skynats.com\/blog\/wp-content\/uploads\/2021\/05\/Screenshot-2021-05-18-at-4.49.54-PM.png 799w, https:\/\/www.skynats.com\/blog\/wp-content\/uploads\/2021\/05\/Screenshot-2021-05-18-at-4.49.54-PM-300x163.png 300w, https:\/\/www.skynats.com\/blog\/wp-content\/uploads\/2021\/05\/Screenshot-2021-05-18-at-4.49.54-PM-768x416.png 768w\" sizes=\"(max-width: 799px) 100vw, 799px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">Your bucket&#8217;s Block Public Access settings are turned off by Amazon S3. Before implementing a bucket policy, you can need to edit your account&#8217;s Block Public Access settings to build a public, static website. You&#8217;ll see a warning under Block public access if your account settings for Block Public Access are currently switched on (bucket settings).<\/p>\n\n\n\n<h3 class=\"wp-block-heading has-small-font-size\" id=\"h-4-configure-bucket-policy\"><strong>4. Configure Bucket Policy<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Choose a name for your bucket under Buckets<\/li>\n\n\n\n<li>Select Permissions.<\/li>\n\n\n\n<li>Select Edit from the Bucket Policy drop-down menu.<\/li>\n\n\n\n<li>Copy and paste the following bucket policy into the Bucket policy editor to grant public read access to your website and click Save Changes.<\/li>\n<\/ul>\n\n\n\n<pre class=\"wp-block-code\"><code>{\n    \"Version\": \"2012-10-17\",\n    \"Statement\": &#91;\n        {\n            \"Sid\": \"PublicReadGetObject\",\n            \"Effect\": \"Allow\",\n            \"Principal\": \"*\",\n            \"Action\": &#91;\n                \"s3:GetObject\"\n            ],\n            \"Resource\": &#91;\n                \"arn:aws:s3:::www.example.com\/*\"\n            ]\n        }\n    ]\n}<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading has-small-font-size\" id=\"h-5-configure-your-domain-to-point-to-aws-s3-bucket\"><strong>5. Configure your domain to point to AWS S3 Bucket<\/strong><\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Now, you have a bucket set up for the hosting of static websites. It has an S3 url for its website. The S3 URL can be obtained from Bucket &gt;&gt; Properties &gt;&gt; under&nbsp;Static website hosting, choose your&nbsp;Bucket website endpoint. <\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You have a bucket set up for the hosting of static websites. It has an S3 url for its website. You must have routing from your domain name&nbsp;www.example.com to your S3 website url www.example.com.s3-website-us-east-1.amazonaws.com in order for a user to access your S3 website. You must set CNAME record for the domain to S3 Endpoint URL on your DNS Server.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Login to your DNS registrar<\/li>\n\n\n\n<li>Create a CNAME Record for WWW of the domain example.com.<\/li>\n\n\n\n<li>The CNAME value should be your s3 Endpoint.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">Once the DNS is propagated, you can access your website using the URL https:\/\/www.example.com on your browser. To host static website in AWS S3, simply upload your HTML files to the bucket\u2014your site will be live instantly. Need help? Our AWS experts are ready to assist!&#8221;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Amazon Simple Storage Service (Amazon S3) is an object storage service that offers industry-leading scalability, data availability, security, and performance. Here you will learn how to host a static website in aws s3. On our AWS management plan, our team will configure AWS S3 to host your html website and can make it live under [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[352,355,354,353],"class_list":["post-6420","post","type-post","status-publish","format-standard","hentry","category-blog","tag-aws-s3","tag-aws-s3-support","tag-host-website-in-aws","tag-host-website-in-s3"],"_links":{"self":[{"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/posts\/6420","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/comments?post=6420"}],"version-history":[{"count":1,"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/posts\/6420\/revisions"}],"predecessor-version":[{"id":14716,"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/posts\/6420\/revisions\/14716"}],"wp:attachment":[{"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/media?parent=6420"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/categories?post=6420"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.skynats.com\/blog\/wp-json\/wp\/v2\/tags?post=6420"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}