我需要将我的图像转换为Base64字符串,这样我就可以将我的图像发送到服务器。
有JavaScript文件吗?否则,我如何转换它?
我需要将我的图像转换为Base64字符串,这样我就可以将我的图像发送到服务器。
有JavaScript文件吗?否则,我如何转换它?
当前回答
这很简单。 只需调用函数并传递你的图像。 2>保存返回值并在任何需要的地方使用。
//call like this
const convertedFile = await imageToBase64(fileObj);
console.log("convertedFile",convertedFile);
//this is the required function
async function imageToBase64(image) {
const reader = new FileReader();
reader.readAsDataURL(image);
const data= await new Promise((resolve, reject) => {
reader.onload = () => resolve(reader.result);
reader.onerror = error => reject(error);
});
return data;
}
export default imageToBase64;
其他回答
你可以使用HTML5 <canvas>:
创建一个画布,将图像加载到其中,然后使用toDataURL()来获得Base64表示(实际上,它是一个data: URL,但它包含Base64编码的图像)。
document.querySelector(“输入”)。Onchange = e => { const fr = new FileReader() Fr.onloadend = () => document.write(fr.result) fr.readAsDataURL (e.target.files [0]) } < input type = " file " >
你也可以简单地提取以64为基数的URL的一部分:
var Base64URL = canvas.toDataURL('image/webp')
var Base64 = Base64URL.split(",")[1] //Returns the base64 part
据我所知,图像可以通过FileReader()转换为Base64字符串,也可以将其存储在canvas元素中,然后使用toDataURL()获取图像。我也遇到过类似的问题你可以参考这个。
将图像转换为已经加载的画布
您可以使用FileAPI,但它几乎不受支持。