Ulepsz swoją aplikację funkcjami Visionera PDF Telerik Blazor

Dlaczego warto połączyć Telerik UI z IronPDF?

Przeglądarka plików PDF Telerik Blazor wyróżnia się możliwością wyświetlania plików PDF z funkcjami takimi jak wyszukiwanie tekstu, kontrolki Zoom oraz konfigurowalny pasek narzędzi. Jednak gdy trzeba dynamicznie generować pliki PDF z HTML, adresów URL lub widoków Razor, IronPDF zapewnia silnik renderujący oparty na Chrome, którego Telerik UI nie zawiera w swoich bibliotekach przetwarzania dokumentów. Silnik renderujący IronPDF dla przeglądarki Chrome zapewnia idealną dokładność pikselową podczas konwersji treści internetowych do formatu PDF.

To hybrydowe podejście pozwala korzystać z doskonałych możliwości tworzenia plików PDF oferowanych przez IronPDF, jednocześnie wykorzystując dopracowane komponenty interfejsu użytkownika firmy Telerik do wyświetlania. Sprawdza się to szczególnie dobrze podczas modernizacji starszych projektów internetowych lub tworzenia nowych rozwiązań Blazor PDF, które wymagają zarówno funkcji generowania, jak i przeglądania. Przed wyświetleniem wygenerowanych plików PDF można również dodać nagłówki i stopki, zastosować znaki wodne oraz ustawić niestandardowe marginesy.

Jak zainstalować i skonfigurować projekt?

Aby skonfigurować obie biblioteki w projekcie Blazor, należy zainstalować niezbędne pakiety NuGet. Można użyć konsoli menedżera pakietów lub interfejsu CLI platformy .NET. IronPDF jest dostępny na NuGet.org i działa z platformą .NET 10 oraz nowszymi wersjami. Więcej szczegółów można znaleźć w instrukcji instalacji IronPDF NuGet.

Install-Package IronPdf
dotnet add package IronPdf

Install-Package IronPdf
dotnet add package IronPdf

Po instalacji skonfiguruj Program.cs, aby dodać usługi:

builder.Services.AddTelerikBlazor();
builder.Services.AddSingleton<ChromePdfRenderer>();

builder.Services.AddTelerikBlazor();
builder.Services.AddSingleton<ChromePdfRenderer>();

Ta konfiguracja umożliwia korzystanie zarówno z komponentów Telerik UI for Blazor, jak i funkcji renderowania IronPDF w Twojej aplikacji. DevCraft Użytkownicy Suite, którzy znają już Telerik, uznają tę integrację za prostą. W przypadku bardziej złożonych scenariuszy warto zapoznać się z asynchronicznym generowaniem plików PDF lub niestandardowymi konfiguracjami logowania.

Jak tworzyć dokumenty PDF za pomocą IronPDF do wyświetlania?

IronPDF przekształca zawartość HTML w pliki PDF, które mogą być wyświetlane przez przeglądarkę Telerik PDF. Oto jak wygenerować plik PDF z HTML i przygotować go do przeglądania. Można również konwertować ciągi znaków HTML do formatu PDF lub bezpośrednio renderować pliki HTML:

@page "/generate-pdf"
@inject ChromePdfRenderer Renderer
@code {
    private byte[] pdfData;
    private async Task GeneratePDF()
    {
        // Create PDF from HTML content
        var pdf = await Renderer.RenderHtmlAsPdfAsync(@"
            <h1>Invoice Report</h1>
            <table>
                <tr><td>Item</td><td>Amount</td></tr>
                <tr><td>Service</td><td>$100</td></tr>
            </table>");
        // Convert to byte array for Telerik viewer
        pdfData = pdf.BinaryData;
    }
}

@page "/generate-pdf"
@inject ChromePdfRenderer Renderer
@code {
    private byte[] pdfData;
    private async Task GeneratePDF()
    {
        // Create PDF from HTML content
        var pdf = await Renderer.RenderHtmlAsPdfAsync(@"
            <h1>Invoice Report</h1>
            <table>
                <tr><td>Item</td><td>Amount</td></tr>
                <tr><td>Service</td><td>$100</td></tr>
            </table>");
        // Convert to byte array for Telerik viewer
        pdfData = pdf.BinaryData;
    }
}

Imports System.Threading.Tasks
Imports Microsoft.AspNetCore.Components
Imports DinkToPdf

@page "/generate-pdf"
@inject ChromePdfRenderer Renderer

@code
    Private pdfData As Byte()

    Private Async Function GeneratePDF() As Task
        ' Create PDF from HTML content
        Dim pdf = Await Renderer.RenderHtmlAsPdfAsync("
            <h1>Invoice Report</h1>
            <table>
                <tr><td>Item</td><td>Amount</td></tr>
                <tr><td>Service</td><td>$100</td></tr>
            </table>")
        ' Convert to byte array for Telerik viewer
        pdfData = pdf.BinaryData
    End Function
End Code

Ten kod generuje dokument PDF gotowy do wyświetlenia. Silnik renderujący IronPDF zapewnia idealne wyświetlanie treści HTML, CSS i JavaScript, zachowując całe formatowanie, gdy użytkownicy przeglądają je za pomocą komponentu przeglądarki PDF. Można również dodawać obrazy do plików PDF, osadzać obrazy z usługi Azure Blob Storage lub bezpośrednio konwertować obrazy do formatu PDF. Zapoznaj się z pełną gamą funkcji IronPDF, aby zrozumieć, jakie możliwości oferuje.

Klasa ChromePdfRenderer oferuje szerokie możliwości dostosowywania. Można ustawić rozmiar strony, marginesy, nagłówki, stopki oraz zdefiniować niestandardowy CSS dla mediów PRINT — funkcje, które uzupełniają możliwości wyświetlania Telerik. W przypadku zaawansowanych scenariuszy zapoznaj się z opcjami kontroli podziału stron, konfiguracji okna wyświetlania lub ustawień podstawowego adresu URL, aby zapewnić prawidłowe ładowanie zasobów.

Jak zintegrować komponent Blazor Telerik PDF Viewer?

Po wygenerowaniu pliku PDF za pomocą IronPDF wyświetlenie go w przeglądarce Telerik Blazor PDF jest bardzo proste:

<TelerikPdfViewer Data="@pdfData"
                  Height="600px"
                  Zoom="1.0">
    <PdfViewerToolBar>
        <PdfViewerToolBarPagerTool />
        <PdfViewerToolBarZoomTool />
        <PdfViewerToolBarSearchTool />
        <PdfViewerToolBarDownloadTool />
    </PdfViewerToolBar>
</TelerikPdfViewer>

<TelerikPdfViewer Data="@pdfData"
                  Height="600px"
                  Zoom="1.0">
    <PdfViewerToolBar>
        <PdfViewerToolBarPagerTool />
        <PdfViewerToolBarZoomTool />
        <PdfViewerToolBarSearchTool />
        <PdfViewerToolBarDownloadTool />
    </PdfViewerToolBar>
</TelerikPdfViewer>

Ta konfiguracja komponentów zapewnia niezbędne narzędzia do pracy z plikami PDF. Pasek narzędzi zawiera przyciski nawigacyjne, elementy sterujące poziomem Zoom oraz funkcję wyszukiwania. Możesz dostosować wyświetlane narzędzia w zależności od potrzeb aplikacji. Atrybut Data określa wartość PDF do wyświetlenia. Aby zwiększyć funkcjonalność, warto rozważyć wdrożenie funkcji wyodrębniania tekstu lub wyszukiwania w plikach PDF.

Przeglądarka Telerik UI for Blazor automatycznie obsługuje kompatybilność z przeglądarkami, działając w nowoczesnych przeglądarkach bez wtyczek. W przypadku aplikacji desktopowych korzystających z .NET MAUI obie biblioteki obsługują wdrażanie wieloplatformowe, umożliwiając tworzenie spójnych doświadczeń PDF na platformach internetowych i desktopowych.

Jak te komponenty współpracują ze sobą?

Integracja tworzy efektywny przepływ pracy, w którym IronPDF zajmuje się żmudnym tworzeniem plików PDF, a Telerik zapewnia dopracowane wrażenia podczas przeglądania. Oto kompletny przykład ilustrujący tworzenie plików PDF z HTML o dynamicznej treści:

@page "/document-viewer"
@inject ChromePdfRenderer Renderer
<div class="row">
    <div class="col-md-12">
        <TelerikButton OnClick="@LoadDocument">
            Load PDF Document
        </TelerikButton>
        @if (documentData != null)
        {
            <TelerikPdfViewer Data="@documentData"
                            Height="800px">
            </TelerikPdfViewer>
        }
    </div>
</div>
@code {
    private byte[] documentData;
    private async Task LoadDocument()
    {
        // Generate dynamic PDF content
        var html = await GenerateReportHtml();
        var pdf = await Renderer.RenderHtmlAsPdfAsync(html);
        documentData = pdf.BinaryData;
    }
    private async Task<string> GenerateReportHtml()
    {
        // Build HTML dynamically
        return "<h1>Dynamic Report</h1><p>Report content here</p>";
    }
}

@page "/document-viewer"
@inject ChromePdfRenderer Renderer
<div class="row">
    <div class="col-md-12">
        <TelerikButton OnClick="@LoadDocument">
            Load PDF Document
        </TelerikButton>
        @if (documentData != null)
        {
            <TelerikPdfViewer Data="@documentData"
                            Height="800px">
            </TelerikPdfViewer>
        }
    </div>
</div>
@code {
    private byte[] documentData;
    private async Task LoadDocument()
    {
        // Generate dynamic PDF content
        var html = await GenerateReportHtml();
        var pdf = await Renderer.RenderHtmlAsPdfAsync(html);
        documentData = pdf.BinaryData;
    }
    private async Task<string> GenerateReportHtml()
    {
        // Build HTML dynamically
        return "<h1>Dynamic Report</h1><p>Report content here</p>";
    }
}

@page "/document-viewer"
@inject ChromePdfRenderer Renderer
<div class="row">
    <div class="col-md-12">
        <TelerikButton OnClick="@LoadDocument">
            Load PDF Document
        </TelerikButton>
        @If documentData IsNot Nothing Then
            <TelerikPdfViewer Data="@documentData"
                              Height="800px">
            </TelerikPdfViewer>
        End If
    </div>
</div>
@code
    Private documentData As Byte()
    
    Private Async Function LoadDocument() As Task
        ' Generate dynamic PDF content
        Dim html = Await GenerateReportHtml()
        Dim pdf = Await Renderer.RenderHtmlAsPdfAsync(html)
        documentData = pdf.BinaryData
    End Function

    Private Async Function GenerateReportHtml() As Task(Of String)
        ' Build HTML dynamically
        Return "<h1>Dynamic Report</h1><p>Report content here</p>"
    End Function
End Code

Dlaczego warto wybrać to podejście hybrydowe?

Chociaż Telerik UI for Blazor oferuje doskonałe możliwości wyświetlania, nie dorównuje możliwościom generowania plików PDF przez IronPDF. Silnik IronPDF oparty na przeglądarce Chrome renderuje złożone układy, formularze i treści stylizowane, z którymi prostsze biblioteki do przetwarzania dokumentów mogą mieć trudności. Łącząc te dwa elementy, otrzymujesz profesjonalne generowanie plików PDF wraz z profesjonalnym interfejsem do przeglądania.

Takie podejście zapewnia elastyczność programistom, którzy muszą wypróbować różne opcje wyświetlania. Można zastąpić przeglądarkę Telerik prostszym wyświetlaczem iframe lub opracować niestandardowe komponenty wyświetlania, zachowując jednocześnie możliwości generowania plików przez IronPDF. Rozwiązanie to dobrze skaluje się od prostych konwersji HTML do PDF po złożone scenariusze generowania raportów. Strona główna IronPDF zawiera przegląd wszystkich obsługiwanych przypadków użycia.

Jakie są kolejne kroki wdrożenia?

Stworzenie przeglądarki plików PDF Telerik Blazor przy użyciu IronPDF zapewnia najlepsze z obu światów: skuteczne generowanie plików PDF i dopracowane wrażenia podczas przeglądania. To połączenie pomaga tworzyć kompletne rozwiązania PDF, które mogą zmodernizować starsze projekty internetowe i spełnić wymagania współczesnych aplikacji. Niezależnie od tego, czy wdrażasz je w systemie Windows, Linux czy macOS, obie biblioteki zapewniają obsługę wielu platform.

Niezależnie od tego, czy tworzysz systemy zarządzania dokumentami, narzędzia do raportowania, czy dowolną aplikację Blazor wymagającą obsługi plików PDF, ta integracja zapewnia funkcjonalność i komfort użytkowania, których wymagają Twoje projekty. Od prostego generowania faktur po tworzenie złożonych raportów — to kompleksowe rozwiązanie skutecznie radzi sobie z różnorodnymi wymaganiami.

Gotowi na wdrożenie tego rozwiązania? Rozpocznij bezpłatny okres próbny IronPDF, aby przekonać się, jak usprawnia on Twoje projekty Telerik UI for Blazor. Jeśli chcesz używać tych narzędzi w produkcji, sprawdź opcje licencji IronPDF, żeby znaleźć coś, co pasuje do Twoich potrzeb.