Mikel
来源： JS，base64编码的图片上传_js res.photobase64 如何上传-CSDN博客
公司的项目要拍照上传图片，但用了第三方平台，拍照接口返回的是照片的base64编码，如何把base64编码的图片上传到服务器呢？思路上来说：首先，要将base64编码转换成file，再将file塞到from中，提交到后台即可。直接上代码
/**
* imageURI为图片的base64编码，不包含头部部分：data:img/jpg;base64,
**/
var fileName=(new Date()).getTime()+”.jpeg”; //随机文件名
var imgfile=convertBase64UrlToImgFile(imageURI,fileName,’image/jpeg’); //转换成file
var formData = new FormData();
formData.append(‘file’, imgfile); //放到表单中，此处的file要和后台取文件时候的属性名称保持一致
$.ajax({
url:上传文件的后台处理url,
type:”POST”,
cache:false,
data:formData,
processData:false, //不对参数进行转换序列号
contentType:false, //fromData上传文件时将其设置为false
success:function(data){
//成功执行的代码逻辑
},
error:function(data){
//失败执行的代码逻辑
}
});
其中convertBase64UrlToImgFile函数代码如下：
/**
* 有些浏览器(如edge)不支持new File，所以为了兼容，base64要先转换成blob再设置type，name，lastModifiedDate
* 属性间接转换成文件，而不推荐直接new File()的方式
**/
function convertBase64UrlToImgFile(urlData,fileName,fileType) {
var bytes = window.atob(urlData); //转换为byte
//处理异常,将ascii码小于0的转换为大于0
var ab = new ArrayBuffer(bytes.length);
var ia = new Int8Array(ab);
var i;
for (i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
//转换成文件，添加文件的type，name，lastModifiedDate属性
var blob=new Blob([ab], {type:fileType});
blob.lastModifiedDate = new Date();
blob.name = fileName;
return blob;
}
但在调用时，后台始终获取不到设置的filename，一直是blob。查资料发现，需要在formdata.append时加上文件名，如下：
formData.append(‘file’, imgfile,fileName);
如此，问题解决。
————————————————
版权声明：本文为CSDN博主「southArbor」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/u010295735/article/details/89029399
