在开发中，经常会遇到需要将base64编码的图片转换为file文件格式用于上传的情况；图片base64编码转换为file格式过程中，思路： base64 --> Uint8Array --> new File（） 。

具体实现方法如下，封装在文件xxx.js中，放置于项目文件夹utils下，开发中直接引入调用即可：

/**
 * Base64 转 File
 * @param base64 String base64格式字符串
 * @param filename String 文件名称或者文件路径
 * @param contentType String file对象的文件类型，如："image/png"
 export function base64ToFile(base64, filename, contentType){
     var arr = base64.split(',')  //去掉base64格式图片的头部
     var bstr = atob(arr[1])   //atob()方法将数据解码
     var leng = bstr.length
     var u8arr = new Uint8Array(leng)
     while(leng--){
        u8arr[leng] =  bstr.charCodeAt(leng) //返回指定位置的字符的 Unicode 编码
     return new File([u8arr], filename, {type:contentType}) 
* Base64转Blob
* @param base64 String base64格式字符串
* @param contentType String blob对象的文件类型，如："image/png"
function base64ToBlob(base64, contentType){
	var arr = base64.split(',')  //去掉base64格式图片的头部
	var bstr = atob(arr[1])   //atob()方法将数据解码
	var leng = bstr.length
	var u8arr = new Uint8Array(leng)
	while(leng--){
		u8arr[leng] =  bstr.charCodeAt(leng) //返回指定位置的字符的 Unicode 编码
	var blob = new Blob([u8arr],{type:contentType})
	var blobImg = {}
	blobImg.url = URL.createObjectURL(blob )  //创建URL,
	blobImg.name = new Date().getTime() + '.png'
	return blobImg
 * File 转 Base64
 * @param file Object 文件对象流
 export function fileToBase64(file){
	return new Promise((resolve) => {
		var reader = new FileReader()
		reader.readAsDataURL(file)  
		//读取后，result属性中将包含一个data:URL格式的Base64字符串用来表示所读取的文件
		reader.onload = function(e){
			resolve(e.target.result)
* Blob 转 Base64
* @param blob Object blob对象
export function blobToBase64(blob){
	return new Promise((resolve) => {
		var reader = new FileReader()
		reader.readAsDataURL(blob)  
		//读取后，result属性中将包含一个data:URL格式的Base64字符串用来表示所读取的文件
		reader.onload = function(e){
			resolve(e.target.result)

使用：引入xxx.js文件，调用方法

// 注意引入路径不要出错
import { base64ToFile, base64ToBlob, fileToBase64, blobToBase64 } from '@/utils/xxx.js'
const file = base64ToFile(base64, 'picture', 'image/png')
// 输出File对象
console.log(file)
const blob = base64ToBlob(base64, 'image/png')
// 输出blob对象
console.log(blob)
fileToBase64(file).then(res => {
	// 输出图片base64
	console.log(res)
}).catch(err => {
	console.log(err)
blobToBase64(blob).then(res => {
	// 输出图片base64
	console.log(res)
}).catch(err => {
	console.log(err)
MDN： https://developer.mozilla.org/zh-CN/docs/Web/API/Blob
您可以观察到，像一些图片处理插件（例如有名的 vue-cropper ）图片裁剪插件，
它们将图片处理完毕后，都将使用 blob 对象返回处理好的图片，供开发者用于上传服务器。
				
uni-app / vue.js / JavaScript 将 base64 转 Blob，uniapp app端如何将图片的base64编码转换成File对象或Blob，uni-app / vue.js / JavaScript 中拿到base64转blob对象，uniapp 图片base64格式转blob格式方法，uniapp上传图片压缩转base64码与base64转图片路径，Base64/Blob/File 图片文件转换，url、base64、blob相互转换方法，读取本地文件为Base64并转成B
				
        最近项目中需要实现把图片的base64编码转成file文件的功能，然后再上传至服务器。起初是直接通过new File()的方式进行转换，在各个主流的浏览器基本上都支持，Android也没问题，但是在ios系统埋了个坑，ios11.4以下的系统上传失败。定位bug发现是new File()这个方法不兼容ios系统，只能另辟蹊径，最后找到一个方法就是：
				
dataURLtoBlob(dataurl, name) {//base64转file
      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..
				
可以使用 JavaScript 的 atob() 函数将 base64 编码的字符串转换为原始二进制数据。然后，您可以使用诸如 File、Blob 等对象创建一个文件流。
下面是一个例子：
// 将 base64 编码的字符串转换为二进制数据
const binaryData = atob(base64String);
// 将二进制数据转换为 Uint8Array
const uint8Arr...
				
JavaScript中的Blob、File和Base64都是处理文件或数据的常用对象。下面将介绍它们的使用场景以及相互之间的转换。
Blob对象用于表示不能被修改的类文件数据，并且可以在被发送到服务器之前进行处理。它可用于在网页上生成和下载文件，比如将网页上的图片存储为Blob对象，然后使用URL.createObjectURL()方法将其显示为图像。此外，Blob对象也可以用于通过XMLHttpRequest或Fetch API将数据发送到服务器。
File对象继承自Blob对象，它是用户在表单中选择的文件的表示形式。File对象可以包含文件的名称、大小、类型以及最后修改日期等信息。在上传文件时，我们通常会使用File对象来获取文件的详细信息并进行验证。
Base64是一种将二进制数据编码为ASCII字符的方式，常用于在文本传输中表示二进制数据。我们可以使用JavaScript的btoa()和atob()函数在Base64字符串和二进制数据之间进行相互转换。
在相互转换方面，可以将Blob对象转换为Base64字符串，然后使用toDataURL()方法将其转换为DataURL，或者使用FileReader对象的readAsDataURL()方法将Blob或File对象转换为DataURL。而将Base64字符串转换为Blob对象，则可以使用Blob构造函数并设置正确的MIME类型。
综上所述，Blob对象适用于处理类文件数据和发送到服务器，File对象适用于处理用户上传的文件，而Base64适用于在文本传输中表示二进制数据。根据具体的应用场景和需求，我们可以进行这三种对象之间的相互转换。