Посібник: Безпечне вбудовування Doconut Viewer за допомогою React – від початку до кінця
← Back to Blog6 min read

Посібник: Безпечне вбудовування Doconut Viewer за допомогою React – від початку до кінця

Вбудовування переглядача документів у безпечний спосіб вимагає більше, ніж просто скопіювати фрагмент middleware у застосунок ASP.NET Core. Інтеграція повинна чітко визначати межі аутентифікації, доступу до документів, управління сесіями, рендерингу, анотацій, пошуку, друку та аудиту журналу.

Компанії, які створюють портали, орієнтовані на документи — наприклад, DMS, CRM, системи юридичного огляду або інженерні застосунки для креслень — також повинні зберігати оригінальні файли поза межами застосунку. Doconut підтримує серверну модель перегляду PDF, Office, CAD та зображень, а React‑інтерфейс може забезпечити користувацький UI.

У цьому посібнику розглядається надійна архітектура, а також навмисно уникаються назви пакетів, властивості параметрів, сигнатури методів та шляхи кінцевих точок, які можуть змінюватися між версіями SDK. Користуйтеся офіційною документацією, що відповідає вашій ліцензованій версії, для отримання точних інструкцій щодо реєстрації та API.

Архітектура безпечного переглядача документів, що з’єднує інтерфейс React, сервісний шар ASP.NET Core та захищену обробку документів
Архітектура безпечного переглядача документів, що з’єднує інтерфейс React, сервісний шар ASP.NET Core та захищену обробку документів

1️⃣ Крок 1 – Підготовка проектів ASP.NET Core та React

Перш ніж писати код, переконайтеся, що ваше середовище розробки відповідає базовим вимогам:

ВимогаРекомендована версія
.NET runtime.NET 6 або новіше
ASP.NET Core6.0+
IDEПідтримуване середовище розробки .NET
Front‑end (необов’язково)Додаток React, сумісний з вашим проектом
  1. Створіть новий проект ASP.NET Core Web API
 dotnet new webapi -n DocPortal
 cd DocPortal
  1. Add the licensed Doconut dependencies – Obtain the exact package names, versions, native dependencies, and license-loading instructions from the official documentation for your Doconut release. Do not assume that a package or wrapper shown in an unrelated tutorial applies to your version.

  2. Prepare the React application – If the viewer will be presented through React, use the front‑end setup already approved by your team. Keep the React application dependent on your own authenticated API rather than on undocumented third‑party wrappers.

  3. Commit the initial state – Most enterprise teams enforce a Git policy that requires a signed commit for any change that touches licensing or security settings.

Тепер у вас є чистий рішення, готове до інтеграції Doconut на сервері.


2️⃣ Крок 2 – Безпечна конфігурація серверної інтеграції

Зареєструйте переглядач, використовуючи інструкції, надані для точної версії Doconut у вашому проєкті. Порядок підключення middleware, реєстрація сервісів, ініціалізація ліцензії та назви властивостей конфігурації залежать від версії і не повинні копіюватися з неперевірених прикладів.

Незалежно від версії SDK, застосунок ASP.NET Core має забезпечувати такі контролі:

  • Аутентифікація перед відкриттям документа – Сесія переглядача ніколи не повинна обходити шар ідентифікації застосунку.
  • Визначення ідентифікаторів документів на сервері – Приймайте лише ідентифікатор документа рівня застосунку, а не довільний фізичний шлях, переданий браузером.
  • Авторизація кожної операції – Перегляд, анотації, пошук, завантаження та друк можуть вимагати різних прав.
  • Зберігання секретів поза системою контролю версій – Ліцензії, рядки підключення та криптографічні матеріали слід зберігати у схваленому механізмі управління секретами.
  • Обмеження запитів – Встановіть відповідні ліміти на завантаження, розмір документу, час очікування та швидкість запитів у процесі роботи переглядача.
  • Запис подій безпеки – Логуйте рішення про доступ і дії над документами, не записуючи вміст документів чи чутливі токени у журнали.

Розглядайте всі налаштування SDK як версіоновану конфігурацію. Перевіряйте їхнє значення в офіційній довідці перед включенням у продакшн.


3️⃣ Крок 3 – Ізоляція сесій документів за межами сервісу застосунку

Тримайте взаємодії, специфічні для Doconut, у спеціалізованому сервісі застосунку. Посилання на клас Viewer корисні на рівні архітектури, проте сигнатури конструкторів, методи відкриття документів, вимоги до кешу та поведінка пошуку ліцензії мають відповідати документації вашої встановленої версії.

Безпечна межа сервісу повинна:

  1. Приймати автентифікованого користувача та ідентифікатор документа рівня застосунку.
  2. Перевіряти дозволи користувача для запитаної дії.
  3. Отримувати документ з схваленого сховища на боці сервера.
  4. Викликати задокументоване API переглядача для створення сесії документа.
  5. Повернути лише мінімальну непрозору інформацію про сесію, необхідну клієнту.
  6. Звільняти або завершувати сесії згідно з вашими політиками зберігання та кешування.

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


4️⃣ Крок 4 – Увімкнення анотацій, пошуку та контрольованого друку

Анотації, пошук, OCR та контрольований друк слід активувати лише тоді, коли вони включені у вашу ліцензовану конфігурацію Doconut і підтримуються встановленою версією. Не слід припускати назви методів, формати збереження чи класи параметрів.

  • Анотації – Визначте, які ролі можуть створювати, редагувати, переглядати або видаляти розмітку. Зберігайте стан анотацій згідно з рекомендаціями щодо збереження для вашої версії SDK та вашими вимогами аудиту.
  • Пошук та OCR – Визначте, які типи документів потребують OCR, де зберігається витягнутий текст і як довго індекси залишаються доступними. Ставте результати пошуку у категорію даних документу та авторизуйте їх відповідно.
  • Контрольований друк – Визначте обмеження на кількість сторінок, політику водяних знаків, правила схвалення та події аудиту на рівні застосунку, а потім зіставте ці вимоги з можливостями друку, описаними в документації.

Тримайте ці операції в тому ж сервісі застосунку, що й сесії документів, щоб контролери залишалися легкими, а бізнес‑правила — тестованими.


5️⃣ Крок 5 – Підключення фронтенду React

React‑застосунок має викликати ваш автентифікований API ASP.NET Core, а не приймати шляхи до сховища або підключатися безпосередньо до внутрішніх сервісів документів. Визначте власний ресурсно‑орієнтований контракт API навколо бізнес‑операцій і уникайте публікації імен кінцевих точок, специфічних для SDK, у публічному клієнтському контракті.

Типова послідовність взаємодії виглядає так:

  1. Користувач обирає документ, вже видимий у застосунку.
  2. React запитує сесію перегляду, використовуючи ідентифікатор документа рівня застосунку.
  3. ASP.NET Core автентифікує запит, авторизує документ і координує сесію переглядача.
  4. React отримує лише інформацію, необхідну для відображення переглядача.
  5. Запити на анотації, пошук та друк повертаються через автентифікований API застосунку.
  6. Сервер записує події аудиту та завершує сесію, коли це доцільно.

У UI React тримайте стан сесії короткоживучим, явно обробляйте помилки авторизації, уникайте зберігання чутливих значень у постійних сховищах браузера та забезпечуйте індикатори завантаження й помилок, які не розкривають внутрішні шляхи чи деталі виключень.

Таке розділення залишає рендеринг і керування документами на сервері, тоді як React відповідає лише за презентацію та взаємодію.


Висновок

Розмістивши інтеграцію Doconut за захищеним сервісом ASP.NET Core, ви можете створити портал документів для PDF, Office, CAD та зображень без прив’язки інтерфейсу React до недокументованих деталей SDK. Аутентифікація, авторизація, життєвий цикл сесії, пошук, анотації, друк та політика аудиту залишаються явними складовими вашого дизайну застосунку.

Готові оцінити Doconut для вашого .NET‑проєкту? Використовуйте офіційний пакет, ліцензію та документацію API для обраної вами версії, а потім застосуйте наведений вище архітектурний та безпековий чек‑ліст у вашій реалізації.

#Doconut#.NET#document viewer#React#enterprise development#переглядач документів#корпоративна розробка