rtmp播放
文章目录
- rtmp播放
- 1、rtmp测试路径地址
- 2、video.js播放rtmp
- 3、ezuikit播放rtmp
1、rtmp测试路径地址
https://www.cnblogs.com/yeminglong/p/14704789.html
2、video.js播放rtmp
注意:
1.如果写在html本地运行,请使用http-server启动,安装:npm install http-server -g ,启动:
http-server -r-1
2.video.js要使用5.X版本
3.需要开启网页flash
4.如果视频转的久,不要慌多等等
5.资源下载地址:
video-js.swf:https://github.com/videojs/video-js-swf/tree/master/dist
video-js:http://vjs.zencdn.net/5.3.0/video.min.js
video.css:http://vjs.zencdn.net/5.3.0/video-js.min.css
<!DOCTYPE HTML>
<html><head><title>video+rtmp</title><meta charset="utf-8"><link href="./video-js@5.3.0.min.css" rel="stylesheet">
</head><body><h1>video+rtmp测试</h1><video id="my-video" class="video-js" controls preload="auto" width="640px" height="480px" poster=""data-setup="{}"><source src="rtmp://58.200.131.2:1935/livetv/ahtv" type="rtmp/flv"><p class="vjs-no-js">播放视频需要启用 JavaScript,推荐使用支持HTML5的浏览器访问。To view this video please enable JavaScript, and consider upgrading to a web browser that<a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a></p></video><script src="./video@5.3.0.min.js"></script><script>var myPlayer5 = videojs("my-video"); //当前video标签的idvideojs.options.flash.swf = './video-js@5.3.0.swf' //本地的swf文件myPlayer5.ready(function () {var myPlayer = this;myPlayer.play(); //播放});</script>
</body></html>
3、ezuikit播放rtmp
注意:
1.官方文档:http://open.ys7.com/doc/zh/uikit/uikit_javascript.html
我使用的是jssdk 2.0
<!DOCTYPE html>
<html><head><title>EZuikit播放rtmp</title><meta charset="utf-8" /></head><body><video id="myPlayer" controls playsinline webkit-playsinline autoplay><sourcesrc="rtmp://58.200.131.2:1935/livetv/ahtv"type="rtmp/flv"/></video><script src="./ezuikit.js"></script><script>// 注:在vue里使用动态src时// 这一步需要放在settimeout里面new EZuikit.EZUIPlayer('myPlayer')</script></body>
</html>