Можно ли задать имя файла объекта PDF, отображаемого в Chrome?
Описание проблемы
В моем приложении на Vue я получаю PDF-файл в виде блоба и хочу отобразить его с помощью встроенного PDF-вьюера браузера.
Для этого я конвертирую блоб в файл и создаю объектный URL:
const blobFile = new File([blob], `my-file-name.pdf`, { type: 'application/pdf' })
this.invoiceUrl = window.URL.createObjectURL(blobFile)
Затем я отображаю его, устанавливая этот URL в атрибут data
элемента <object>
:
<object
:data="invoiceUrl"
type="application/pdf"
width="100%"
style="height: 100vh;">
</object>
Браузер отображает PDF-файл с помощью PDF-вьюера. Однако в Chrome имя файла, которое я указал (в данном случае my-file-name.pdf
), не используется: я вижу хэш в заголовке окна PDF-вьюера, и когда я скачиваю файл, используя "правый клик - > Сохранить как..." или элементы управления вьюера, он сохраняется с хэшом блоба (cda675a6-10af-42f3-aa68-8795aa8c377d
или подобным).
В Firefox выбранное имя файла работает так, как я надеялся; только в Chrome имя файла не используется.
Есть ли способ, используя нативный Javascript (включая ES6, но без сторонних зависимостей, кроме Vue), установить имя файла для блоба / элемента object в Chrome?
[EDIT] Если это поможет, ответ содержит следующие заголовки:
Content-Type: application/pdf; charset=utf-8
Transfer-Encoding: chunked
Content-Disposition: attachment; filename*=utf-8''Invoice%2016246.pdf;
Content-Description: File Transfer
Content-Encoding: gzip
1 ответ(ов)
В Chrome имя файла выводится на основе URL, поэтому, если вы используете blob URL, короткий ответ таков: "Нет, вы не можете задать имя файла для объекта PDF, отображаемого в Chrome." У вас нет возможности изменить UUID, присвоенный blob URL, и вы не можете переопределить его как имя страницы, использующей элемент object
. Возможно, в самом PDF указан заголовок, и он отобразится в PDF-просмотрщике как имя документа, но при загрузке вы все равно получите имя с хешем.
Это, вероятно, мера безопасности, но я не могу сказать этого с уверенностью.
Конечно, если у вас есть контроль над URL, вы можете легко задать имя файла PDF, изменив URL.
Может ли выражение (a == 1 && a == 2 && a == 3) когда-либо оцениться как истинное?
Добавление тега script в React/JSX
Альтернативы переменным классов в ES6
Обнаружение iOS Chrome
Как получить File() или Blob() из URL в JavaScript?