base64转为file
//第一个参数是base64数据,第二个参数是生成的文件名字
function base64toFile(dataurl, filename) {
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 File([u8arr], filename, {type:mime});
}
//使用
formData.append('file',base64toFile('base64url','afile'))
file转为base64
//要把file类型的表单传进去
function fileToBase64(a) {
var txt = a.files[0];
formData = new FormData()
formData.append('img[]', txt);
var src = window.URL.createObjectURL(txt);
return str
}
//使用
let img = document.getElementsByTagName('img')[0]//获取要被显示的图片节点
input = document.getElementsByTagName('input')[0]//获取file类型的input
input.onchange = function(){
img.setAttribute('src',fileToBase64(input))
}
//多个文件
//function fileToBase64(a) {
// for(let i = 0;i < a.files.length;i++){
// var txt = a.files[i];
// formData = new FormData()
// formData.append('img[]', txt);
// var src = window.URL.createObjectURL(txt);
// imgStr += `
// <img src="${src}" />
// `
// }
// $('.imgBox')[0].innerHTML = imgStr//$('.imgBox')[0]是img的父节点
// }
// var input = document.getElementsByTagName('input')[0]//获取file类型的input
// input.onchange = function(){
// fileToBase64(input)
// }
blob添加到formData
//使用cropper生成的是blob类型的数据
cropper.getCroppedCanvas().toBlob(b => {
console.log(b)//blob
var formData = new FormData()
// formData.append('multipartFile',b); 如果不做处理
formData.append('multipartFile',b,'temp.jpg');//封装好的formData可以传给接口
})
blob转base64
function blobToBase64(blob, callback) {
let a = new FileReader();
a.onload = function (e) { callback(e.target.result); }
a.readAsDataURL(blob);
}
//使用
blobToBase64(b,function(e){
$('.imgimg')[0].setAttribute('src',e)
})
记在这好找,以后还会用到的