vue 预览视频

1.预览本地文件

          1.1 直接给video或者embed的src赋值本地路径


// 或者 使用embed标签
 

            1.2 读取文件流形式




const blob = new Blob([this.$refs.file.files[0]], {type: 'video/mp4'})
 const reader = new FileReader();
 reader.onload = (ev) => {
     const src = ev.target.result
     that.videoUrl=src
    }
 reader.readAsDataURL(blob); 

2. 从服务器接口或者视频的数据流



api(param).then(res => {
     const blob = new Blob(res.data, {type: 'video/mp4'})
     const reader = new FileReader();
     reader.onload = (ev) => {
         const src = ev.target.result
         that.videoUrl=src
      }
      reader.readAsDataURL(blob); 
})

你可能感兴趣的:(vue.js,javascript,前端)