需求:因为之前项目用的是vue-video-player的flash模式播放flv,而谷歌浏览器在2021并不支持flash,因此采用哔哩哔哩团队开发的flv.js进行替换
1. 引入依赖
npm install flv
2. 代码
<video
class="video-player vjs-custom-skin"
ref="videoElement"
controls
autoplay
muted
>Your browser is too old which doesn't support HTML5 video.</video>
import flvjs from 'flv.js' // 引入
// 初始化
const videoElement = this.$refs.videoElement
this.flvPlayer = flvjs.createPlayer({
type: 'flv',
url: ‘flv地址’
})
this.flvPlayer.attachMediaElement(videoElement)
this.flvPlayer.load()
// 注销
if (this.flvPlayer) {
this.flvPlayer.detachMediaElement()
this.flvPlayer.destroy()
this.flvPlayer = null
}