CODEWITHSUNDEEP
htmlstreamingvideo.js
leozera
leozera

Reputation: 159

Streaming m3u8 with video.js

I'm trying stream this url: http://stream331.overseebrasil.com.br/live_previd_155/definst/live_previd_155/playlist.m3u8

<audio id="streaming" class="video-js vjs-default-skin" controls>
  <source src="http://stream331.overseebrasil.com.br/live_previd_155/_definst_/live_previd_155/playlist.m3u8" type='audio/mp4; codecs=mp4a.40.2' />
</audio>

Safari / Mac and Safari / iOS works fine, but the code doesn't run in Chrome and Firefox.

I tried remove codec's info from type attribute and nothing happens. Firefox says:

Specified "type" attribute of "audio/mp4; codecs=mp4a.40.2" is not supported. Load of media resource http://stream331.overseebrasil.com.br/live_previd_155/_definst_/live_previd_155/playlist.m3u8 failed. 
All candidate resources failed to load. Media load paused.

I also tried change the type attribute based on mime page (http://www.videojs.com/projects/mimes.html) Any idea about the issue?

Upvotes: 1

Views: 22280

Answers (1)

Matt McClure
Matt McClure

Reputation: 2136

Cross-browser HLS support is being worked on in a separate plugin, contrib-hls. It's working in Safari because the browser natively supports HLS playback, but none of the others because the Video.js fallback doesn't.

Trying out the plugin is pretty straight forward, but if you're using the CDN version of Video.js you'll need to upload the contrib-hls include somewhere.

<script src="/path/to/video.js"></script>
<script src="/path/to/videojs-hls.min.js"></script>
<script>
  var player = videojs('video');
  player.hls('http://example.com/video.m3u8');
</script>

Then you can then treat the player as usual, with player.play(), etc.

Upvotes: 5

Related Questions