Как установить загруженное имя файла при использовании Filereader API? - PullRequest
Новая
       71

Как установить загруженное имя файла при использовании Filereader API?

0 голосов
/ 22 апреля 2020

У меня есть документ в виде base64string, а затем я сгенерирую файл из него и предоставлю ссылку для скачивания. Это все работает правильно, однако дает файлу случайное число, а не имя, которое я хочу.

Сначала я создаю новый файл примерно так: 

export const urlToFile = (url, filename, type) =>
  fetch(url)
    .then(res => res.arrayBuffer())
    .then(
      buffer =>
        new File([buffer], filename, {
          type
        })
    );

export const getExportFileUrl = resp =>
  urlToFile(
    `data:${docType};base64,${resp}`,
    `Document_Filename`,
    `${docType}`
  ).then(file => file);

Затем я комбинирую Filereader и URL API для создания ссылки на скачивание, например, так: 


// This is returned from the File API.
const exportedFile = {
    name: "Document_Filename"
    lastModified: 1587577801489
    lastModifiedDate: '....'
    webkitRelativePath: ""
    size: 8243
    type: "application/vnd.openxmlformats-officedocument.wordprocessingml.document"
}

handleDownloadClick = () => {
    const fileReader = new FileReader();

    fileReader.onload = () => {
        const downloadUrl = URL.createObjectURL(exportedFile);
        window.location = downloadUrl;
    };

    fileReader.readAsText(exportedFile);
};

Загруженное имя файла выглядит примерно так:

f8477d6a-bea9-4a83-843f-26e381249b71.docx

Как установить собственное имя файла? возможно с приведенной выше реализацией?

1 Ответ

0 голосов
/ 23 апреля 2020

Решением было использование элемента привязки, а не кнопки, а затем установить атрибут загрузки с именем, которое я хотел для файла, следующим образом: 

<a download="Name_2020_04_23_12_39" href="blob:http://domain">Download</a>
...