javascript Angular 下载base64文件数据

neskvpey  于 2022-12-02  发布在  Java
关注(0)|答案(4)|浏览(147)

当我尝试在Angular上保存一个base64文件时,格式如下:

// receivedFile.file = "data:image/jpeg;base64,/9j/4AAQSkZJR..."

var a = document.createElement('a');
const blob = new Blob([receivedFile.file], {type: receivedFile.infos.type});
a.href = URL.createObjectURL(blob);
a.download = receivedFile.infos.name;
a.click();

这个代码给予我一个损坏的文件,我怎么办?

46qrfjad

46qrfjad1#

在Angular中(一般情况下),我使用file-saver

import { saveAs } from 'file-saver';
const blob = new Blob([receivedFile], {type: receivedFile.infos.type});
FileSaver.saveAs(blob, receivedFile.infos.name);

此外,请尝试移除字串的data:image/jpeg;base64,部分:

receivedFile.file.replace("data:image/jpeg;base64," , "")
u3r8eeie

u3r8eeie2#

下面是将base64转换为可下载的Angular 文件格式的代码。
例如,如果您的文件类型是csv,则以下是代码片段

downloadFile(base64:any,fileName:any){
const src = `data:text/csv;base64,${base64}`;
const link = document.createElement("a")
link.href = src
link.download = fileName
link.click()

link.remove()
}

//calling above function with some sample base64 data
downloadFile("c21hbGxlcg==","demo.csv")

:文件类型可以是任何你可以根据需要(在src以上代码片段)。这里我考虑csv文件作为例子。

因此,通过调用上述函数,您可以下载的结果文件将从浏览器下载。

envsm3lx

envsm3lx3#

要解决此问题,请执行以下操作:

  • 已从收到的File.file中删除data:image/jpeg;base64
  • 使用函数atob()const byteCharacters = atob(receivedFile.file);
  • 然后将blob设为const blob = new Blob([byteCharacters], {type: this.receivedFile.infos.type});
23c0lvtd

23c0lvtd4#

试试这个

const downloadLink = document.createElement('a');
const fileName = 'sample.pdf';
downloadLink.href = linkSource;
downloadLink.download = fileName;
downloadLink.click();

相关问题