使用canvas.toDataURL把图片转为base64格式

使用canvas.toDataURL把图片转为base64格式

function getBase64(url) {
				//通过构造函数来创建的 img 实例,在赋予 src 值后就会立刻下载图片,相比 createElement() 创建  省去了 append(),也就避免了文档冗余和污染
				const img = new Image();
				// 允许资源跨域使用
				img.setAttribute('crossOrigin', 'anonymous');
				// 这里的地址要网络路径或者你用input上传的地址
				img.src =
					"https://pics0.baidu.com/feed/3b292df5e0fe992518448ccedf8964d58cb17194.jpeg?token=a8af55e099d7507f313330013f84d5dc"
				img.onload = function() {
					// 设置图片的尺寸
					const imgWidth = 640
					const imgHeight = 1138;

					let canvas = document.createElement('canvas')
					const ctx = canvas.getContext('2d');
					canvas.width = imgWidth;
					canvas.height = imgHeight;
					// 这里表示从坐标0,0开始绘制,如果长宽就是图片的长宽的话,绘制出来就和原图片一样
					ctx.drawImage(img, 0, 0, imgWidth, imgHeight);
					const dataURL = canvas.toDataURL('image/png');
					console.log(dataURL);
					return dataURL
				}
			}

你可能感兴趣的:(js,css,前端)