I read many answers to this question but for some reason neither of them works for me. I have static website served by S3 with static website feature enabled and index document set to index.html. And there is CloudFront distribution pointing to that static S3 website. In my bucket I have following files, each of them with public access:
file1.html
file2 (with Content-Type: text/html metadata)
file3/index.html
I tried visiting following pages:
https://example.com/file1.html => works
https://example.com/file2 => 404
https://example.com/file3 => 404
https://example.com/file3/index.html => works
404 response returns this:
<Error>
<Code>NoSuchKey</Code>
<Message>The specified key does not exist.</Message>
<Key>index.html</Key>
<RequestId>02KPT6454CMB1D5M0</RequestId>
<HostId>pxZgtslx4ddbSh645ZiYxlLWEg6xxGLjxlwZNO+JzjFb4eu1/kp4SYZoMFXZO7muXtZ/iJZ9g=</HostId>
</Error>
I am struggling with this for several hours and can't make it work. From what I read I should either upload (or rename through S3 console) file without extension and add Content-Type: text/html metadata to it or I should create folder named like a file without extension and put file named index.html inside. Neither of those options works.
I am accessing a markdown file in S3 from a REST API call to AWS API gateway. I have CORS enabled on my endpoint resource and on my S3 bucket as follows:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>http://localhost:4200</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
I am still getting:
Access to XMLHttpRequest at 'https://xxxxx/page1.md' from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
I have the chrome Moesif CORS extension and everything works if its on. What else can I check?
BTW, whats weird is - everything works fine in FireFox - it appears to just be a chrome thing.
Chrome does not like localhost + CORS :)
Have a look at this SO answer.
Hope that resolves your question.
I am trying to set up HLS streaming of video files using S3 and Cloudfront. The issue I am having is that the HLS video works when I use the direct S3 link for the manifest file but does not work when I use the Cloudfront link for the file. In the later case, I get a CORS error. The CORS policy on my Bucket is set to:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>POST</AllowedMethod>
<AllowedMethod>DELETE</AllowedMethod>
<AllowedMethod>HEAD</AllowedMethod>
<MaxAgeSeconds>86400</MaxAgeSeconds>
<ExposeHeader>Authorization</ExposeHeader>
<ExposeHeader>Content-Type</ExposeHeader>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>
I also have the following crossdomain.xml in my root directory and the root folder where all the hls videos are stored.
<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
<allow-access-from domain="*" />
</cross-domain-policy>
I have gone through dozens of tutorials, they all say I simply need to set up a web distribution for my bucket and the bucket policy and CORS policy set for the bucket should work.
I have the following permissions on my bucket.
Is there something I'm missing out in my Cloudfront setup ? I left all the values as default apart from the origin(which I set to my bucket).
S3 Link: http://s3.ap-south-1.amazonaws.com/tjb-video-data/vod-data/1472453572-11/hls/master.m3u8
CloudFront link: http://d1932r1vgq7q7.cloudfront.net/vod-data/1472453572-11/hls/master.m3u8
(I have tried with http and https)
I'm using s3 with cloudfront. I have an application that has two index files.
/index
/admin/index
The /index works fine the /admin/index requires me to put /admin/index.html without including index.html it throws
<Error>
<Code>AccessDenied</Code>
<Message>Access Denied</Message>
<RequestId>D989FEFADF688159</RequestId>
<HostId>
GvoytrXvDOLPu26AiYYaq6Zi4ck42xyZy3mdxlSF8q5AZc4WEphayr5o6WVDxNM7+qutIAfn53k=
</HostId>
</Error>
I checked the permissions on the file they are correctly set. Additionally I can view the file when using the full url /admin/index.html.
Is this expected behavior or something wrong with my configuration of s3 / cloudfront.
I think cloudfront is the issue. It appears you can't have multiple index files when using cloud front. http://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/DefaultRootObject.html
I ended up adding the index.html to the route to make it work.
How can I set the S3 CORS AllowedOrigin configuration such that it dynamically echos the requesting domain in the Access-Control-Allow-Origin header?
In the post, "CORS with CloudFront, S3, and Multiple Domains", it is suggested that setting AllowedOrigin to <AllowedOrigin>*</AllowedOrigin> does this. However, S3 returns Access-Control-Allow-Origin: * instead.
Access-Control-Allow-Origin: * does not work in my case as I am using image.crossOrigin = "use-credentials" in a JavaScript app. With this option, S3 returns Access-Control-Allow-Credentials: true. Cross origin access to the image then fails because using wildcard as the allowed origin in conjunction with credentials is not permitted.
Background for why this is needed:
In my setup, access to images on S3 has to go through our domain, where authentication is required to restrict access and check if an account is authorized to access the images. If it is, the server returns a 302 redirect to an S3 URL.
For the authentication to work, image.crossOrigin = "use-credentials" has to be set so that the request hits my server with the required credentials. (Incidentally, when I tested on Firefox 30.0 and Chrome 35.0.1916.153, if crossOrigin is set to anonymous, credentials are still sent. But not on Safari 7.0.4. Consistent cross-browser behavior could only be obtained using use-credentials.).
Because browsers transparently redirects to the S3 URL, credentials are also sent.
AWS's CORS documentation does not document this, but I managed to get the answer in a thread on AWS Developer Forums, where I found that AWS changed the original behavior of echoing the requesting domain if * is being used for AllowedOrigin.
To get S3 to dynamically echo the requesting domain, AllowedOrigin has to be set as such:
<AllowedOrigin>http://*</AllowedOrigin>
<AllowedOrigin>https://*</AllowedOrigin>
For me it seemed to be some kind of caching issue (even though I was not using cloudfront, only S3). Appending a random parameter to the URL fixed the issue for me, e.g.
https://s3-amazon.com/bucket/file.jpg?d=3243253456346
I also had the following CORS settings in S3:
<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
<AllowedOrigin>http://*</AllowedOrigin>
<AllowedOrigin>https://*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
<MaxAgeSeconds>3000</MaxAgeSeconds>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>