html 如何将base64转图片
时间: 2023-09-02 08:11:41 浏览: 47
可以使用 JavaScript 中的 atob() 函数将 base64 编码转换成二进制数据,然后用 URL.createObjectURL() 函数生成图片 URL,通过设置 img 标签的 src 属性来显示图片。示例代码如下:
```javascript
// 假设 base64 字符串为 'data:image/png;base64,iVBORw0KG...',可以根据实际情况修改
// 将 base64 编码转换成二进制数据
const binaryData = atob(base64字符串.split(',')[1]);
// 创建 ArrayBuffer 对象
const arrayBuffer = new ArrayBuffer(binaryData.length);
// 创建一个 Uint8Array 数组对象
const uint8Array = new Uint8Array(arrayBuffer);
// 将二进制数据存入数组
for (let i = 0; i < binaryData.length; i++) {
uint8Array[i] = binaryData.charCodeAt(i);
}
// 创建 Blob 对象
const blob = new Blob([uint8Array], { type: 'image/png' });
// 生成图片 URL
const imageUrl = URL.createObjectURL(blob);
// 显示图片
const img = document.createElement('img');
img.src = imageUrl;
document.body.appendChild(img);
```
注意:以上示例中假设 base64 字符串是以 data:image/png;base64 开头的 PNG 格式图片,如果是其他格式的图片或者没有指定格式,需要根据实际情况修改代码。