vue 引入视频监控流 flv.js 完美支持chrome,firefox,ie等浏览器
1、npm install flv.js
2、vue 文件引入,
import flvjs from 'flv.js'
  data() {
    return {
      player:null
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.createVideo()
    })
  },
  beforeDestroy() {
    if (this.player) {
      this.player.pause()
      this.player.destroy()
      this.player = null
    }
  },
  methods: {
    createVideo() {
      const videoElement = this.$refs.videoElement // 定义播放路径
      if (flvjs.isSupported()) {
        this.player = flvjs.createPlayer({
          type: 'flv',
          url: '', // 你的url地址
          duration: 0,
          filesize: 0,
          enableStashBuffer: true,
          isLive: true, // 实时流
          hasAudio: false,
          hasVideo: true
        })
      } else {
        this.$message.error('不支持的格式')
        return
      }
      this.player.attachMediaElement(videoElement)
      this.player.load()
      this.player.play()
    }
  }本作品采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可。
评论已关闭