getVideoBase64(url) { //封面
				let self = this
				let dataURL = '';
				let img = ''
				let video = document.createElement("video");
				video.setAttribute('crossOrigin', 'anonymous'); //处理跨域
				video.setAttribute('src', url);
				video.setAttribute('width', 400);
				video.setAttribute('height', 240);
				video.currentTime = 1; // 这里是截取第几帧
				video.addEventListener('loadeddata', function() { //创建虚拟视频组件拿第一帧
					let canvas = document.createElement("canvas")
					let width = video.width //canvas的尺寸和图片一样
					let height = video.height
					canvas.width = width;
					canvas.height = height;
					canvas.getContext("2d").drawImage(video, 0, 0, width, height); //绘制canvas
					dataURL = canvas.toDataURL('image/jpeg'); //转换为base64
					// console.log(self.changimg(dataURL));
					// this.imgUrl = dataURL;
					// console.log(this.imgUrl);
				});
				return self.changimg(dataURL)
			},
			changimg(val) { //base64转图片
				// Base64编码的字符串
				var base64Str = val
				// 创建一个Image对象
				var img = new Image();
				// 设置Image的src为Base64编码的字符串
				img.src = base64Str;
				// 将Image对象绘制到Canvas上
				var canvas = document.createElement('canvas');
				canvas.width = img.width;
				canvas.height = img.height;
				var ctx = canvas.getContext('2d');
				ctx.drawImage(img, 0, 0);
				// 将Canvas转换为DataURL
				var dataURL = canvas.toDataURL();
				this.imgUrl = dataURL
				return dataURL
			},

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐