Objective
Learn how to play HLS video streams in IE11 and later versions.
VIDEOJS 7.4.2: HLS + Flash fallback
videojs is an open sources javascript media player.
<!DOCTYPE html>
<html>
<head>
<title>Videojs 7 + HLS flash fallback</title>
<meta charset="utf-8">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/video.js/7.4.2/video-js.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/video.js/7.4.2/video.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/videojs-flash/2.1.2/videojs-flash.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/[email protected]/dist/videojs-flashls-source-handler.min.js"></script>
</head>
<body>
<video class="video-js vjs-default-skin" id="video-container" controls>
<source src="//184.72.239.149/vod/smil:BigBuckBunny.smil/playlist.m3u8" type="application/x-mpegURL">
</video>
</body>
<script>
var options = {
flash: {
swf: '//cdnjs.cloudflare.com/ajax/libs/videojs-swf/5.4.2/video-js.swf'
},
fluid: true
};
var player = videojs('video-container', options);
</script>
</html>
If you encounter the FLASHLS_ERR_CROSS_DOMAIN error, you may need to create a crossdomain.xml file for your domain.
**More info
https://github.com/videojs/videojs-flash/issues/96
https://stackoverflow.com/questions/213251/can-someone-post-a-well-formed-crossdomain-xml-sample
Caution : if you decide to use the crossdomain.xml file, you have to consider security.
Compatibility
Microsoft Windows
| OS | Browser | Compatibility |
|---|---|---|
| Windows 10 | IE11 | YES |
| Windows 10 | Edge (15-18) | YES |
| Windows 8.1 | IE11 | YES |
| Windows 7 | IE11 | YES |
| Windows 7 | Firefox 45+ | YES |
| Windows 7 | Chrome 45+ | YES |
Android
| OS | Browser | Compatibility |
|---|---|---|
| Android 4.4 | Chrome | YES |
| Android 8 | Chrome | YES |
iOS
| OS | Browser | Compatibility |
|---|---|---|
| iOS 7 | Safari | YES |
| iOS 12 | Safari | YES |
OSX
| OS | Browser | Compatibility |
|---|---|---|
| Mavericks | Safari 7.1 | YES |
| Mojave | Safari 12 | YES |
Information sources
https://github.com/videojs
https://github.com/brightcove/videojs-flashls-source-handler
https://github.com/videojs/videojs-flash/
