VideoJS Chromecast Plugin by Nuevodevel works fine with browsers that support Chromecast (desktop Chrome, Edge, Opera, Chrome on Android). Chromecast plugin also works on the desktop Edge Chromium browser if you enable a specific Edge extension "Load Media Router". The plugin automatically detects Chromecast support and displays Cast Button in the top right corner of the player. If you have Chromecast device connected to your TV you can test demo video above.
See example of the video.js player, with Nuevo plugin and Chromecast plugin setup code.
// Load player skin CSS, best in <head> section: <link href="//www.domain.com/videojs/skins/nuevo/videojs.min.css" rel="stylesheet"> // Load necessary scripts: <script src="https://www.gstatic.com/cv/js/sender/v1/cast_sender.js?loadCastFramework=1"></script> <script src="//domain.com/videojs/video.min.js"></script> <script src="//domain.com/videojs/nuevo.min.js"> <script src="//domain.com/videojs/plugins/videojs-chromecast.min.js"></script> // Setup your video <video id="player_one" class="video-js" controls preload="auto" playsinline width="640" height="360" poster="//www.domain.com/path/to/poster.jpg"> <source src="//www.domain.com/path/to/video.mp4" type="video/mp4" /> <source src="//www.domain.com/path/to/video.webm" type="video/webm" /> </video> // Initialize player and plugins <script> var options = {option1:'option', option2:'option2'}; // Nuevo plugin options var player = videojs('player_one'); player.nuevo (options); player.chromecast(); </script>
var player = videojs('player_one',{techOrder:['chromecast','html5']});
player.chromecast({ metatitle: 'video title', metasubtitle: 'video subtitle' });
player.chromecast({ button:'controlbar' });
player.on('chromecastConnected', function() { console.log('connected'); }); player.on('chromecastDisconnected', function() { console.log('disconnected'); });