Chromecast对HLS的支持，Amazon S3上的CORS错误

Question

I am trying to integrate HLS streams in my chromecast app.

The receiver part is fine because i checked it with multiple HLS Stream urls.

i just cant get the CORS bit to operate correctly.

I am using Amazon AWS S3. I have set the CORS for my bucket.

<?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>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

in my assumption this should allow access from all domains to access the resources inside this bucket.

But still i am getting the following error in javascript from Chromecast.

XMLHttpRequest cannot load http://s3-eu-west-1.amazonaws.com/interactive-encoding-out/watermark-sintel-test/playlist.m3u8. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://s3-eu-west-1.amazonaws.com' is therefore not allowed access. 

Answer 1

Try this https://github.com/TOMODOcom/TOMODOkorz . It works for me.

TOMODOkorz allows you to make cross-origin requests to any domain. It will remove any cross-origin restrictions from your site once you add it to your site. Allows easy Cross-origin resource sharing

Answer 2

Based on http://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html , your example looks a bit more complex than nescessary.

<CORSConfiguration>
 <CORSRule>
   <AllowedOrigin>*</AllowedOrigin>
   <AllowedMethod>GET</AllowedMethod>
 </CORSRule>
</CORSConfiguration>

Is probably all that you need. That said, do you own the bucket interactive-encoding-out ? That might be the issue. You might need to copy the segments to your own bucket where you can set this header before it will work.

Answer 3

Right now i have used corsproxy as a reversed proxy that adds cors headers to my request. Really recommand this solution. No need for a custom receiver app this way. just install the corsproxy somewhere on your server

run the cors proxy:

$ corsproxy <SERVER_IP> <DESIRED_PORT>

and run the request like :

http://<SERVER_IP>:<DESIRED_PORT>/<YOUR REQUEST>

install from: https://www.npmjs.org/package/corsproxy