Chromecast Plugin
Basic Code Setup
<link href="../videojs/skins/nuevo/videojs.min.css" rel="stylesheet" type="text/css" />
<script src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script>
<script src="../videojs/video.min.js"></script>
<script src="../videojs/nuevo.min.js"></script>
<script src="../videojs/plugins/videojs-chromecast.min.js"></script>
<video id="player_one " class="video-js vjs-fluid vjs-default-skin" controls preload playsinline poster="images/poster.jpg">
<source src="//opencdn.b-cdn.net/video/demo_720.mp4" type="video/mp4">
<source src="//opencdn.b-cdn.net/video/demo_720.webm" type="video/webm">
</video>
<script>
var player = videojs('player_1 )';
player.nuevo({
//option_name: option_value, option_name: value
});
player.chromecast({ metatitle:"Video title", metasubtitle:"Video subtitle" });
</script>
Optionally you can display Chromecast icon in controlbar right before fullscreen button instead of larger icon in top-left corner.
player.chromecast({ button:"controlbar", metatitle:"Video title", metasubtitle:"Video subtitle" });
Requirements and limitations:
Google does not support non-secure origins (HTTP) with Chromecast.
Media file URL must be absolute path with http or https protocol.
Check video formats supported by Chromecast on https://developers.google.com/cast/docs/media .
For adaptive media streaming, Google Cast requires the presence of CORS headers, but even simple mp4 media streams require CORS if they include Tracks. Read more on https://developers.google.com/cast/docs/chrome_sender/advanced#cors_requirements . CORS headers is also required if media files are located on other than production server.