Это сообщение является ответом на сообщение Вы не можете запрашивать загрузку файла с помощью заголовка размещения контента с помощью 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/