Google's Chromecast[a] is pretty cool. To get your own videos to play on it you can, for example, upload them to YouTube and use the "cast" button in the YouTube app - and it's really satisfying to see your own video on a big screen. But what if you want to cast video from your own website?
Then you need to serve the video in the right format, with the right HTTP headers. Both requirements change over time as the HTTP standard and Chromecast evolves, but here are the known good settings as of right now.
1. Format
The video should conform to the HTTP live streaming standard[b]. While the Chromecast supports many video formats, this is the format it appears to prefer.
2. HTTP Headers
The M3U8
playlists and the TS
segments must have proper CORS headers. These are known-good headers for the M3U8
file (with the Content-Length
and associated headers of course being altered as needed):
Access-Control-Allow-Methods: GET, OPTIONS
Access-Control-Allow-Origin: *
Connection: close
Content-Length: 844
Content-Range: bytes bytes 0-843/844
Content-Type: application/vnd.apple.mpegurl
These are known-good headers for the TS
files:
Access-Control-Allow-Methods: GET, OPTIONS
Access-Control-Allow-Origin: *
Connection: close
Content-Length: 3286804
Content-Range: bytes 0-3286803/3286804
Content-Type: video/mp2t
2.1. Configuring .htaccess
If you are using Apache[c] to serve the files, add this to the .htaccess
file:
<FilesMatch "\.(m3u8|ts)$">
Header set Access-Control-Allow-Origin "*"
Header set Access-Control-Allow-Methods "GET, OPTIONS"
</FilesMatch>