vue2中使用xgplayer播放流视频

1、官网

2、安装后无法播放时,经测试,需要降低版本

javascript 复制代码
    "xgplayer-hls": "2.2.2",
    "xgplayer": "2.31.6"

改为以上版本可以正常播放

3、完整使用

(1)引入

javascript 复制代码
import 'xgplayer'
import hlsjsPlayer from 'xgplayer-hls'

(2)初始化

javascript 复制代码
      this.player = new hlsjsPlayer({
        id: 'myFlvVideo',
        url: 'http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8',
        height: '100%',
        width: '100%',
        isLive: true,
        autoplay: true,
        playsinline: true,
        volume: 0, //音量
        screenShot: true, //截图
      })

(3)销毁

javascript 复制代码
// 播放器销毁
this.player.destroy(true)
相关推荐
hflmwl85 小时前
Wise Data Recovery找回误删的文档照片音乐和视频
音视频·datarecovery·找回误删的文档照片音乐和视频·找回误删的文档照片音乐视频
技灵AI5 小时前
AI 视频转场提示词怎么写?让前后画面衔接更自然
人工智能·prompt·aigc·音视频
youandyouyou7 小时前
跨区培训的屏幕共享怎么做才稳?同屏同步与弱网优化实践
音视频·网络通信
开开心心就好7 小时前
课堂随机点名工具,绿色版免安装双击即用
java·服务器·前端·ffmpeg·音视频·perl·symfony
美狐美颜SDK开放平台8 小时前
直播APP集成美颜SDK,如何梳理第三方组件的数据权限?
开发语言·人工智能·深度学习·音视频·第三方美颜sdk
l14372332679 小时前
批量视频硬字幕擦除多少钱?影响报价的关键因素全解析
音视频
重生六道10 小时前
B站视频时长统计:一段JS脚本搞定分P/合集总时长(附倍速计算)
开发语言·javascript·音视频
音视频牛哥10 小时前
不换摄像机,也能接入 WebRTC?SmartMediaKit RTSP/RTMP 转 WHIP 技术实践
音视频·webrtc·smartmediakit·rtsp转whip·rtmp转whip·whip推流·rtsp转webrtc播放
lll235269177910 小时前
Android APP短视频音频提取,主流工具怎么选
ffmpeg·音视频
乐橙开放平台11 小时前
门店监控想集中看?乐橙含光支持多品牌摄像头跨店管理
网络·笔记·物联网·自动化·音视频·智能家居