Встраивание безопасного просмотрщика документов: 7 важных функций, которые часто упускают фронтенд‑разработчики
06.03.2026

Встраивание безопасного просмотрщика документов: 7 важных функций, которые часто упускают фронтенд‑разработчики

Узнайте о 7 обязательных функциях безопасности — шифрование, CSP, изолированные iframe, токен‑аутентификация, водяные знаки, журналы аудита и многое другое — для безопасного встраивания просмотрщика документов.

Когда вы создаёте отшлифованный UI для отображения PDF, PPT или счетов, обычно фокусируетесь на эстетике, отзывчивости и времени загрузки. Однако часто пренебрегают тем, как документы перемещаются от вашего сервера к браузеру пользователя. Одна ошибка может превратить надёжное приложение в источник утечки данных.

В этом руководстве мы пройдёмся по семи функциям, ориентированным на безопасность, которые следует сразу же внедрять при интеграции просмотрщика документов, ставящего конфиденциальность на первое место. Чек‑лист написан для фронтенд‑инженеров, желающих укрепить свои встраивания без добавления лишней сложности.


1. Сквозное шифрование потока документа

Почему это важно

Даже если вы обслуживаете файлы через HTTPS, необработанный документ может быть перехвачен компрометированным расширением браузера или вредоносным скриптом, читающим ответ до того, как он попадёт в просмотрщик.

Как реализовать

ШагДействие
Шифрование на стороне сервераЗашифруйте файл (AES‑256‑GCM — надёжный выбор) перед хранением или трансляцией.
Безопасность транспортного уровняПередавайте зашифрованный блоб через TLS 1.3.
Расшифровка на клиентеЗапустите Web Worker, который получает зашифрованный поток, расшифровывает его в памяти и передаёт открытый текст напрямую в canvas просмотрщика.
Никогда не раскрывайте ключХраните ключ расшифровки в короткоживущем токене, сгенерированном сервером (см. Функцию #4).

К моменту рендеринга просмотрщик никогда не видел документ в открытом виде ни в сети, ни в основном потоке.


2. Белый список Content‑Security‑Policy (CSP)

Риск

Слабый CSP позволяет атакующему внедрять вредоносные скрипты или загружать неавторизованные ресурсы, которые могут считывать данные canvas просмотрщика.

Ключевые моменты

  • ‘unsafe‑inline’ и ‘unsafe‑eval’ запрещены для скриптов.
  • Разрешено обслуживать JavaScript только CDN просмотрщика (или собственный бандл).
  • Фреймы ограничены доверенным доменом просмотрщика.

Тщательный CSP существенно сокращает поверхность атаки страницы, содержащей встраивание.


3. Изоляция по принципу Same‑Origin через iframe Sandbox

Зачем sandbox?

Даже при наличии CSP скомпрометированная страница может попытаться получить доступ к DOM просмотрщика. Изолированный <iframe> создаёт клетку безопасности, которую хост‑страница не может нарушить без явного разрешения.

Флаги sandbox, которые следует избегать

  • allow-top-navigation — не позволяет просмотрщику захватывать окно верхнего уровня.
  • allow-popups — блокирует неожиданные всплывающие окна, которые могут использоваться для фишинга.

Если просмотрщику необходимо взаимодействовать с родительской страницой (например, для синхронизации UI), используйте postMessage с явной проверкой origin.


4. Токен‑базированный контроль доступа

Проблема прямых URL‑ов

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

Токен подписывается на сервере; любое вмешательство делает запрос недействительным, и просмотрщик отказывается загружать документ.


5. Водяные знаки и динамические наложения

Цель

Динамический клиентский водяной знак добавляет уровень ответственности без изменения оригинального файла.

Советы по реализации

  • Отрисовывайте водяной знак на canvas overlay, расположенном поверх страниц PDF.
  • Используйте электронную почту сессии или случайный UUID, чтобы каждый экземпляр просмотрщика был уникален.
  • Включайте/выключайте наложение простым флагом, чтобы минимизировать нагрузку на производительность.

Если утёкший документ будет найден, встроенный идентификатор сразу укажет на источник.


6. Ограничения скачивания и печати

Стандартные возможности браузеров

Большинство браузеров показывают контекстное меню правой кнопкой, позволяющее сохранить canvas как изображение, фактически экспортируя страницу.

Что может и чего не может сделать просмотрщик

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

Более важно то, что ни один параметр панели не заменит контроль доступа. Сервер всё равно должен авторизовывать каждый запрос к странице, миниатюре, экспорту, скачиванию и печати, потому что эти эндпоинты могут быть вызваны напрямую. И пока пиксели находятся на экране, скриншоты, камеры и инструменты доступности существуют; просмотрщик, обещающий иначе, продаёт то, чего не может предоставить.


7. Журналы аудита и хуки событий

Ценность видимости

Даже самый надёжный просмотрщик может быть использован злоумышленниками. Запись того, кто открыл какой документ, когда и какие действия выполнил, создаёт след для судебно‑экспертного анализа.

С журналами в реальном времени вы можете обнаруживать аномальные паттерны — например, одного пользователя, открывающего десятки конфиденциальных PDF за секунды — и генерировать оповещения или отзывать доступ.


Заключение

Встраивание просмотрщика документов — это ответственность за безопасность, а не только за UI. Шифрование потока, строгий Content‑Security‑Policy, изолированный iframe sandbox, токен‑базированный доступ, динамические водяные знаки, ограничения экспорта, рассматриваемые как UX, а не как защита, и журналы аудита отличают защищённое встраивание от уязвимого.

Две из этих семи функций обязательны независимо от выбранного просмотрщика: авторизация и аудит. Ни один компонент не примет это решение за вас.

Готовы построить встраивание?

  1. Начинайте с документации поставщика для установленной версии. Для Doconut это doconut.com — пакеты, руководства по настройке и примеры. Копирование ключей конфигурации из статей приводит к поломке интеграций при обновлении.
  2. Поместите чек‑лист из семи пунктов в шаблон pull‑request, чтобы проверка безопасности проходила до слияния, а не после инцидента.
  3. Сначала тестируйте негативные сценарии: идентификатор документа другого арендатора, истёкшая сессия, прямой запрос к странице или эндпоинту экспорта. Именно эти тесты выявляют реальные уязвимости.