VUE项目中优雅使用EasyPlayer实时播放摄像头多种格式视频

发布时间：2023-04-28 文章分类：WEB开发, 电脑百科 投稿人：李佳 字号： 默认 | 大 | 超大 打印

EasyPlayer 介绍

简介:集播放http-flv, hls, websocket 于一身的H5视频直播/视频点播播放器, 使用简单, 功能强大；

功能支持:

官网(可在线调试)
NPM文档

实战中使用

VUE 中怎样集成 EasyPlayer

npm install @easydarwin/easyplayer --save

在VUE中使用EasyPlayer还需要配置一些文件才能使用
按需引入编码格式EasyPlayer.wasm文件(作用自行官网查看)
必须引入 EasyPlayer-element.min.js文件

注意:

组件中引入注册:

import EasyPlayer from '@easydarwin/easyplayer'
 components: {
    EasyPlayer
 },

使用

  <easy-player ref="videoplay" :video-url="url"></easy-player>

关于VUE中使用的配置属性

方法名 说明
initPlayer 初始化播放器
destroyPlayer 销毁播放器
switchVideo 播放开关
switchAudio 静音开关
fullscreen 全屏
exitFullscreen 退出全屏
changeStretch 视频拉伸模式
snapshot 保存快照
switchRecording 录像开关

项目实战中使用flv.js实时播放、断流重连、关闭断流开发心得

使用评价:

  1. EasyPlayer稳定不卡流
  2. 在vue中使用比较方便
  3. 支持多种视频格式
标签 , ,