在项目中遇到将png格式的图片转换为jpg格式的图片,可以通过canvas进行转换。
/**
* 转换图片格式
* @param {Blob} blob
* @param {String} suffix 图片后缀 png jpeg webp
*/
async function convertFormat(blob, suffix) {
// 使用promise返回,不然在img.onload中直接return返回不了
return new Promise((resolve, reject) => {
// 创建图片实例
let img = new Image()
img.onerror = (error) => {
console.error('图片加载失败:', error);
reject('图片加载失败');
};
// 图片加载完后
img.onload = () => {
// 创建canvas元素
let canvas = document.createElement('canvas')
canvas.width = img.width
canvas.height = img.height
let ctx = canvas.getContext('2d')
// 图片来源,x坐标,y坐标
ctx?.drawImage(img, 0, 0)
// 转换为base64格式
const transUrl = canvas.toDataURL(`image/${suffix}`)
// 释放资源
canvas.remove()
ctx = null
img.src = ''
URL.revokeObjectURL(img.src)
resolve(transUrl)
}
img.src = URL.createObjectURL(blob)
})
}
1263

被折叠的 条评论
为什么被折叠?



