我需要将我的图像转换为Base64字符串,这样我就可以将我的图像发送到服务器。
有JavaScript文件吗?否则,我如何转换它?
我需要将我的图像转换为Base64字符串,这样我就可以将我的图像发送到服务器。
有JavaScript文件吗?否则,我如何转换它?
当前回答
您可以使用FileAPI,但它几乎不受支持。
其他回答
需要利用读取器将blob转换为base64,更喜欢使用async-await语法,所以我选择提取读取器逻辑到帮助器,像这样:
//* Convert resBlob to base64
export const blobToData = (blob: Blob) => {
return new Promise((resolve) => {
const reader = new FileReader()
reader.onloadend = () => resolve(reader.result)
reader.readAsDataURL(blob)
})
}
并在主代码中使用await调用它:
//* Convert resBlob to dataUrl and resolve
const resData = await blobToData(resBlob)
下面是使用Javascript Promise的方法。
const getBase64 = (file) => new Promise(function (resolve, reject) {
let reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result)
reader.onerror = (error) => reject('Error: ', error);
})
现在,在事件处理程序中使用它。
const _changeImg = (e) => {
const file = e.target.files[0];
let encoded;
getBase64(file)
.then((result) => {
encoded = result;
})
.catch(e => console.log(e))
}
你也可以简单地提取以64为基数的URL的一部分:
var Base64URL = canvas.toDataURL('image/webp')
var Base64 = Base64URL.split(",")[1] //Returns the base64 part
如果您使用的是Dojo Toolkit,那么它为我们提供了一种直接编码或解码Base64的方法。
试试这个:
使用dojox.encoding.base64对字节数组进行编码:
var str = dojox.encoding.base64.encode(myByteArray);
解码一个base64编码的字符串:
var bytes = dojox.encoding.base64.decode(str);
这很简单。 只需调用函数并传递你的图像。 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;