base64图片转文件&&视频获取第一帧图片

最新推荐文章于 2024-08-23 18:00:13 发布

作泥

最新推荐文章于 2024-08-23 18:00:13 发布

阅读量1.9k

点赞数

文章标签：音视频 javascript 前端

本文链接：https://blog.csdn.net/weixin_37787674/article/details/122474468

版权

base64图片转文件

let base64toFile = function (dataurl, filename = 'file') {
      let arr = dataurl.split(',')
         let mime = arr[0].match(/:(.*?);/)[1]
         let suffix = mime.split('/')[1]
         let bstr = atob(arr[1])
         let n = bstr.length
         let u8arr = new Uint8Array(n)
         while (n--) {
             u8arr[n] = bstr.charCodeAt(n)
         }
         return new File([u8arr], `${filename}.${suffix}`, {
             type: mime
         })
     }

视频获取第一帧图片

<video
	 id="myVideo"
	  ref="video"
	  webkit-playsinline
	  playsinline
	  x-webkit-airplay
	  x5-playsinline
	  preload="auto"
	  loop
	  :src="uploadVideo.videoMsg"
	  class="bg-size"
></video>
	uploadVideo.videoFile = files[0]
   uploadVideo.videoMsg = URL.createObjectURL(files[0])
     uploadVideo.reader.readAsDataURL(files[0])
     uploadVideo.reader.addEventListener('loadend', () => {
        captureImage()
     })
captureImage: () => {
        const scale = 0.8
        const canvas = document.createElement('canvas')
        canvas.width = video.value.videoWidth * scale
        canvas.height = video.value.videoHeight * scale
        canvas.getContext('2d').drawImage(video.value, 0, 0, canvas.width, canvas.height)
        video.value.poster = canvas.toDataURL('image/png')
        uploadVideo.videoPoster = base64toFile(canvas.toDataURL('image/png'))
}