vue播放mjpeg格式视频

``

<template>
  <div>
    <canvas id='test_canvas' width='640px' height='480px' style='border:1px solid #d3d3d3'></canvas>
  </div>
</template>

<script>
export default {
  name: 'TestIndex',
  data () {
    return {
      ctx: null
    }
  },
  mounted () {
    this.ctx = document.getElementById('test_canvas').getContext('2d')
    var img = new Image()
    img.src = 'http://mjpeg.sanford.io/count.mjpeg'
    this.ctx.drawImage(img, 0, 0, 640, 480)
    setInterval(() => {
      this.refreshCanvas(this.ctx, img)
    }, 10)
  },
  methods: {
    refreshCanvas (ctx, img) {
      this.ctx.drawImage(img, 0, 0, 640, 480)
    }
  }
}
</script>