Google Chrome жалуется на flash при использовании <embed>с файлом PDF

Question

Я создаю очень простой компонент в Vue для предварительного просмотра PDF-файлов и изображений в модальном режиме.

Я использую Модальный компонент Vue Boostrap . В теле модала у меня есть следующая строка:

<embed :src="fileSrc" type="application/pdf" height="100%" width="100%">

fileSrc - это опора, которую получает компонент.

Когда модал запускается, визуализатор PDF не отображается, а Google Chrome выдает предупреждение:

Flash заблокирован на этой странице

Я разрешил отображение вспышки на странице, но все еще не работает.

Если я удаляю атрибут type="application/pdf" и fileSrc является файлом JPEG, он отображается просто отлично.

Я тоже без тега <object> пробовал.

Что я должен проверить? Чего мне не хватает?

Редактировать: Почему этот вопрос не является дубликатом?

Потому что я не смогу использовать тег <embed> для поддержки не только PDF, но и изображений для предварительного просмотра. Примеры в этой странице работают без включения Flash и без предупреждений, поэтому я должен иметь возможность воспроизвести это поведение.

Answer 1

Я нашел ответ.

Файлы, которые я пытался отобразить с помощью <embed>, загружались в корзину в AWS S3. При загрузке файлов (с помощью PHP-скрипта) метаданные Content-Type необходимо было установить в соответствии с файлом (то есть application/pdf для файлов PDF).

Файлы загружались со значением по умолчанию Content-Type, поэтому браузер не знал, что с ним делать, если поместить его в тег <embed> (Content-type используется для определения того, какой плагин выбрать. дисплей).

Я обнаружил, что этот метод очень легко реализовать в качестве средства предварительного просмотра файлов.