EasyPlayer 介绍

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

功能支持:

  • 支持 MP4 播放
  • 支持 m3u8/HLS 播放;
  • 支持 HTTP-FLV/WS-FLV 播放;
  • 支持直播和点播播放;
  • 支持播放器快照截图;
  • 支持点播多清晰度播放;
  • 支持全屏或比例显示;
  • 自动检测 IE 浏览器兼容播放;
  • 支持重连播放；

其他播放方式
使用 Vue 和 flv.js 实现流媒体视频播放：完整教程
RTSP方式使用 WebRtcStreamer 实现实时视频流播放

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

实战中使用

VUE 中怎样集成 EasyPlayer

npm install @easydarwin/easyplayer --save

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

注意:

  • 这两个文件是在public里面,跟index.html同级
  • 引入层级靠前

组件中引入注册:

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. 支持多种视频格式
# javascript # vue.js # 前端
Logo
View Design

基于 Vue 的企业级 UI 组件库和中后台系统解决方案，为数万开发者服务。

更多推荐

cover

口才教育：如何提升沟通技巧与表达能力

avatar ViewDesign
cover

C 嵌入式系统设计模式 28：通道模式

avatar ViewDesign

优雅的前端框架：iView - 强大、易用且美观

优雅的前端框架：iView - 强大、易用且美观项目地址:https://gitcode.com/gh_mirrors/iv/iview是一个基于 Vue.js 的高质量 UI 组件库，旨在为开发者提供简单、直观、高效的基础组件，帮助他们快速构建现代 Web 应用程序。此项目由 Alibaba IVWEB 团队维护，质量与更新稳定性有保障。技术分析Vue.js 基础：iView 充分利...

avatar ViewDesign