js图片地址转base64编码

最新推荐文章于 2024-11-18 20:58:55 发布

佛跳墙kk

最新推荐文章于 2024-11-18 20:58:55 发布

阅读量757

点赞数 5

文章标签： javascript 前端开发语言

本文链接：https://blog.csdn.net/m0_56654689/article/details/142763059

版权

export const base64 = imageUrl => {
	return new Promise((resolve, reject) => {
		let canvas = document.createElement('canvas')
		const ctx = canvas.getContext('2d')
		let img = new Image()
		img.crossOrigin = 'Anonymous' // 解决Canvas.toDataURL 图片跨域问题
		img.src = imageUrl
		img.onload = function () {
			canvas.height = img.height
			canvas.width = img.width
			ctx.fillStyle = '#fff' // canvas背景填充颜色默认为黑色
			ctx.fillRect(0, 0, img.width, img.height)
			ctx.drawImage(img, 0, 0) // 参数可自定义
			const dataURL = canvas.toDataURL('image/jpeg', 1) // 获取Base64编码
			resolve(dataURL)
			canvas = null // 清除canvas元素
			img = null // 清除img元素
		}
		img.onerror = function () {
			reject(new Error('Could not load image at ' + imageUrl))
		}
	})
}