Use flv.js to play FLV live in Vue

1. NPM install flv.js

npm install flv.js

2. Introduce flv.js into the project

import flvjs from "flv.js";

3. Simply use flv.js

//template <video id="videoElement" ref="videoElement" controls muted width="100%" height="100%" ></video> //script Data () {return {flvPlayer: null}}, methods: {// createFlv video instance createFlv() {let url="http://xxxxxxxx.flv"; if (flvjs.isSupported()) { let videoElement = document.getElementById("videoElement"); this.flvPlayer = flvjs.createPlayer({ type: "flv", isLive: true, hasAudio: false, url }); this.flvPlayer.attachMediaElement(videoElement); this.flvPlayer.load(); }}}

4. Destroy FLV instances

// destroy FLV instance flv_destroy() {if (this.flvPlayer) {this.flvPlayer. Pause (); this.flvPlayer.unload(); this.flvPlayer.detachMediaElement(); this.flvPlayer.destroy(); this.flvPlayer = null; }}