前端base64转file

戾气生财

已于 2024-04-12 14:32:56 修改

阅读量402

点赞数 6

文章标签：前端

于 2024-04-12 14:29:19 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_43396817/article/details/137679850

版权

本文介绍了如何将Base64编码的数据转换为Blob对象，以及Blob对象进一步转换为File类型，以便于文件上传。主要展示了两个JavaScript函数：dataURLtoBlob和blobToFile的操作步骤和使用示例。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//1,先将base64转换为blob
const  dataURLtoBlob =(dataurl:any)=> {
  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 });
}
//2,再将blob转换为file
const blobToFile =(theBlob:any, fileName:any)=>{
  theBlob.lastModifiedDate = new Date();  // 文件最后的修改日期
  theBlob.name = fileName;                // 文件名
  return new File([theBlob], fileName, {type: theBlob.type, lastModified: Date.now()});
}
// 使用示例
const base64toFile =(data:any) => {
  // 1.先转为 blob格式  file.content是此文件的base64格式 
  let blob =  dataURLtoBlob(data);
  // 2.在转为 file类型
  let fileData = blobToFile(blob,fileName);
  // 3.上传
}