base64图片转file的处理
base64图片转file的处理
·
注意:后端返回的base64图片,有的没有code,可能会遭遇响应拦截器拦截,要去主动解除限制
request.js中
//数据处理错误接口
}else if(res.code == 400){
message({
message: res.msg || '请求出错,请重试',
type: 'error',
duration: 1500
})
return Promise.reject(new Error(res.msg || 'Error'))
}else if (res.code !== 200) {
//下载文件由于没有code所以可以直接通过
if(url.indexOf('/excel')){
return response
}
1、第一种,base64图片先转成blob对象,然后将对象转为file
(1)从接口获取base64图片
// 获取下载文件链接
export function getDownloadUrl(type, fileName) {
return request({
url: `/api/file/Download/${type}/${fileName}`, //换成自己的接口
method: 'get'
})
}
(2)将base64转为blob对象
//base64转成blob
export function dataURLtoFile(dataURI) {
let binary = atob(dataURI.split(",")[1]);
let array = [];
for (let i = 0; i < binary.length; i++) {
array.push(binary.charCodeAt(i));
}
return new Blob([new Uint8Array(array)], { type: 'image/png'});
}
(3)将blob对象转成file文件
//将blob转为file
export function uploadImg(fileData) {
let formData = new FormData();
let fileOfBlob = new File([fileData], new Date() + ".png"); // 命名图片名
formData.append("file", fileOfBlob);
return formData
}
2、直接将base64转为文件
//base64图片转成文件流格式
export function base64ToFile(data, fileName) {
const dataArr = data.split(",");
const byteString = atob(dataArr[1]);
const options = {
type: "image/jpeg",
endings: "native"
};
const u8Arr = new Uint8Array(byteString.length);
for (let i = 0; i < byteString.length; i++) {
u8Arr[i] = byteString.charCodeAt(i);
}
let formData = new FormData();
let fileOfBlob = new File([u8Arr], fileName + ".jpg", options);//返回文件流
formData.append("file", fileOfBlob);
return formData
}
3、如果文件需要上传(以file格式),则需要配置上传函数upload,注意headers要转码
//上㤔 图片
export function uploadFile({type,data}){
return request({
"url":`${define.uploadUrl}/${type}`,
"method":"POST",
data,
headers:{
'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
}
})
}
4、使用时
import {base64ToFile,uploadFile} from "@/api/common.js";
let data = base64ToFile(img,this.selectObj.id+"sign");
uploadFile({
"type":"signImg",
"data":data
}).then(resp=>{
})
更多推荐
已为社区贡献4条内容
所有评论(0)