Telerik Blazor PDF ビューアの機能でアプリを強化

Telerik UI と IronPDF を組み合わせる理由は何ですか?

Telerik Blazor PDF ビューアは、テキスト検索、ズーム コントロール、カスタマイズ可能なツールバーなどの機能を備え、PDF の表示に優れています。 ただし、HTML、URL、またはRazorビューから PDF ファイルを動的に生成する必要がある場合、 IronPDF は、Telerik UI のドキュメント処理ライブラリに含まれていない Chrome ベースのレンダリング エンジンを提供します。 IronPDF の Chrome レンダリング エンジンは、Web コンテンツを PDF に変換するときにピクセル単位の精度を保証します。

このハイブリッド アプローチにより、IronPDF の優れた PDF 作成機能を使用しながら、表示には Telerik の洗練された UI コンポーネントを使用できます。 これは、従来の Web プロジェクトを最新化する場合や、生成機能と表示機能の両方を必要とする新しいBlazor PDF ソリューションを作成する場合に特に効果的です。 生成された PDF を表示する前に、ヘッダーとフッターを追加したり、透かしを適用したり、カスタム マージンを設定したりすることもできます。

プロジェクトをインストールしてセットアップするにはどうすればよいですか?

Blazorプロジェクトで両方のライブラリを設定するには、必要なNuGetパッケージをインストールする必要があります。 パッケージ マネージャー コンソールまたは.NET CLI のいずれかを使用できます。 IronPDFはNuGet.orgで入手でき、 .NET 10 以降のバージョンで動作します。 詳細については、IronPDF NuGet インストールガイドを参照してください。

Install-Package IronPdf
dotnet add package IronPdf

Install-Package IronPdf
dotnet add package IronPdf

インストール後、Program.csを設定して、サービスを追加してください：

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

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

この構成により、Blazor コンポーネント用の Telerik UI とアプリケーション内の IronPDF のレンダリング機能の両方が有効になります。 すでにTelerikに慣れ親しんでいるスイートユーザーは、この統合を簡単に理解できるでしょう。 より複雑なシナリオでは、非同期 PDF 生成やカスタム ログ構成を検討することをお勧めします。

IronPDF for Display を使用して PDF ドキュメントを作成するにはどうすればよいですか?

IronPDF は、HTML コンテンツを Telerik PDF ビューアで表示できる PDF ファイルに変換します。 HTML から PDF を生成し、表示できるように準備する方法を説明します。 HTML 文字列を PDF に変換したり、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

このコードは、表示可能な PDF ドキュメントを生成します。 IronPDF のレンダリング エンジンにより、HTML、CSS、 JavaScriptコンテンツが完璧にレンダリングされ、ユーザーが PDF ビューア コンポーネントを通じて表示するときにすべての書式が維持されます。 また、PDF に画像を追加したり、Azure Blob Storage から画像を埋め込んだり、画像を直接 PDF に変換したりすることもできます。 IronPDFの全機能を調べて、何ができるかを理解してください。

CODE-1686--@@クラスは、幅広いカスタマイズオプションを提供します。 ページ サイズ、余白、ヘッダー、フッターを設定したり、印刷メディア用のカスタム CSS を定義したりできます。これらの機能は Telerik の表示機能を補完します。 高度なシナリオでは、ページ区切りの制御、ビューポートの構成、またはベース URL 設定を調べて、アセットを適切に読み込みます。

Telerik の PDF ビューアーBlazorコンポーネントをどのように統合しますか?

IronPDFで PDF を生成したら、それを Telerik Blazor PDF ビューアで表示するのは簡単です。

<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>

このコンポーネント構成は、PDF を操作するための重要なツールを提供します。 ツールバーには、ナビゲーション ボタン、ズーム レベル コントロール、検索機能が含まれています。 アプリケーションのニーズに応じて、表示されるツールをカスタマイズできます。 CODE-1688--@@属性は、表示するPDF値を提供します。 機能を向上させるには、テキスト抽出機能や PDF 検索機能を実装することをお勧めします。

Telerik UI for Blazor ビューアは、ブラウザの互換性を自動的に処理し、プラグインなしで最新のブラウザで動作します。 .NET MAUI を使用するデスクトップ アプリケーションの場合、両方のライブラリがクロスプラットフォーム展開をサポートしているため、Web プラットフォームとデスクトップ プラットフォーム間で一貫した PDF エクスペリエンスを作成できます。

これらのコンポーネントはどのように連携するのでしょうか?

この統合により、 IronPDF がPDF 作成の面倒な作業を処理し、Telerik が洗練された表示エクスペリエンスを提供するという効果的なワークフローが生まれます。 以下に、動的なコンテンツを含む HTML から PDF を作成する方法を示す完全な例を示します。

@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

このハイブリッドアプローチを選択する理由は何ですか?

Telerik UI for Blazorは優れた表示機能を提供しますが、IronPDF の PDF 生成機能には匹敵しません。 IronPDF の Chrome ベースのエンジンは、より単純なドキュメント処理ライブラリでは処理が難しい複雑なレイアウト、フォーム、スタイル設定されたコンテンツをレンダリングします。 両方を組み合わせることで、プロフェッショナルな PDF 生成とプロフェッショナルな表示インターフェースが実現します。

このアプローチは、さまざまな表示オプションを検討する必要のある開発者に柔軟性を提供します。 Telerik ビューアをよりシンプルな iframe 表示に置き換えたり、IronPDF の生成機能を維持しながらカスタム表示コンポーネントを開発したりすることもできます。 このソリューションは、単純な HTML から PDF への変換から複雑なレポート生成シナリオまで、適切に拡張できます。 IronPDF のホームページでは、サポートされているすべてのユースケースの概要が提供されています。

実装に向けた次のステップは何ですか?

IronPDFを使用して Telerik Blazor PDF ビューアを作成すると、効率的な PDF 生成と洗練された表示エクスペリエンスという両方のメリットが得られます。 この組み合わせにより、従来の Web プロジェクトを最新化し、最新のアプリケーション要件を満たす完全な PDF ソリューションを構築できます。 Windows、Linux、macOS のいずれにデプロイする場合でも、両方のライブラリはクロスプラットフォーム サポートを提供します。

ドキュメント管理システム、レポートツール、または PDF 機能を必要とするBlazorアプリケーションを構築する場合でも、この統合により、プロジェクトに必要な機能とユーザー エクスペリエンスが提供されます。 シンプルな請求書の作成から複雑なレポートの作成まで、統合ソリューションは多様な要件を効果的に処理します。

このソリューションを実装する準備はできていますか? 無料のIronPDFトライアルを開始して、 Blazorプロジェクト用の Telerik UI がどのように改善されるかを確認してください。 実稼働環境で使用する場合は、 IronPDF のライセンス オプションを確認して、ニーズに最適なものを見つけてください。