前端在做開(kāi)發(fā)的過(guò)程中少不了要上傳文件或者圖片到服務(wù)器端搓萧,有時(shí)候上傳圖片是用base64格式上傳档址,有時(shí)候接口則是要求用表單的文件流形式上傳。下面兩個(gè)方法就是對(duì)圖片形式進(jìn)行轉(zhuǎn)換吞琐。
1.? base64? 轉(zhuǎn) file 表單形式
function dataURLtoFile(dataurl,filename){
? ? //將base64轉(zhuǎn)換為文件
? ? 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? newFile([u8arr],filename,{type:mime});
}
varfile=dataURLtoFile(imgUrl,"img");
2.? ?file 圖片轉(zhuǎn)base64? ??base64轉(zhuǎn)blob,blob轉(zhuǎn)file
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});
};
//將blob轉(zhuǎn)換為file
function? blobToFile:(theBlob,fileName){
theBlob.lastModifiedDate= new Date();?
theBlob.name=fileName;
returnthe? Blob;
};
//調(diào)用
var? blob=dataURLtoBlob(base64Data);
var? file=blobToFile(blob,imgName);