直播推流或拉流播放器

js 2020-08-22 浏览(208 评论(0

首先引用

//imgcache.qq.com/open/qcloud/video/vcplayer/TcPlayer-2.3.2.js"(//是相对协议)

html

<div id="id_test_video" style="width:100%; height:auto;">
 </div>

js

   <script>
     var player = new TcPlayer('play_video', {
         "rtmp": "rtmp://r2.weizan.cn/v/76582_663477143381876388", //请替换成实际可用的播放地址
         "m3u8": "https://p2.weizan.cn/76582/663477143381876388/live.m3u8",//支持在 PC 及手机浏览器上播放 HLS(M3U8)协议的直播视频,M3U8)协议的视频兼容性不错,其延迟较高
         "autoplay" : true,      //iOS 下 safari 浏览器,以及大部分移动端浏览器是不开放视频自动播放这个能力的
         "controls" : 'system',
         "live": 'live',
         //"width" :  '640',//视频的显示宽度,请尽量使用视频分辨率宽度
         //"height" : '360',//视频的显示高度,请尽量使用视频分辨率高度
         "width" :  '1060',//视频的显示宽度,请尽量使用视频分辨率宽度
         "height" : '580',//视频的显示高度,请尽量使用视频分辨率高度
         // "poster" : {"style":"cover", "src":"https://bsg-i.nbxc.com/live.png"},
         "wording": {
              2: "Corporate live broadcast is not enabled, please watch during live broadcast.直播未开启,请在直播期间观看.",
              13:	"直播已结束,请稍后再来",
              2032: "请求视频失败,请检查网络",
              2048: "请求m3u8文件失败,可能是网络错误或者跨域问题",
         }
     });
  </script>

参考文档链接

腾讯播放器文档

打赏

如果此文对你有所帮助,请随意打赏鼓励作者^_^

黄信强博客