Як OnlineDocumentViewer рендерить документи у браузері за допомогою Doconut SDK
OnlineDocumentViewer показує PDF, Word‑файли, CAD‑чертежі та десятки інших форматів безпосередньо всередині будь‑якої веб‑сторінки. Це відбувається завдяки делегуванню важкої роботи Doconut SDK, серверному рендеринговому движку, який перетворює оригінальний файл у піксельно‑точний потік зображень, а потім передає ці зображення в браузер через легковаговий JavaScript‑обгортка.
Doconut SDK: Ядро рендерингу за кожним попереднім переглядом
Doconut SDK розуміє більше 50 нативних типів файлів – PDF, DOCX, XLSX, PPTX, DWG, PSD, SVG та багато інших. Коли надходить запит, Doconut аналізує вихідний документ, визначає шрифти та шари і створює растрове представлення, яке точно відповідає оригінальному макету піксель за пікселем. Оскільки конверсія виконується на сервері, клієнту ніколи не потрібні Microsoft Office, AutoCAD чи будь‑яка інша настільна програма.
Від токену до пікселів: повний процес запиту
- Створіть підписаний токеном URL – Ваш бек‑енд викликає REST API OnlineDocumentViewer, передаючи ідентифікатор файлу та необов’язкові параметри, такі як
disableDownload: true. API повертає короткоживучий URL, що містить криптографічний токен. - Сервер викликає Doconut – Сервіс OnlineDocumentViewer пересилає запит до Doconut SDK, який виконує конверсію файлу у пісочничому середовищі.
- Потік пікселів надсилається назад – Doconut транслює відрендерені сторінки у вигляді тайлів‑зображень. SDK зшиває тайли у прокручуване полотно, зберігаючи рівні масштабування та позиції прокрутки.
- Переглядач відображає канвас – Front‑end отримує безшовний, безплагінний попередній перегляд, який поводиться як нативний переглядач PDF.
Цей процес працює однаково для бек‑енду на .NET, сервісу Node.js або будь‑якої платформи, що може здійснити HTTP‑запит, задовольняючи вимогу «крос‑платформеності».
Піксельна точність: що означає високоякісний рендеринг для вашого інтерфейсу
Високоякісний рендеринг гарантує, що кожен гліф, векторна форма та шар відображаються точно так, як їх задумав автор. Для PDF, що містить вбудовані OpenType‑шрифти, Doconut витягує дані шрифту та растерує кожен гліф на запитуваному рівні масштабування, тому не з’являються резервні шрифти. Для CAD‑чертежа (DWG) відтворюються товщини ліній, штрихові шаблони та видимість шарів без спотворень. Результат – попередній перегляд, який виглядає ідентично відкриттю файлу у його рідному настільному застосунку, усуваючи візуальні прогалини, що часто змушують розробників вдаватися до скріншотів.
Безпека, конфіденційність та відповідність GDPR вбудовані
- Контроль доступу на основі токену – Кожен URL попереднього перегляду містить підписаний токен, який сервер перевіряє перед викликом Doconut. Якщо токен відсутній або прострочений, запит відхиляється.
- Автоматичне видалення файлів – Після завершення конвеєра рендерингу оригінальний файл видаляється з тимчасового сховища. На сервері не залишаються постійні копії.
- Кінець‑к‑кінцю шифрування – Увесь трафік між вашим front‑end, сервісом OnlineDocumentViewer та Doconut передається через TLS.
- Обмеження доменів – Ви можете вказати дозволені домени, які можуть завантажувати переглядач, запобігаючи атакам click‑jacking.
Ці механізми дозволяють вбудовувати попередні перегляди документів у SaaS‑продукти, які повинні відповідати суворим вимогам захисту даних.
Час завантаження менше секунди навіть у масштабі
Оскільки Doconut виконує конверсію на потужних хмарних інстанціях, більшість документів рендеряться менш ніж за одну секунду, незалежно від того, чи клієнт працює на Windows, macOS, Linux, iOS чи Android. Переглядач транслює лише ті тайли, які наразі видимі, тому споживання пропускної здатності залишається низьким навіть у мобільних мережах. Архітектура є хмарно‑нативною: кілька інстанцій сервісу рендерингу автоматично масштабуються за глобальним балансувальником навантаження, забезпечуючи стабільну затримку по всьому світу.
Що спробувати далі
- Зареєструйтеся на Online Document Viewer (https://onlinedocumentviewer.com) та завантажте зразок PDF.
Дізнайтеся більше про рендеринговий движок на сайті Doconut: https://doconut.com.
Для додаткових посібників з інтеграції відвідайте https://doconut.app.
