js 下载 base64 格式的图片

最新推荐文章于 2025-05-08 14:04:44 发布

肖ZE

最新推荐文章于 2025-05-08 14:04:44 发布

阅读量3.3k

点赞数 4

CC 4.0 BY-SA版权

分类专栏： javascript

本文链接：https://blog.csdn.net/lucky541788/article/details/104458233

javascript 专栏收录该内容

89 篇文章

订阅专栏

本文介绍了如何在JavaScript中将Base64格式的图片转换为可下载的文件，详细解析了处理过程和相关代码示例，帮助开发者实现从Base64字符串到本地图片下载的功能。

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

    download() {
      this.resultDialog.picture.map((res, i) => {
        this.downloadFile(`证据 ${i + 1}.png`, res) // 此处 res 为 base64 数据图片 (data:image/jpg;base64,/.....)
      })
    },
    downloadFile(fileName, content) {
      let aLink = document.createElement('a');
      let blob = this.base64ToBlob(content); //new Blob([content]);

      let evt = document.createEvent("HTMLEvents");
      evt.initEvent("click", true, true);//initEvent 不加后两个参数在FF下会报错  事件类型，是否冒泡，是否阻止浏览器的默认行为
      aLink.download = fileName;
      aLink.href = URL.createObjectURL(blob);

      // aLink.dispatchEvent(evt);
      aLink.click()
    },
    base64ToBlob(code) {
      let parts = code.split(';base64,');
      let contentType = parts[0].split(':')[1];
      let raw = window.atob(parts[1]);
      let rawLength = raw.length;

      let uInt8Array = new Uint8Array(rawLength);

      for (let i = 0; i < rawLength; ++i) {
        uInt8Array[i] = raw.charCodeAt(i);
      }
      return new Blob([uInt8Array], { type: contentType });
    },