Since video labels only support Ogg, MPEG4 and WebM formats, FLV format needs to be supported now. After research, IT is found that FLVJS can be used to realize video playback in FLV format. The specific usage methods are as follows:

  1. Git git link: github.com/bilibili/fl… .

  2. Install dependencies

npm install --save flv.js
Copy the code

3. Code

<template>
    <div>
        <video autoplay controls width="100%" height="500" id="myVideo"></video>
    </div>
</template>

<script>
    import flvjs from 'flv.js'

    export default {
        props: {
            msg: String
        },
        mounted() {
            this.$nextTick(() = > {
                this.videoPlayer()
            })
        },
        methods: {
            videoPlayer() {
                if (flvjs.isSupported()) {
                    var videoElement = document.getElementById('myVideo');
                    var flvPlayer = flvjs.createPlayer({
                        type: 'flv'.url: 'url' // Your url}); flvPlayer.attachMediaElement(videoElement); flvPlayer.load(); flvPlayer.play(); }}}}</script>
Copy the code

Effect of 4.