Это сообщение является ответом на сообщение Вы не можете запрашивать загрузку файла с помощью заголовка размещения контента с помощью Axios (XHR). Извините. , Что, к счастью, неверно. Вам нужно всего лишь два дополнительных шага!

Вполне возможно запрашивать файлы на стороне клиента и учитывать заголовок Content-Disposition сервера. Более того, вы можете сделать это без взлома URI данных в теги привязки и автоматизации кликов, благодаря модулю FileSaver. FileSaver обрабатывает запрос на загрузку файла, поэтому вам не нужно открывать ссылки для загрузки в новом окне, что особенно полезно в SPA.

Шаг 1. Установите заголовки ответа сервера

Откройте заголовок Content-Disposition, используя заголовок Access-Control-Expose-Headers, и установите заголовок Content-Disposition, как обычно.

Access-Control-Expose-Headers: Content-Disposition
Content-Disposition: attachment; filename="example-file.csv"

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

Шаг 2. Получите данные со стороны клиента данных

Установите file-saver как зависимость:

npm i file-saver

Используйте fetch и file-saver на клиенте, чтобы запросить и сохранить файл.

PS Суть этого сообщения также есть по адресу: https://gist.github.com/nerdyman/5de9cbe640eb1fbe052df43bcec91fad

Фотография: https://www.pexels.com/photo/waterdog-105611/