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

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

Сначала я создаю новый файл следующим образом:

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

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


person Rob Fyffe    schedule 22.04.2020    source источник


Ответы (1)


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

<a download="Name_2020_04_23_12_39" href="blob:http://domain">Download</a>
person Rob Fyffe    schedule 23.04.2020