video标签利用文件对象视频播放的问题

Question

下面是vue写的视频预览代码，我想直接通过本地文件FIle对象来预览，于是
利用了URL.createObjectURL

this.FileSrc = URL.createObjectURL(this.PreviewFile)
this.$bus.emit('startVideoPreview', this.FileSrc)

<template>
    <div class='demo'>
        <video preload="auto" controls="controls" id="myVideo"
        height="100%" width="600px" :poster="imgSrc">
        <source :src="FileSrc">
        您的浏览器不支持 video 标签</video>
    </div>
</template>

<script>
// import $ from 'jquery'
export default {
  methods: {
  },
  data () {
    return {
      FileSrc: '',
      imgSrc: ''
    }
  },
  computed: {
  },
  created () {
    this.$bus.on('startVideoPreview', (val) => {
      this.FileSrc = val
    })
    this.$bus.on('closePreview', () => {
      const video = document.getElementById('myVideo')
      video.pause()
    })
  }
}
</script>

<style scoped>
.demo{
  display: inline-block;
  width: 600px;
  height: 338px;
  text-align: center;
  line-height: 100px;
  border: 1px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  position: relative;
  box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
  margin-right: 4px;
}
.demo:hover {
  display: block;
}
.video_text {
  width: 70%;
  margin: 0 auto;
}
video:focus {
  outline: 0;
}
.video-js .vjs-big-play-button {
  width: 100px;
  height: 60px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%,-50%,0);
}
</style>

问题就是现在播放的时候我利用source标签的话，就是不显示视频，只有音频出现；如果我利用video的src的话就会出现两个声音，其中一个声音我还控制不了
，就算返回使用了js pause他还在播放。请各位出手相救
网上说要利用视频转码，但是我要做预览功能，不可能要求用户进行转码（学生党做项目，经验不足多多指教）

Answer 1

应该是你的视频编码浏览器不支持，不是指格式哦（例如MP4），指视频编码不支持。可以用格式工厂转通用支持的编码。例如如下：
1. 图一，谷歌是不支持的
2. 图二是支持的