Casting JW Player Video from Amazon S3 in Chrome for Android

[GoogleCodeExporter]

Summary of the problem: The native cast button for HTML5 video on Chrome for 
Android does not work for an HLS video (m3u8) hosted on Amazon S3. I have 
narrowed this down to a problem with CORS on S3, but I can't seem to find the 
right configuration.

What steps will reproduce the problem?
1. Visit this page on Chrome for Android: 
http://ec2-52-33-198-95.us-west-2.compute.amazonaws.com/
2. Play the first video and use the native cast button to cast the video. This 
player is configured to play an HLS file.
3. Play the second video and use the native cast button to cast the video. This 
player is configured to play an MP4 file.

What is the expected output? What do you see instead?
I expect both players to be able to cast the videos. The player with the MP4 
video casts fine. However, the player with the HLS (m3u8) video doesn't cast - 
I get an error with this message: "Unable to cast video due to site 
restrictions".

What version of the product are you using? On what operating system?
Here are some combinations that I've tested with (all with the latest version 
of Chrome - 47.0.2526.83)

Device: Samsung Galaxy S3
Android version: 4.1.2
-----------------------------
Device: Samsung Tab S2
Android version: 5.1.1
-----------------------------
Device: Moto X
Android version: 5.1.0

Please provide any additional information below.
- The video player is JW Player v7.2.2.
- Interestingly, JW Player has a demo (found here: 
http://www.jwplayer.com/products/jwplayer/) that plays an m3u8 video and is 
castable.
- Both m3u8 and mp4 files are hosted on Amazon S3 and distributed via Amazon 
CloudFront.
- I've whitelisted the following headers for the CloudFront distribution (which 
means they should be forwarded to S3):
  Access Control Request Headers
  Access Control Request Method
  Origin
- Here is my CORS setup on the relevant Amazon S3 bucket (note that I have 
tried many combinations here, but this is my latest iteration):
    <CORSRule>
        <AllowedOrigin>*</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>HEAD</AllowedMethod>
        <ExposeHeader>Content-Type</ExposeHeader>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>

Original issue reported on code.google.com by alenchi...@gmail.com on 13 Dec 2015 at 11:58

[GoogleCodeExporter]

The HLS (m3u8) stream is not playable on the browser itself. "Cannot load m3u8. 
Crossdomain access deny". 
This is clearly not an issue with Cast SDK. You need to implement CORS properly 
to access this stream which is subjective of the origin of this stream.  Please 
read more about CORS with HTML5 here: 
http://www.html5rocks.com/en/tutorials/cors/. 

Also, please note that it is recommended to not use permissive "*" header for 
AllowedOrigin in production. Replace this with the URL of your receiver. 

Original comment by na...@google.com on 16 Dec 2015 at 12:51

• Changed state: NotSDK

[GoogleCodeExporter]

Thank you for sharing that document. I also found this page to be very helpful:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

The official Media Player documentation 
(https://developers.google.com/cast/docs/player) states the following:

"Most modern browsers fully support CORS. iOS and Android devices access the 
content at a lower level and do not look at these headers. This is often the 
first issue that comes up when a developer wishes to use streaming content."

That description seems to indicate that there is a special way to handle the 
casting of HLS content from Chrome running on an Android device. What is the 
recommended way of resolving this issue?

Thanks again for any help that you can provide!

Original comment by alenchi...@gmail.com on 20 Dec 2015 at 5:46