canvas截图 base64ToFile
2018-06-15 本文已影响0人
羊羊羊0703
说明
1、前端处理图片就是用canvas来做一个截图压缩的操作,上传后台要file文件,所以需要处理一下
代码
getImageFile: function(base64Codes) {
var formData = new FormData(); // 加了参数,safari会报错
//convertBase64UrlToBlob函数是将base64编码转换为Blob
formData.append("imageName",convertBase64UrlToBlob(base64Codes)); //append函数的第一个参数是后台获取数据的参数名,和html标签的input的name属性功能相同
return formData.get("imageName");
/**
* 将以base64的图片url数据转换为Blob
* @param urlData
* 用url方式表示的base64图片数据
*/
function convertBase64UrlToBlob(urlData){
var bytes=window.atob(urlData.split(',')[1]); //去掉url的头,并转换为byte
//处理异常,将ascii码小于0的转换为大于0
var ab = new ArrayBuffer(bytes.length);
var ia = new Uint8Array(ab);
for (var i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob( [ab] , {type : 'image/png'});
}
}