base64轉(zhuǎn)二進制流
img標(biāo)簽src屬性,可以直接使用base64字符串,base64需要先解碼,然后再轉(zhuǎn)為流文章來源:http://www.zghlxwxcb.cn/news/detail-637612.html
/**
* Base64字符串轉(zhuǎn)二進制流
* @param {String} dataurl Base64字符串(字符串包含Data URI scheme,例如:data:image/png;base64, )
*/
function dataURLtoBlob(dataurl) {
var arr = dataurl.split(","),
mime = arr[0].match(/:(.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], {
type: mime,
});
}
base64轉(zhuǎn)file
img標(biāo)簽src屬性,可以直接使用base64字符串,base64需要先解碼,然后再轉(zhuǎn)為文件文章來源地址http://www.zghlxwxcb.cn/news/detail-637612.html
/**
* Base64字符串轉(zhuǎn)File文件
* @param {String} dataurl Base64字符串(字符串包含Data URI scheme,例如:data:image/png;base64, )
* @param {String} filename 文件名稱
*/
function dataURLtoFile(dataurl, filename) {
let arr = dataurl.split(',');
let mime = arr[0].match(/:(.*?);/)[1];
let bstr = atob(arr[1]);
let n = bstr.length;
let u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, {
type: mime
});
}
文件轉(zhuǎn)base64
let fileReader = new FileReader()
file.onchange = function (e) {
console.log(e.target.files); //可以查到對應(yīng)上傳的文件,file是繼承blob的對象
fileReader.readAsDataURL(e.target.files[0])//轉(zhuǎn)base64
fileReader.onload = function (res) { console.log(res.target.result); }//顯示base64的字符串
}
流轉(zhuǎn)base64
/**
* 二進制流轉(zhuǎn)Base64(字符串包含Data URI scheme)
* @param {Object} data 二進制流
* @param {String} type 文件類型(例如:image/png)
*/
function getDataURL(data, type) {
return new Promise((resolve, reject) => {
const blob = new Blob([data], {
type
});
const reader = new FileReader();
reader.readAsDataURL(blob);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
}
到了這里,關(guān)于base64轉(zhuǎn)二進制流,file文件的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!