vue video+flv.js,播放视频获取到实时码率

npm install flv.js
npm install vue-flv-player

import flvjs from 'flv.js'
import FlvPlayer from 'vue-flv-player'

<flv-player ref="player" :volume="0" v-bind:options="{flv: 'yourVideoUrl.flv'}"></flv-player>

created() {
  this.$nextTick(() => {
    this.$refs.player.$watch('player', (player) => {
      if (flvjs.isSupported()) {
        const flvPlayer = flvjs.createPlayer({
          type: 'flv',
          url: 'yourVideoUrl.flv'
        });
        flvPlayer.attachMediaElement(player.$el);
        flvPlayer.load();
        flvPlayer.play();

        setInterval(() => {
          const statisticsInfo = flvPlayer.statisticsInfo;
          if (statisticsInfo && statisticsInfo.video && statisticsInfo.speed) {
            const fileSize = statisticsInfo.video.totalBytes;
            const bitrate = fileSize * 8 / 1024;
            console.log(`实时码率：${bitrate} Kbps`);
          }
        }, 1000);
      }
    });
  });
}