如何在JavaScript中将Base64格式图片转换为数组

首先需要剥离Base64字符串里的前缀标识（image/jpeg;base64,），只保留纯编码内容，再根据需求选择不同的转换方式：

1. 转换为Uint8Array（二进制数据数组） #

这是处理图片二进制内容最常用的方式，适合后续做Blob、Canvas等操作：

// 假设你的Base64字符串存储在Img变量中
const base64Data = Img.split(',')[1]; // 提取纯Base64编码部分
const binaryStr = atob(base64Data); // 解码Base64为二进制字符串
const uint8Arr = new Uint8Array(binaryStr.length);

// 遍历二进制字符串，将每个字符的ASCII码存入数组
for (let i = 0; i < binaryStr.length; i++) {
  uint8Arr[i] = binaryStr.charCodeAt(i);
}

// uint8Arr即为包含图片二进制数据的数组

2. 转换为普通字符数组 #

如果仅需要将Base64编码的每个字符拆分为数组元素：

const base64Data = Img.split(',')[1];
const charArr = base64Data.split('');

// charArr就是由Base64单个字符组成的数组

补充说明 #

如果需要进一步处理图片的像素信息，可将Uint8Array转为Blob后，通过Canvas的getImageData()方法获取像素数组，但如果只是需要二进制数据数组，第一种方法完全满足需求。

内容的提问来源于stack exchange，提问作者parker