Как создать файл json, а затем вернуть его в запросе на получение ответа на приложение - PullRequest
Новая
       16

Как создать файл json, а затем вернуть его в запросе на получение ответа на приложение

0 голосов
/ 02 ноября 2019

Я пытаюсь создать файл JSON sample.json , и я пытаюсь создать этот файл в моем контроллере бэкэнда с весенней загрузкой и отправить его в мое приложение реагирования, где оно будет запускать загрузкуфайла клиенту

Я хочу убедиться, что я действительно возвращаю фактический файл из ответа, полученного от запроса http get, и я хотел бы знать, как инициировать загрузку этого фактического файла. ответ Реакция 

fetch('/api/download')
  .then((res) => {
     return res.blob();
  }).then((body) => {
      console.log(body);
      setTimeout(() => {
         URL.createObjectURL(body)
      }, 300);
  }).catch((error) => {
     console.log(error);
  })

Моя конечная цель заключается в том, чтобы сгенерированный файл в бэкэнде мог пройти через запрос get и запустить загрузку, пожалуйста, дайте мне знать, как это возможно. спасибо.

1 Ответ

0 голосов
/ 02 ноября 2019

Самый простой способ - не использовать fetch, а использовать обычный элемент ссылки: 

<a href="/api/download" download="sample.json">Click to download</a>

Во всех современных браузерах этот атрибут download заставит браузер сохранить ответ ссылки в видефайл. Не требуется fetch.

Однако, если вам абсолютно необходима операция fetch, тогда вы можете сделать это в самом JS: получить свой результат, затем создать <a>, установить его hrefатрибут файлового блоба и убедитесь, что атрибут download установлен: 

fetch(...)
.then(res => res.blob())
.then(blob => {
  const blobURL = URL.createObjectURL(blob);

  // create our <a> to force a download for the response
  const dl = document.createElement(`a`);
  dl.href = blobURL;
  dl.download = `sample.json`;

  // In order for the link to "trigger" we need to add it to the document.
  // If we don't, dl.click() won't do anything. So add it, click it, then remove it.
  dl.style.display = `none`;
  document.body.appendChild(dl);
  dl.click();
  document.body.removeChild(dl);
});
...