如何将文件保存到我的桌面文件夹角6

Question

我已经从base64构建了一个文件,我想将它保存到本地系统

dataURLtoFile(dataurl, filename, format) {
    const arr = dataurl.split(',');
    const mime = arr[0].match(/:(.*?);/)[1];
    const bstr = atob(arr[1]);
    let n = bstr.length;
    const u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new File([u8arr], filename, {type: format});
  }

使用此功能,我可以将base64转换为File.但我想将其下载到我的本地系统.我怎样才能在2角以上的角度做到这一点？

Answer 1

指定下载位置对话框完全取决于浏览器。通过 Javascript，您无法指定用户的桌面位置来下载文件。Javascript 访问您的目录位置将导致严重的安全风险。最大，您可以更改浏览器设置以每次都询问下载位置。

要在默认下载位置实现正常下载，您可以使用文件保护程序

只需将其导入到您的代码中：

import { saveAs } from 'file-saver'

并saveAs在您的 downloadUrlToFile 方法中使用。

dataURLtoFile(dataurl, filename, format) {
    const arr = dataurl.split(',');
    const mime = arr[0].match(/:(.*?);/)[1];
    const bstr = atob(arr[1]);
    let n = bstr.length;
    const u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    saveAs(new File([u8arr], filename, {type: format}));
}

在此处查看示例：https : //stackblitz.com/edit/angular-xrubur?file=src%2Fapp%2Fapp.component.ts

Answer 2

不需要外部库来触发“另存为...”窗口（例如file-saver ，它与此处另一个答案中提到的节点文件保护程序不同，用于其他目的）。

<a>我发现的最简单的方法是在组件的方法之一中创建一个元素：

saveAFile(): void {
  const dlink: HTMLAnchorElement = document.createElement('a');
  dlink.download = 'myfile.txt'; // the file name
  const myFileContent: string = 'I am a text file! ';
  dlink.href = 'data:text/plain;charset=utf-16,' + myFileContent;
  dlink.click(); // this will trigger the dialog window
  dlink.remove();
}

可以通过模板中的单击事件来调用它，例如：

<button (click)="saveAFile()">Save file</button>

我最初还将该文件的内容转换为Blob，但我很快注意到即使使用正确的charset，复杂的字符也可能在翻译中丢失（例如 ）。

您可能还会发现媒体/MIME 类型的完整列表对于创建非纯文本文件（例如text/csv或application/json）很有用。