I am trying to use a combination of CloudFlare and AWS S3 service to host a static website. My issue is that I have an "index.html" file and navigating to the S3 URL directly:
http://srdan.nz.s3-website-ap-southeast-2.amazonaws.com
it loads the "index.html" file (note, no mention of "index.html" in the URL).
However, if I go to the custom domain URL:
http://srdan.nz
It returns an S3 XML listing of the bucket contents:
<ListBucketResult xmlns="http://s3.amazonaws.com/doc/2006-03-01/"><Name>srdan.nz</Name><Prefix></Prefix><Marker></Marker><MaxKeys>1000</MaxKeys><IsTruncated>false</IsTruncated><Contents><Key>index.html</Key><LastModified>2018-10-09T01:10:39.000Z</LastModified><ETag>"f51109004d6b0518fad4c2f69d950a45"</ETag><Size>133</Size><StorageClass>STANDARD</StorageClass></Contents></ListBucketResult>
instead of the contents of "index.html".
Does anyone know why this is the case? How do I configure Cloudflare/S3 to make the "index.html" file the "default" thing to return if someone just enters the URL?
I've got a workaround where I add a custom "Page Rule" to Cloudflare to redirect "http://srdan.nz/" to "http://srdan.nz/index.html" however, I'd strongly prefer if it would just return the contents of "index.html" directly.
The answer to this is as #Michael mentioned in the comments of the question, but I thought it deserved a writeup...
Take the example domain mybucket.com that we'd like to use to serve the contents of our s3 bucket from via Cloudflare.
Whilst the following URL is valid for just accessing the contents of the S3 bucket mybucket.com.s3.amazonaws.com it's no good for referencing in our Cloudflare CNAME DNS record.
I think that one of the main problems is that the Cloudflare documentation doesn't show the correct static website endpoint as stated in the AWS S3 documentation for serving a static website from s3.
You might find that if you use the incorrect end point in your Cloudflare DNS, your domain will return something like the following response at the root instead of your default document as setup in the bucket settings:
ANSWER: Use the static website endpoint
Ensure that the CNAME record that you set up uses the -website- equivalent endpoint:
mybucket.com.s3-website-us-west-2.amazonaws.com
The correct format is <BUCKET NAME>.s3-website-<AWS REGION>.amazonaws.com, but it can be found in the settings for your s3 bucket:
Don't use the others, incorrect ones include
mybucket.com.s3.amazonaws.com
mybucket.com.s3-us-west-2.amazonaws.com
NB: You'll need to set SSL in Cloudflare to 'Flexible' because 'Full' and 'Full(strict)' do not work.
Related
I have the following setup:
S3 bucket where Website hosting is enabled, "block all access" default feature is disabled. In the bucket I have an index.html file a css and a js folder with some files. I referencing them in the HTML code like <link rel="stylesheet" href="index_files/style.css"> and <script src="js/somejsfile.js"></script>. I haven't made any of the objects public directly. The bucket name is mydomain.com (I also have a www.mydomain.com and s0ubqconfigured as website enabled resdirecting everything to mydomain.com bucket)
I have a single certificate with all the cname included (naked, www, sub1). Certificate is validated using Route53
I have created a Cloudfront distribution.
Origin Domain Name points to mydomain.com.s3.amazonaws.com
Origin Path was left empty
Restrict Bucket Access: yes
Created new Identity
Allowed Cloudfront to Update bucket policy (I verified later that the policy indeed was modified)
Alternate Domain Names: listed all 3 domains
Custom SSL certificate --> used the previously created cert
default root object: index.html
redirect HTTP to HTTPS
everything else is default
Route 53 alias for the cloudformation dns entry.
The problem:
The site seems completely broken both on mydomain.com and the cloudformation url. After checking the page source in Firefox it turnes out that somehow all the CSS and JS reference got overwritten like href="index_files/some-css-file.css" and src="index_files/some-js-file.js". I have no clue where this index_files comes from. I have double checked on S3, downloaded my index.html and the code does not have this index_files nonsense.
I used Firefox Web Developer tool to overwrite temporarly index_files to css and js and the sites load as it should be...
What am I missing? And where this index_files stuff comes from? My google-fu fails me on this one.
Edit/Update:
I used the AWS Console to configure everything so no terraform or cloudformation or even aws cli is involved. (this was supposed to be a fast PoC)
The content in S3 was copied there using S3 sync. Original content comes from a website which I httrack-ed (basically downloaded all the static content of the site)
BTW today I have checked the site again and it is working. No clue why. My modifications:
I have added new origins to the distribution using same settings but with the www and the sub1 S3 buckets as soruce (so now the distributiuon has 3 origin). I don't know why would this fix it, since those S3 buckets are empty and I was always testing the site using the naked mydomain.com.
I have added a CORS rule to the bucket to allow "*" and all GET methods. But since all the files in the same naked domain s3 bucket I don't know why whould this fix the issue.
So the usual meme:
my stuff is not working... Why?
my stiff is working... But why?
Before you read the rest I am an absolute beginner at deploying website and the end goal would be:
My website I want to load is
site.s3-website.us-east-2.amazonaws.com
and I want all the content to be put on
mydomain.com
So when you visit mydomain.com you see see all the content that is supposed to be on the AWS S3 Site.
I have followed many articles and posts, however I don't seem to be getting the expected results or they seem to be outdated.
The best way is to migrate to route 53.
However, you can set up a redirect or simply set up an CNAME record that resolves to S3 Static website URL.
The last step is to Forward domain to your naked domain name "example.com" to "www.example.com
NOTE: You could just Forward to your bucket using the complete bucket URL with "name masking", however most web crawlers will not see your complete site if you do it that way and web searches will fail.
Hope this helps!
The S3 bucket name must be the same as the domain name, so your bucket should be called mydomain.com. Then just add a cname in your DNS to resolve to mydomain.com.s3-website.us-east-2.amazonaws.com
I have a simple, static webpage hosted in a AWS S3 bucket. S3 buckets do not support htaccess, as this is apparently an Apache feature.
I would like to redirect all www.example.com/index.html to simply www.example.com. Is there a way I can do this from my DNS management, or some other way I don't know about?
Thanks.
You can do this by enabling Static Web Site hosting feature in your S3 bucket properties. index.html is the default index document at the moment, so it will just work out of the box for you.
See http://docs.aws.amazon.com/AmazonS3/latest/dev/IndexDocumentSupport.html for more detail.
Enabling Websitehosting for your S3 Bucket will do the trick. Doing so allows you to specify an index an error document.
see http://docs.aws.amazon.com/AmazonS3/latest/dev/HowDoIWebsiteConfiguration.html
Using AWS how would I go about changing a url like so: "www.mywebsite.com/path/data" to another website?
I managed to do a url redirect with my domain "www.mwebsite.com" but having issue with the path part.
Thanks.
The AWS support pointed a simpler solution. It's basically the same idea proposed by #Vivek M. Chawla, with a more simple implementation.
AWS S3:
Create a Bucket named with your full domain, like aws.example.com
On the bucket properties, select Redirect all requests to another host name and enter your URL:
https://myaccount.signin.aws.amazon.com/console/
AWS Route53:
Create a record set type A. Change Alias to Yes. Click on Alias
Target field and select the S3 bucket you created in the previous
step.
Reference: How to redirect domains using Amazon Web Services
This should be easy as there is no shortage of pages on custom domains and S3 but for some reason I can't seem to get it to work as expected.
I have a S3 Bucket full of videos. The S3 bucket is called for example "videos.foo.com". I bought the domain "videos.foo.com" and set it up in cloudflare with the cname "videos.foo.com" pointing to "videos.foo.com.s3-website-us-east-1.amazonaws.com".
I can view files in my bucket by going to there full url such as "videos.foo.com.s3-website-us-east-1.amazonaws.com/myvideo.mpg".
My problem is I can't view them by going to "videos.foo.com/myvideo.mpg".
I tried enabling "Redirect all requests to another host name" and entering "videos.foo.com" but that didn't work either. To note, I will 'not' be hosting a site at "videos.foo.com" just serving files.
All the files have permissions everyone: open/download.
If anything sees the error in my ways please let me know. In the mean time I'll keep searching and going through trial and error. Thanks!
Nginx S3 proxy helps to solve that problem, please check more details: https://stackoverflow.com/a/44749584/290338
A bucket can be named differently, the only performance rule is to have EC2 and a bucket in the same geo location.
You may need to configure the Route 53 record as an alias rather than a cname. In R53, edit your record set and configure it like this -
Type: A - IPv4 address
Alias: Yes
When you click in the Alias Target textbox it will drop down a list that contains your S3 bucket (if it's properly configured). It can take a while to load that list so be patient. Select your bucket and hit save.
Check out this document for more info - http://docs.aws.amazon.com/AmazonS3/latest/dev/website-hosting-custom-domain-walkthrough.html