Я пытаюсь сделать тег, где он загружает файл, но он загружает ссылку на файл, а не фактический файл - PullRequest
Новая
       26

Я пытаюсь сделать тег, где он загружает файл, но он загружает ссылку на файл, а не фактический файл

0 голосов
/ 09 июля 2019

Я хочу сделать тег <a>, в котором функция щелчка будет выполнять функцию с именем downloadFile () в файле машинописного текста, чтобы загружать файл журнала.вместо загрузки файла журнала, он загружает ссылку на файл журнала, который работает, но я хочу, чтобы загрузка отображала актуальную информацию журнала. 

downloadFile() {
    const blob = new Blob(['blablabla.log'], {type: 'text/log'});
    const dataURL = window.URL.createObjectURL(blob);
    if (window.navigator && window.navigator.msSaveOrOpenBlob) {
      window.navigator.msSaveOrOpenBlob(blob);
      return;
    }
    const link = document.createElement('a');
    link.href = dataURL;
    link.download = 'export file.log';
    link.click();
    setTimeout(() => {
      window.URL.revokeObjectURL(dataURL);
    }, 100);
  }

1 Ответ

1 голос
/ 09 июля 2019

Это не способ загрузить файл по клику из BLOB-объекта. Вот как вы должны поступить:

  1. Создайте некоторый BLOB-объект с некоторым содержимым файла и типом
  2. Создать объект URL. Вы передадите это значение атрибуту <a> href
  3. Создайте <a> и установите для его атрибута download желаемое имя файла
  4. Сделайте элемент невидимым, добавьте его в DOM и нажмите на него

Пример ниже: 

const downloadFile = () => {
  const blob = new Blob(
    ['Some file content'],
    {type:'text/log'}
  );
  const url = window.URL.createObjectURL(blob);
  const a = document.createElement('a');
  a.href=url;
  a.download='some-file-name.log';
  a.style.display='none';
  document.body.appendChild(a);
  a.click();
  window.URL.revokeObjectURL(url);
}
<a onclick="downloadFile()">Click me!</a>
...