本文将会介绍如何在网页端上实现直播的播放。
hls播放
videojs
如果我们要让我们的网页支持在所有浏览器上播放,我们就需要使用第三方的播放器。VideoJs是一个较好的播放器库,完全免费,不像JWPlayer一样需要付费才能使用一些高级功能。下面是一个播放的例子。你可以将source标签下的src换成你自己的直播流地址。需要注意的是rtmp流的type是rtmp/flv(flv 跟推流的时候FFmpegFrameRecorder设置的format有关), hls 的type是application/x-mpegURL。
放松放松法的直播间
poster="https://img.alicdn.com/imgextra/i2/754328530/TB2FpxhkXXXXXa5XXXXXXXXXXXX_!!754328530.jpg" data-setup="{}">
To view this video please enable JavaScript, and consider upgrading to a web browser that
不过这里有个小问题,需要先安装一个依赖,github上发现了一个项目叫 vue-video-player(总之我是这么做的不然出不来视频直播)
npm install vue-video-player --save
如果是vue项目中,要在main.js中引入:
import Vue from 'vue' //这个不要照搬,如果你是vue项目并且已经引入了的话就不用引
import VideoPlayer from 'vue-video-player' //记住这两句必须有!!
然后use:
Vue.use(VideoPlayer) //记住这两句必须有!!
最后你就可以在上面的HTML页面里src的地方添加你的rtmp流地址了,注意要保证你的rtmp流正常才行,不然方法再对也是出不来的亲!