Objective
Learning how to use videojs + RTMP through a simple example.
A simple implementation
<!DOCTYPE html>
<html>
<head>
<title>Videojs 7 + RTMP (flash)</title>
<meta charset="utf-8">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/video.js/7.6.5/video-js.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/video.js/7.6.5/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 muted autoplay >
<source src="rtmp://fms.105.net/live/rmc1" type="rtmp/mp4">
</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>
Compatibility
Browser | Compatibility |
---|---|
Safari 12 Desktop | YES |
Firefox 69 Desktop | YES |
Chrome 74 Desktop | YES |
Please note : from chrome 76+, flash is blocked by default.
Information sources
https://www.wowza.com/community/questions/50896/live-247-rtmp-stream-demo-url.html
https://github.com/videojs/video.js