Blazor

Просмотрщик документов, который работает внутри Blazor

Blazor предоставляет модель компонентов и цикл рендеринга, который почти не учитывает сторонний JavaScript. Doconut работает с этим, а не против него: рендеринг происходит на сервере в вашем собственном процессе, а виджет монтируется в простой элемент, которым вы управляете через обычный жизненный цикл interop.

Запросить доступ к оценке Посмотреть цены

75: расширения файлов, без клиентского парсинга
2: поддерживаемые модели хостинга
0: нагрузка WASM для рендеринга

Проблема

Почему обычные подходы вредят в Blazor

Клиентский путь подразумевает доставку движка рендеринга в браузер. В Blazor WebAssembly это напрямую влияет на размер загрузки, и он поддерживает только PDF — как только кто‑то загружает DOCX или XLSX, вы возвращаетесь к исходной точке.

Маршрут iframe‑to‑Office означает, что ваши документы проходят через инфраструктуру третьих лиц, что требует обсуждения с вашей службой безопасности, которое вы, вероятно, не захотите проводить дважды.

Doconut использует третий путь. Файл растеризуется в изображения страниц вашим собственным сервером, а Blazor нужно лишь разместить div. Дерево компонентов никогда не перерисовывает просмотрщик, которым он не владеет, и движок диффов не имеет с чем бороться.

Возможности

Что вы получаете в приложении Blazor

Blazor Server и WebAssembly

Рендеринг происходит на сервере в любом случае. В Server вызов прямой; в WebAssembly вы открываете вызов как минимальный API‑endpoint и передаёте возвращённый токен виджету. Оба варианта реализуются в несколько строк.

Монтируется через OnAfterRenderAsync

Инициализируйте виджет один раз после первого рендера через стандартный JS‑interop хук. Поскольку Blazor никогда не владеет внутренним DOM просмотрщика, последующие перерисовки оставляют его нетронутым.

Работает с выбранным режимом рендеринга

Interactive Server, Interactive WebAssembly или Auto. Просмотрщик управляется непрозрачным токеном, а не состоянием компонента, поэтому переключение режима рендеринга не меняет интеграцию.

Нет пробелов в поддержке форматов

Один и тот же компонент открывает PDF, DOCX, XLSX, PPTX, DWG, MSG и остальные форматы каталога. Вы пишете одну страницу просмотрщика, а не по одной для каждого типа файлов.

Эскизы, поиск и печать

Навигационный UI поставляется вместе с виджетом. Вы подключаете готовый просмотрщик, а не создаёте его из canvas и поля ввода номера страницы.

Документы остаются на вашем сервере

В браузер передаётся только отрисованные изображения страниц, что важнее в WebAssembly, чем многие ожидают — клиент, в конце концов, полностью инспектируемый.

Интеграция

Program.cs и страница Blazor

doconutHost.mount — это несколько строк вашего собственного JavaScript, который вызывает $('#div_ctlDoc').docViewer({ ... }) и затем .View(token). Размещение вне Blazor намеренно — DOM виджета не должен быть тем, с чем рендерер пытается согласовать.

Поддерживаемые платформы

Blazor ServerBlazor WebAssembly.NET 8.NET 6WindowsDocker

csharp

// Program.cs — order matters
builder.Services.AddDoconut(options =>
{
    options.LicensePath = "Doconut.Viewer.lic";
});
builder.Services.AddSession();

app.UseSession();          // before UseDoconut()
app.UseDoconutResources(); // before UseDoconut()
app.UseDoconut();

// Viewer.razor — open server-side, hand the token to the widget
@inject Doconut.Viewer Viewer
@inject IJSRuntime JS

<div id="divDocViewer"><div id="div_ctlDoc"></div></div>

@code {
    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (!firstRender) return;

        // Authorize first — the viewer renders whatever you hand it.
        string token = await Viewer.OpenDocumentAsync("wwwroot/files/Sample.pdf");
        await JS.InvokeVoidAsync("doconutHost.mount", token);
    }
}

Подробности

Полезно знать перед началом

Виджет — это плагин jQuery, поэтому jQuery должен загрузиться до скриптов просмотрщика.
UseSession() и UseDoconutResources() должны быть зарегистрированы до UseDoconut().
В WebAssembly вызов open должен находиться на сервере — откройте его как минимальный API‑endpoint и возвращайте только токен.
Токен непрозрачен. Не помещайте его в строку запроса, которую вы логируете, и не кэшируйте в состоянии компонента дольше, чем живёт страница.

Часто задаваемые вопросы

Работает ли это в Blazor WebAssembly или только в Server?

Оба варианта. Рендеринг всегда происходит на сервере, поэтому в WebAssembly вы добавляете один endpoint, который вызывает OpenDocumentAsync и возвращает токен. Клиент никогда не парсит документ, именно поэтому нагрузка WASM остаётся неизменной.

Будет ли рендерер Blazor конфликтовать с DOM просмотрщика?

Нет, при условии, что вы монтируете в элемент, который Blazor считает листом. Отрендерьте пустой div и позвольте виджету заполнить его через interop — у движка диффов нет дочерних элементов для согласования.

Нужна ли отдельная страница просмотрщика для каждого типа файлов?

Нет. Одна страница обслуживает весь каталог. Формат определяется из открываемого документа, а не выбирается вами заранее.

Попробуйте с вашими собственными документами

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

Запросить доступ к оценке Прочитать документацию