Встроенные предпросмотры PDF

Здравствуйте,

Я использую этот компонент уже какое-то время, но сегодня заметил, что встроенные превью больше не отображаются на страницах.

2.8.0.beta6

Пример

1 лайк

Для меня всё выглядит нормально во всех десктопных браузерах:

5 лайков

И вот так это выглядит в Safari на iPad:

4 лайка

Спасибо всем,

Только что проверил снова: Safari на Mac работает, Edge тоже, а Chrome не сработал. Интересно.



4 лайка

Как нам настроить Safari на Mac, чтобы разрешить использование этого плагина? У меня всё работает отлично в других браузерах, но при попытке открыть в Safari он блокирует его, даже после того как я отключил блокировщики контента в разделе «Настройки»/«Веб-сайты». Есть ли ещё какое-то место, где нужно отключить блокировщики? Любая помощь будет очень кстати.

1 лайк

Я действительно не знаю, так что это просто трата трафика, но Safari ранее вызывал проблемы из-за довольно строгих правил CSP и других вопросов безопасности. Но тогда должны были сломаться все версии Safari, а не только на Mac, полагаю.

3 лайка

У меня это работает в Safari на Mac. Единственное место, где оно не работает, — это iPhone (Safari, FF и Chrome). На iPad я недавно не проверял.

3 лайка

Все веб-браузеры на iOS/iPadOS используют один и тот же движок рендеринга (WebKit) из-за ограничений Apple, так что в любом случае это не имеет значения.

2 лайка

Вот что я вижу на своём новом MacBook Air, Safari v. 14.1.1

Должно быть, где-то у меня неправильная настройка…

3 лайка

Попробуйте обновить Safari до последней версии.

2 лайка

Я только что выкатил новое обновление.

Теперь вы можете отключать предпросмотр для конкретных PDF-файлов. Это работает не совсем так же, как oneboxes, так как реализация этого в компоненте темы была бы довольно сложной, но принцип очень похож.

При загрузке PDF-файла в композиторе по умолчанию вы увидите следующее:

[file.pdf|attachment](upload://2cLML0SIwebGHDjlKRVzZ3VRv0f.pdf) (524.1 KB)

Всё, что нужно сделать — это добавить пробел перед именем файла, как показано ниже:

[ file.pdf|attachment](upload://2cLML0SIwebGHDjlKRVzZ3VRv0f.pdf) (524.1 KB)

Обратите внимание: пробел должен находиться внутри квадратных скобок. Это не повлияет на имя файла при его загрузке, а также не изменит описание файла, отображаемое в посте.

После этого предпросмотр PDF не будет прикреплен к обработанному посту.

Обновление добавляет новую настройку.

У неё есть два варианта:

Inline (Встроенный) и New Tab (Новая вкладка).

Если вы выберете Inline, предпросмотры PDF будут отображаться в посте, как и раньше.

Если вы выберете New Tab, компонент не создаст встроенный предпросмотр. Однако ссылка на вложение откроется в новой вкладке. В новой вкладке PDF-файл будет отображаться в нативном браузере.

Кроме того, иконка рядом со ссылкой на вложение изменится с download на external-link.

Настройка по умолчанию — Inline. Поэтому… это не повлияет на сайты, где этот компонент был установлен до обновления. Добавлена лишь новая опция, которую нужно включить вручную.

Поступали сообщения о том, что это не работает в Safari и на некоторых устройствах iOS — мне пока не удалось воспроизвести эту проблему. Обновление пытается решить её, загружая PDF как base64-URL вместо blob, так как, как я читал, с blob на устройствах Apple возникают проблемы.

Пожалуйста, обновите компонент и убедитесь, что ваш браузер также обновлен. Если по какой-то причине это не работает у вас на устройстве Apple, пожалуйста, проверьте консоль браузера (если возможно) и сообщите, что вы видите.

10 лайков

После обновления до последней версии 2.8.0.beta6 (a1daf9fe53) предварительные просмотры PDF-файлов, похоже, загружаются немного медленнее, и как минимум в одном случае один из трёх PDF-файлов в сообщении не отображается в Chrome:

Это не проблема кэширования — даже после очистки кэша Chrome, сохранения PDF с незначительным изменением и повторной загрузки превью всё равно не отображается. В журнале ошибок записей нет. Chrome обновлён до последней версии.

Консоль:

3 лайка

Я использую версию 2.8.0.beta6. ПК - Windows 10. Похожее наблюдение. Firefox работает немного медленно, но предпросмотр в итоге загружается. Chrome не показывает его, похоже, он зависает на этом сером плейсхолдере.

4 лайка

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

Если я загружаю большой PDF-файл, он открывается нормально в Firefox, но Chrome не справляется. Я немного почитал об этом, и выяснилось, что предельная длина base64-URL в значительной степени определяется производителем браузера. В Firefox ограничений нет, а в Chrome они ограничены 2 МБ.

Это означает, что использование base64-URL не является жизнеспособным решением, и нам придётся вернуться к blob-URL. Похоже, что Safari имеет лучшую поддержку, если элемент предпросмотра — это тег , а не iFrame.

Таким образом, этот PR возвращает всё к использованию blob-URL и меняет тег на . Это определённо решит проблему с большими файлами в Chrome и, надеюсь, :crossed_fingers: исправит проблемы на устройствах Apple.

Пожалуйста, обновите компонент ещё раз и дайте знать, если у вас всё ещё будут какие-либо проблемы.

3 лайка

Размеры файлов в посте с 3 PDF-файлами составляют 548,3 КБ, 1,1 МБ и 1,6 МБ в указанном порядке сверху вниз. После обновления только компонента превью отображаются, но больше не на всю ширину в Chrome:

РЕДАКТИРОВАНИЕ: В Firefox выглядит так же, как в Chrome выше, а в Safari превью не отображаются, вместо них серые блоки:

3 лайка

Спасибо, я внёс небольшое исправление для проблемы с размером.

UX: adds missing iFrame attributes by hnb-ku · Pull Request #4 · discourse/discourse-pdf-previews · GitHub

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

3 лайка

Да — в Chrome и Firefox проблема исправлена, в Safari ситуация осталась прежней: только серые блоки.

3 лайка

Просто для уточнения: раньше Safari у вас работал, верно?

3 лайка

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

3 лайка

Этот коммит должен исправить проблему в Safari.

FIX: previews are still broken on MacOS safari by hnb-ku · Pull Request #5 · discourse/discourse-pdf-previews · GitHub

Я только что протестировал это на MacBook, и у меня всё работает отлично в Safari, Chrome и Firefox.

Если кто-то сталкивается с этой проблемой:

то это проблема вашей настройки, а не компонента.

Security Verification

Также обратите внимание, что этот компонент никогда не поддерживал предпросмотр PDF на мобильных телефонах — согласно определениям Discourse, будь то iOS или Android. Таким образом, это ожидаемое поведение.

7 лайков