如何从 Base64 字符串创建 JavaScript Blob？

在 JavaScript 中从 Base64 字符串创建 Blob

将 Base64 编码的字符串转换为 Blob 对象是 JavaScript 处理二进制数据时的常见任务。这对于将数据显示为图像或将其下载到用户的设备非常有用。

解码 Base64 字符串

第一步是解码 Base64 字符串。这可以使用 atob 函数来实现，该函数将 Base64 编码的字符串转换为包含原始二进制数据的新字符串。

const byteCharacters = atob(b64Data);

转换为类型化字节数组

atob 函数将产生一个字符串，每个字符代表一个字节。要将这些字符转换为实际的字节，我们可以使用 .charCodeAt 方法来获取字符代码点。这些代码点将是字节的值。

const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
    byteNumbers[i] = byteCharacters.charCodeAt(i);
}

接下来，我们可以通过将 byteNumbers 数组传递给构造函数来创建 Uint8Array。

const byteArray = new Uint8Array(byteNumbers);

创建 Blob

最后，我们可以通过将 byteArray 包装在数组中并将其传递给 Blob 来创建 Blob 对象

const blob = new Blob([byteArray], {type: contentType});

示例

以下是如何从 Base64 字符串创建 Blob 的示例：

const contentType = 'image/png';
const b64Data = 'iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==';

const blob = new Blob([atob(b64Data)], {type: contentType});

创建 Blob 后，您可以可以使用它向用户显示数据或将其下载到他们的设备上。您可以使用 URL.createObjectURL 函数为 Blob 创建 URL，然后可以将其设置为图像的 src 或下载链接的 href。

以上是如何从 Base64 字符串创建 JavaScript Blob？的详细内容。更多信息请关注PHP中文网其他相关文章！