フッターコンテンツにスキップ
IRONPDFの使用

IronPDFを使用してBlazorでPDFを表示する方法

Blazorアプリケーションで PDF を表示するには、IronPDF の PDF ビューアー コンポーネントを使用します。このコンポーネントはBlazor Server アプリと統合されており、フォームの入力、注釈、モバイル サポートなどの機能を備えた高性能な PDF レンダリングを提供します。これらはすべてサードパーティのブラウザー ツールに依存することなく実現されます。

Blazorアプリケーションに専用の PDF ビューアが必要なのはなぜですか?

最新の Web アプリケーションで PDF を表示するには、基本的なブラウザ機能を超える信頼性の高いビューア コンポーネントが必要です。 Blazorアプリケーションを構築する.NET開発者向けに、 IronPDF はBlazor Server アプリと統合する効果的な PDF ビューア ソリューションを提供します。 これにより、サードパーティのブラウザ ツールに依存せずに、高性能な PDF レンダリングと豊富な機能を実現できます。

ネイティブ ブラウザーの PDF サポートはブラウザーやプラットフォームによって大きく異なるため、ユーザー エクスペリエンスに一貫性がなくなります。 Blazorアプリケーションにカスタム PDF ビューアを実装することで、表示エクスペリエンスを完全に制御できるようになり、すべてのプラットフォームで一貫した機能が確保されます。 これは、コンプライアンス標準と高度なセキュリティ機能を必要とするアプリケーションにとって特に重要です。

Microsoft のASP.NET Core上に構築されたBlazorフレームワークを使用すると、PDF 操作ライブラリと自然に組み合わせるコンポーネント ベースの開発が可能になります。 外部 CDN からサードパーティのビューアー ウィジェットを埋め込むのではなく、アプリケーションの正確な要件に合わせてカスタマイズされたコンポーネントを構築できます。

BlazorプロジェクトにIronPDFをインストールするにはどうすればよいでしょうか?

Blazor PDF ビューアを実装する前に、 IronPDFをインストールします。 パッケージ マネージャー コンソールまたは.NET CLI を使用して、 NuGet経由でBlazor Server アプリに追加します。

Install-Package IronPdf
Install-Package IronPdf
SHELL
dotnet add package IronPdf
dotnet add package IronPdf
SHELL

次に、新しいBlazorアプリケーションを作成し、最新バージョン for .NETがインストールされていることを確認します。 簡単にアクセスできるように PDF ファイルを wwwroot フォルダーに保存するか、バイト配列や URL などの他のソースから読み込みます。 インストールの概要では、さまざまな展開シナリオに関する詳細なガイダンスが提供されます。

どのような前提条件が必要ですか?

Blazor PDF ビューアーを正常に実装するには、次のものを用意してください。

  • 開発マシンに.NET 10がインストールされている
  • Visual Studio 2022または C# 拡張機能を備えた Visual Studio Code
  • IronPDFライセンスキー(無料トライアルで入手可能)
  • Blazorコンポーネント構造の基本的な理解
  • テスト用のサンプル PDF ファイル(wwwroot フォルダに配置します)

Windows 展開の場合は、適切な Visual C++ ランタイムがインストールされていることを確認してください。Linux ユーザーは必要な依存関係をインストールする必要があります。一方、macOS 開発者は Intel と Apple Silicon の互換性を考慮する必要があります。

PDF ファイルはどこに保存すればよいですか?

PDF ファイルの保存場所は、アプリケーションのパフォーマンスとセキュリティに大きな影響を与えます。 Blazorアプリケーションの場合、次のオプションを検討してください。

  • wwwroot フォルダ: 機密情報のない静的 PDF に最適
  • Azure BLOB ストレージ : 柔軟なストレージを必要とするクラウド アプリケーション向け -バイト配列としてのデータベース: アクセス制御を必要とする小さなPDFに適しています -保護されたサーバーディレクトリ: セキュリティ要件のある機密文書に最適 -メモリストリーム: HTML to PDFを使用して動的に生成される PDF に最適

Blazor PDF ビューアー コンポーネントを作成するにはどうすればよいですか?

PDF ドキュメントを表示できる基本的なBlazor PDF ビューア コンポーネントを構築します。 プロジェクトに新しいRazorコンポーネントを作成します。

@page "/pdfviewer"
@rendermode 相互の作用Server
@using IronPdf
@inject IJSRuntime JSRuntime
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment WebHostEnvironment

<h3>PDF Viewer Component</h3>
<div>
    <button @onclick="LoadPdfDocument">Open File</button>
    <div id="pdfContainer">
        @if (!string.IsNullOrEmpty(pdfUrl))
        {
            <iframe src="@pdfUrl" style="width:100%; height:600px;"></iframe>
        }
    </div>
</div>

@code {
    private string pdfUrl = "";
    private byte[] pdfData = Array.Empty<byte>();

    private async Task LoadPdfDocument()
    {
        var pdfDocument = PdfDocument.FromFile("wwwroot/sample.pdf");
        pdfData = pdfDocument.BinaryData;
        var base64 = Convert.ToBase64String(pdfData);
        pdfUrl = $"data:application/pdf;base64,{base64}";
    }
}
@page "/pdfviewer"
@rendermode 相互の作用Server
@using IronPdf
@inject IJSRuntime JSRuntime
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment WebHostEnvironment

<h3>PDF Viewer Component</h3>
<div>
    <button @onclick="LoadPdfDocument">Open File</button>
    <div id="pdfContainer">
        @if (!string.IsNullOrEmpty(pdfUrl))
        {
            <iframe src="@pdfUrl" style="width:100%; height:600px;"></iframe>
        }
    </div>
</div>

@code {
    private string pdfUrl = "";
    private byte[] pdfData = Array.Empty<byte>();

    private async Task LoadPdfDocument()
    {
        var pdfDocument = PdfDocument.FromFile("wwwroot/sample.pdf");
        pdfData = pdfDocument.BinaryData;
        var base64 = Convert.ToBase64String(pdfData);
        pdfUrl = $"data:application/pdf;base64,{base64}";
    }
}
Imports IronPdf
Imports Microsoft.AspNetCore.Hosting
Imports Microsoft.AspNetCore.Components
Imports Microsoft.JSInterop

@page "/pdfviewer"
@rendermode Server

<h3>PDF Viewer Component</h3>
<div>
    <button @onclick="LoadPdfDocument">Open File</button>
    <div id="pdfContainer">
        @If Not String.IsNullOrEmpty(pdfUrl) Then
            <iframe src="@pdfUrl" style="width:100%; height:600px;"></iframe>
        End If
    </div>
</div>

@code {
    Private pdfUrl As String = ""
    Private pdfData As Byte() = Array.Empty(Of Byte)()

    Private Async Function LoadPdfDocument() As Task
        Dim pdfDocument = PdfDocument.FromFile("wwwroot/sample.pdf")
        pdfData = pdfDocument.BinaryData
        Dim base64 = Convert.ToBase64String(pdfData)
        pdfUrl = $"data:application/pdf;base64,{base64}"
    End Function
}
$vbLabelText   $csharpLabel

このコードは、PDF ドキュメントを読み込んで iframe を使用して表示する PDF ビューア コンポーネントを作成します。 LoadPdfDocument メソッドは、wwwroot フォルダーから PDF を読み取り、iframe が直接レンダリングする base64 データ URL に変換します。 このアプローチはさまざまな PDF バージョンで適切に機能し、国際ドキュメントの UTF-8 エンコードをサポートします。

コンポーネントは PDF ファイルをどのように読み込みますか?

このコンポーネントは、IronPDF のドキュメント読み込み機能を使用して PDF ファイルを効率的に読み取ります。 ユーザーが"ファイルを開く"ボタンをクリックすると、メソッドは次のようになります。

  1. PdfDocument.FromFile を使用してPDFファイルを読み込みます。
  2. 読み込んだPDF文書からバイナリデータを抽出します
  3. ブラウザ互換性のためにBase64形式に変換します
  4. ブラウザが直接レンダリングできるデータURLを作成する

このアプローチにより、PDF 表示の良好なパフォーマンスを維持しながら、さまざまなブラウザ間の互換性が確保されます。 このコンポーネントは、さまざまな用紙サイズとページの向きを処理できます。

出力

<img src="/static-assets/pdf/blog/blazor-display-pdf/blazor-display-pdf-1.webp" alt=""PDF とは何か?"コンテンツを含むサンプル PDF を表示し、ナビゲーション コントロール、ズーム オプション、[ファイルを開く] ボタンを表示するBlazor PDF ビューア コンポーネントのスクリーンショット。">

JavaScript Interop を使用して PDF の表示を改善する方法

PDF コンテンツの表示をより適切に制御するには、 JavaScript相互運用機能を使用して PDF ビューアー機能を処理します。 このパターンは、 JavaScriptモジュールを非同期的に読み込み、レンダリングをブラウザのネイティブ blob/URL API に委任します。これは、Blazor のコンポーネント ライフサイクルに適した手法です。

@page "/pdf-jsinterop"
@rendermode 相互の作用Server
@using IronPdf
@inject IJSRuntime JSRuntime
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment WebHostEnvironment
@implements IAsyncDisposable

<h3>IronPDF JavaScript Interop Viewer</h3>
<p>Displays PDF using JavaScript Blob/ObjectURL capabilities.</p>

@if (!string.IsNullOrEmpty(ErrorMessage))
{
    <div class="alert alert-danger">Error: @ErrorMessage</div>
}

<div id="@documentId" style="border: 1px solid #ccc; width: 100%; min-height: 600px;">
    Loading PDF...
</div>

@code {
    private string documentId = Guid.NewGuid().ToString();
    private string ErrorMessage = string.Empty;
    private bool pdfLoaded = false;
    private IJSObjectReference? jsModule;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender && !pdfLoaded)
        {
            try
            {
                jsModule = await JSRuntime.InvokeAsync<IJSObjectReference>(
                    "import", "./pdfViewerInterop.js");
                await LoadPdfWithJavaScript();
                pdfLoaded = true;
            }
            catch (Exception ex)
            {
                ErrorMessage = $"Failed to load JS module: {ex.Message}";
            }
            finally
            {
                StateHasChanged();
            }
        }
    }

    private async Task LoadPdfWithJavaScript()
    {
        if (jsModule is null) return;
        var pdfPath = Path.Combine(WebHostEnvironment.WebRootPath, "sample.pdf");
        if (!File.Exists(pdfPath))
        {
            ErrorMessage = $"File not found: {pdfPath}";
            return;
        }
        var pdf = PdfDocument.FromFile(pdfPath);
        await jsModule.InvokeVoidAsync("displayPdf", documentId, pdf.BinaryData);
    }

    public async ValueTask DisposeAsync()
    {
        if (jsModule is not null)
            await jsModule.DisposeAsync();
    }
}
@page "/pdf-jsinterop"
@rendermode 相互の作用Server
@using IronPdf
@inject IJSRuntime JSRuntime
@inject Microsoft.AspNetCore.Hosting.IWebHostEnvironment WebHostEnvironment
@implements IAsyncDisposable

<h3>IronPDF JavaScript Interop Viewer</h3>
<p>Displays PDF using JavaScript Blob/ObjectURL capabilities.</p>

@if (!string.IsNullOrEmpty(ErrorMessage))
{
    <div class="alert alert-danger">Error: @ErrorMessage</div>
}

<div id="@documentId" style="border: 1px solid #ccc; width: 100%; min-height: 600px;">
    Loading PDF...
</div>

@code {
    private string documentId = Guid.NewGuid().ToString();
    private string ErrorMessage = string.Empty;
    private bool pdfLoaded = false;
    private IJSObjectReference? jsModule;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender && !pdfLoaded)
        {
            try
            {
                jsModule = await JSRuntime.InvokeAsync<IJSObjectReference>(
                    "import", "./pdfViewerInterop.js");
                await LoadPdfWithJavaScript();
                pdfLoaded = true;
            }
            catch (Exception ex)
            {
                ErrorMessage = $"Failed to load JS module: {ex.Message}";
            }
            finally
            {
                StateHasChanged();
            }
        }
    }

    private async Task LoadPdfWithJavaScript()
    {
        if (jsModule is null) return;
        var pdfPath = Path.Combine(WebHostEnvironment.WebRootPath, "sample.pdf");
        if (!File.Exists(pdfPath))
        {
            ErrorMessage = $"File not found: {pdfPath}";
            return;
        }
        var pdf = PdfDocument.FromFile(pdfPath);
        await jsModule.InvokeVoidAsync("displayPdf", documentId, pdf.BinaryData);
    }

    public async ValueTask DisposeAsync()
    {
        if (jsModule is not null)
            await jsModule.DisposeAsync();
    }
}
Imports System
Imports System.IO
Imports System.Threading.Tasks
Imports Microsoft.AspNetCore.Components
Imports Microsoft.JSInterop
Imports IronPdf
Imports Microsoft.AspNetCore.Hosting

@page "/pdf-jsinterop"
@rendermode Server
@inject IJSRuntime JSRuntime
@inject IWebHostEnvironment WebHostEnvironment
@implements IAsyncDisposable

<h3>IronPDF JavaScript Interop Viewer</h3>
<p>Displays PDF using JavaScript Blob/ObjectURL capabilities.</p>

@if Not String.IsNullOrEmpty(ErrorMessage) Then
    <div class="alert alert-danger">Error: @ErrorMessage</div>
End If

<div id="@documentId" style="border: 1px solid #ccc; width: 100%; min-height: 600px;">
    Loading PDF...
</div>

@code {
    Private documentId As String = Guid.NewGuid().ToString()
    Private ErrorMessage As String = String.Empty
    Private pdfLoaded As Boolean = False
    Private jsModule As IJSObjectReference

    Protected Overrides Async Function OnAfterRenderAsync(firstRender As Boolean) As Task
        If firstRender AndAlso Not pdfLoaded Then
            Try
                jsModule = Await JSRuntime.InvokeAsync(Of IJSObjectReference)(
                    "import", "./pdfViewerInterop.js")
                Await LoadPdfWithJavaScript()
                pdfLoaded = True
            Catch ex As Exception
                ErrorMessage = $"Failed to load JS module: {ex.Message}"
            Finally
                StateHasChanged()
            End Try
        End If
    End Function

    Private Async Function LoadPdfWithJavaScript() As Task
        If jsModule Is Nothing Then Return
        Dim pdfPath = Path.Combine(WebHostEnvironment.WebRootPath, "sample.pdf")
        If Not File.Exists(pdfPath) Then
            ErrorMessage = $"File not found: {pdfPath}"
            Return
        End If
        Dim pdf = PdfDocument.FromFile(pdfPath)
        Await jsModule.InvokeVoidAsync("displayPdf", documentId, pdf.BinaryData)
    End Function

    Public Async Function DisposeAsync() As ValueTask Implements IAsyncDisposable.DisposeAsync
        If jsModule IsNot Nothing Then
            Await jsModule.DisposeAsync()
        End If
    End Function
}
$vbLabelText   $csharpLabel

対応するJavaScript関数をwwwroot/pdfViewerInterop.jsファイルに追加してください。このファイルはJavaScript (C#ではありません)を使用しており、.jsモジュールとして保存されていることに注意してください。

export function displayPdf(elementId, data) {
    const blob = new Blob([new Uint8Array(data)], { type: 'application/pdf' });
    const url = URL.createObjectURL(blob);
    const container = document.getElementById(elementId);
    if (!container) return;
    container.innerHTML = '';
    const iframe = document.createElement('iframe');
    iframe.src = url;
    iframe.style.width = '100%';
    iframe.style.height = '600px';
    iframe.style.border = 'none';
    container.appendChild(iframe);
}
export function displayPdf(elementId, data) {
    const blob = new Blob([new Uint8Array(data)], { type: 'application/pdf' });
    const url = URL.createObjectURL(blob);
    const container = document.getElementById(elementId);
    if (!container) return;
    container.innerHTML = '';
    const iframe = document.createElement('iframe');
    iframe.src = url;
    iframe.style.width = '100%';
    iframe.style.height = '600px';
    iframe.style.border = 'none';
    container.appendChild(iframe);
}
The provided code is JavaScript, not C#. Therefore, it cannot be directly converted to VB.NET, as VB.NET is a server-side language and JavaScript is a client-side language. If you have C# code that you need converted to VB.NET, please provide that code for conversion.
$vbLabelText   $csharpLabel

こ for JavaScript関数は、PDF データから BLOB を作成し、オブジェクト URL を生成し、コンテナーに iframe を追加します。 この技術は、複雑なドキュメントのJavaScriptレンダリングとカスタム レンダリング遅延をサポートします。

出力

 IronPDF JavaScript Interop Viewer インターフェースには、

複数のソースから PDF を読み込むにはどうすればよいでしょうか?

Blazor PDF ビューアは、さまざまなソースから PDF ドキュメントを取得して表示できます。 以下の例は、URL および HTML コンテンツからの読み込みを示しています。

private async Task LoadFromUrl(string url)
{
    using var client = new HttpClient();
    client.Timeout = TimeSpan.FromSeconds(30);
    var response = await client.GetAsync(url);
    response.EnsureSuccessStatusCode();
    var stream = await response.Content.ReadAsStreamAsync();
    var pdfDocument = new PdfDocument(stream);
    await DisplayPdfContent(pdfDocument);
}

private async Task LoadFromHtmlContent()
{
    var renderer = new ChromePdfRenderer();
    var htmlContent = "<h1>Generated PDF</h1><p>Dynamic content from Blazor.</p>";
    var pdfDocument = renderer.RenderHtmlAsPdf(htmlContent);
    await DisplayPdfContent(pdfDocument);
}

private Task DisplayPdfContent(PdfDocument document)
{
    var data = document.BinaryData;
    pdfUrl = $"data:application/pdf;base64,{Convert.ToBase64String(data)}";
    return Task.CompletedTask;
}
private async Task LoadFromUrl(string url)
{
    using var client = new HttpClient();
    client.Timeout = TimeSpan.FromSeconds(30);
    var response = await client.GetAsync(url);
    response.EnsureSuccessStatusCode();
    var stream = await response.Content.ReadAsStreamAsync();
    var pdfDocument = new PdfDocument(stream);
    await DisplayPdfContent(pdfDocument);
}

private async Task LoadFromHtmlContent()
{
    var renderer = new ChromePdfRenderer();
    var htmlContent = "<h1>Generated PDF</h1><p>Dynamic content from Blazor.</p>";
    var pdfDocument = renderer.RenderHtmlAsPdf(htmlContent);
    await DisplayPdfContent(pdfDocument);
}

private Task DisplayPdfContent(PdfDocument document)
{
    var data = document.BinaryData;
    pdfUrl = $"data:application/pdf;base64,{Convert.ToBase64String(data)}";
    return Task.CompletedTask;
}
Imports System
Imports System.Net.Http
Imports System.Threading.Tasks

Private Async Function LoadFromUrl(url As String) As Task
    Using client As New HttpClient()
        client.Timeout = TimeSpan.FromSeconds(30)
        Dim response = Await client.GetAsync(url)
        response.EnsureSuccessStatusCode()
        Dim stream = Await response.Content.ReadAsStreamAsync()
        Dim pdfDocument As New PdfDocument(stream)
        Await DisplayPdfContent(pdfDocument)
    End Using
End Function

Private Async Function LoadFromHtmlContent() As Task
    Dim renderer As New ChromePdfRenderer()
    Dim htmlContent As String = "<h1>Generated PDF</h1><p>Dynamic content from Blazor.</p>"
    Dim pdfDocument = renderer.RenderHtmlAsPdf(htmlContent)
    Await DisplayPdfContent(pdfDocument)
End Function

Private Function DisplayPdfContent(document As PdfDocument) As Task
    Dim data = document.BinaryData
    pdfUrl = $"data:application/pdf;base64,{Convert.ToBase64String(data)}"
    Return Task.CompletedTask
End Function
$vbLabelText   $csharpLabel

LoadFromUrl メソッドはリモートの場所から PDF ドキュメントを取得し、LoadFromHtmlContentHTML をその場で PDF に変換する方法を示します。 Chrome レンダリング エンジンにより、正確な HTML 変換が保証されます。 追加のソース オプションには、Azure BLOB ストレージ、データベース メモリ ストリームDOCX ドキュメントなどがあります。

あなたのユースケースに適したソースメソッドはどれですか?

Blazorアプリケーション用の PDF ソース メソッド
ソースタイプ 最適な用途 パフォーマンス セキュリティ
ローカルファイル 静的コンテンツ 素晴らしい 低い
URL 外部文書 良い 中くらい
HTML変換 動的レポート 変数 高い
BLOB ストレージ エンタープライズアプリ 素晴らしい 高い
メモリストリーム 一時的なPDF 素晴らしい 高い

HTMLコンテンツを使用した出力

 IronPDFテスト インターフェイスは、HTML コンテンツからの PDF 生成が成功したことを示しています。URL から読み込むか HTML から生成するかのオプションが上部に表示されています。

PDF ビューアにインタラクティブ機能を追加するにはどうすればよいですか?

PDF ビューアをページ ナビゲーション、回転、印刷、ダウンロード機能で拡張します。

@code {
    private int currentPage = 1;
    private int totalPages;
    private byte[] pdfData = Array.Empty<byte>();
    private string pdfUrl = "";
    private string rotationClass = "";
    private string documentId = Guid.NewGuid().ToString();

    private async Task NavigateToPage(int page)
    {
        currentPage = page;
        await JSRuntime.InvokeVoidAsync("navigateTo", page);
    }

    private void RotateCounterclockwise()
    {
        rotationClass = "rotate-270";
    }

    private async Task PrintPdf()
    {
        await JSRuntime.InvokeVoidAsync("printDocument", documentId);
    }

    private async Task DownloadPdf()
    {
        await JSRuntime.InvokeVoidAsync("downloadFile", pdfData, "document.pdf");
    }
}
@code {
    private int currentPage = 1;
    private int totalPages;
    private byte[] pdfData = Array.Empty<byte>();
    private string pdfUrl = "";
    private string rotationClass = "";
    private string documentId = Guid.NewGuid().ToString();

    private async Task NavigateToPage(int page)
    {
        currentPage = page;
        await JSRuntime.InvokeVoidAsync("navigateTo", page);
    }

    private void RotateCounterclockwise()
    {
        rotationClass = "rotate-270";
    }

    private async Task PrintPdf()
    {
        await JSRuntime.InvokeVoidAsync("printDocument", documentId);
    }

    private async Task DownloadPdf()
    {
        await JSRuntime.InvokeVoidAsync("downloadFile", pdfData, "document.pdf");
    }
}
Imports System

Public Class CodeBehind
    Private currentPage As Integer = 1
    Private totalPages As Integer
    Private pdfData As Byte() = Array.Empty(Of Byte)()
    Private pdfUrl As String = ""
    Private rotationClass As String = ""
    Private documentId As String = Guid.NewGuid().ToString()

    Private Async Function NavigateToPage(page As Integer) As Task
        currentPage = page
        Await JSRuntime.InvokeVoidAsync("navigateTo", page)
    End Function

    Private Sub RotateCounterclockwise()
        rotationClass = "rotate-270"
    End Sub

    Private Async Function PrintPdf() As Task
        Await JSRuntime.InvokeVoidAsync("printDocument", documentId)
    End Function

    Private Async Function DownloadPdf() As Task
        Await JSRuntime.InvokeVoidAsync("downloadFile", pdfData, "document.pdf")
    End Function
End Class
$vbLabelText   $csharpLabel

このコードは、ページナビゲーション、回転印刷ダウンロード機能を追加します。 ナビゲーションが多いドキュメントにはページ番号とブックマークを追加することを検討してください。 高度な機能には、テキスト抽出や PDF から HTML への変換などが含まれる場合があります。

出力

 Blazorで構築されたフル機能の PDF ビューア コンポーネント。ドキュメント ナビゲーション コントロール、100% に設定されたズーム機能、PDF ファイルの読み込み、印刷、ダウンロード、回転オプションなどのカスタム アクション ボタンが表示されます。

PDF フォームと注釈をどのように処理しますか?

フォーム フィールド注釈を含む PDF ドキュメントの場合、 IronPDF は、プログラムによるフィールド値の読み取りと書き込みを強力にサポートします。

private async Task ProcessFormFields()
{
    var pdfDocument = PdfDocument.FromFile("form.pdf");

    foreach (var field in pdfDocument.Form.Fields)
    {
        if (field.Type == PdfFormFieldType.Text)
        {
            field.Value = "User Input";
        }
    }

    await DisplayPdfContent(pdfDocument);
}

private async Task SaveFormData()
{
    var pdfWithFormData = PdfDocument.FromFile("filled-form.pdf");
    var formData = pdfWithFormData.Form.Fields
        .ToDictionary(f => f.Name, f => f.Value);

    var json = System.Text.Json.JsonSerializer.Serialize(formData);
    await File.WriteAllTextAsync("form-data.json", json);

    pdfWithFormData.Form.Flatten();
    pdfWithFormData.SaveAs("form-submission.pdf");
}
private async Task ProcessFormFields()
{
    var pdfDocument = PdfDocument.FromFile("form.pdf");

    foreach (var field in pdfDocument.Form.Fields)
    {
        if (field.Type == PdfFormFieldType.Text)
        {
            field.Value = "User Input";
        }
    }

    await DisplayPdfContent(pdfDocument);
}

private async Task SaveFormData()
{
    var pdfWithFormData = PdfDocument.FromFile("filled-form.pdf");
    var formData = pdfWithFormData.Form.Fields
        .ToDictionary(f => f.Name, f => f.Value);

    var json = System.Text.Json.JsonSerializer.Serialize(formData);
    await File.WriteAllTextAsync("form-data.json", json);

    pdfWithFormData.Form.Flatten();
    pdfWithFormData.SaveAs("form-submission.pdf");
}
Imports System.IO
Imports System.Threading.Tasks
Imports System.Text.Json

Private Async Function ProcessFormFields() As Task
    Dim pdfDocument = PdfDocument.FromFile("form.pdf")

    For Each field In pdfDocument.Form.Fields
        If field.Type = PdfFormFieldType.Text Then
            field.Value = "User Input"
        End If
    Next

    Await DisplayPdfContent(pdfDocument)
End Function

Private Async Function SaveFormData() As Task
    Dim pdfWithFormData = PdfDocument.FromFile("filled-form.pdf")
    Dim formData = pdfWithFormData.Form.Fields.ToDictionary(Function(f) f.Name, Function(f) f.Value)

    Dim json = JsonSerializer.Serialize(formData)
    Await File.WriteAllTextAsync("form-data.json", json)

    pdfWithFormData.Form.Flatten()
    pdfWithFormData.SaveAs("form-submission.pdf")
End Function
$vbLabelText   $csharpLabel

これにより、 Blazor PDF ビューアー内でフォーム入力機能が有効になり、ユーザーはブラウザー内で直接フォーム フィールドを操作できるようになります。 コードはフォーム フィールドを反復処理し、プログラムによって値を設定します。これは、動的な事前入力を必要とするアプリケーションに最適です。 IronPDF はデジタル署名とテキスト注釈もサポートしています。

サポートされているフィールド タイプには、テキスト入力、チェックボックス、ラジオ ボタン、ドロップダウン リスト、デジタル署名フィールド、複数行テキスト領域、日付ピッカーなどがあります。

プログラムによるフォーム入力とインタラクティブなフォーム入力はいつ使用すべきですか?

フォーム入力アプローチの比較
アプローチ 使用する場合 印刷された資料をデジタル化することで、教育コンテンツを簡単に共有できます。多言語サポートにより、多様な学生層が学術リソースを利用しやすくなります。
プログラム 既知のデータの事前入力 より速く、一貫性があり、自動化された
相互の作用 ユーザー入力が必要です 柔軟で即時の検証
ハイブリッド 部分的なデータが利用可能 両方のアプローチの長所

改ざんを防ぐために、送信後にフォームをフラット化することを検討してください。 セキュリティのためにPDF サニタイズを使用します。

出力

PDF ビューア コンポーネントのフォーム入力機能の例。ユーザーがブラウザー内で直接 PDF フォームを操作できる方法を示しています。

大きな PDF のパフォーマンスを最適化するにはどうすればよいでしょうか?

PDF を表示する際、特に大きなファイルの場合に良好なパフォーマンスを確保するには、チャンク読み込みとメモリ管理を使用します。

private async Task LoadLargePdf()
{
    const int chunkSize = 1024 * 1024; // 1MB chunks
    var pdfPath = "largefile.pdf";

    using var fileStream = File.OpenRead(pdfPath);
    var buffer = new byte[chunkSize];
    var chunks = new List<byte[]>();
    int bytesRead;

    while ((bytesRead = await fileStream.ReadAsync(buffer)) > 0)
    {
        var chunk = new byte[bytesRead];
        Array.Copy(buffer, chunk, bytesRead);
        chunks.Add(chunk);
    }

    await ProcessPdfChunks(chunks);
}
private async Task LoadLargePdf()
{
    const int chunkSize = 1024 * 1024; // 1MB chunks
    var pdfPath = "largefile.pdf";

    using var fileStream = File.OpenRead(pdfPath);
    var buffer = new byte[chunkSize];
    var chunks = new List<byte[]>();
    int bytesRead;

    while ((bytesRead = await fileStream.ReadAsync(buffer)) > 0)
    {
        var chunk = new byte[bytesRead];
        Array.Copy(buffer, chunk, bytesRead);
        chunks.Add(chunk);
    }

    await ProcessPdfChunks(chunks);
}
Imports System.IO
Imports System.Threading.Tasks

Private Async Function LoadLargePdf() As Task
    Const chunkSize As Integer = 1024 * 1024 ' 1MB chunks
    Dim pdfPath As String = "largefile.pdf"

    Using fileStream As FileStream = File.OpenRead(pdfPath)
        Dim buffer(chunkSize - 1) As Byte
        Dim chunks As New List(Of Byte())()
        Dim bytesRead As Integer

        Do
            bytesRead = Await fileStream.ReadAsync(buffer, 0, buffer.Length)
            If bytesRead > 0 Then
                Dim chunk(bytesRead - 1) As Byte
                Array.Copy(buffer, chunk, bytesRead)
                chunks.Add(chunk)
            End If
        Loop While bytesRead > 0
    End Using

    Await ProcessPdfChunks(chunks)
End Function
$vbLabelText   $csharpLabel

このアプローチでは、大きな PDF ファイルをチャンクで読み込むため、メモリの問題が防止され、大きなドキュメントでもスムーズなパフォーマンスが保証されます。 これは、モバイル デバイスやリソースが限られたシステム上で PDF ファイルを処理する場合に特に便利です。 追加のチューニング オプションについては、 IronPDF のパフォーマンス ガイドを参照してください。

その他の最適化戦略には、Web を高速に表示するための線形化、ファイル サイズを縮小するための圧縮、複数の PDF を同時に処理するための非同期処理などがあります。 PDF 協会のベスト プラクティスによると、線形化された (Web 向けに最適化された) PDF を使用すると、大きなドキュメントの初期読み込み時間を 30 ~ 60% 短縮できます。

どのファイル サイズにチャンク ロードが必要ですか?

PDFファイルサイズの読み込み戦略ガイド
ファイルサイズ 積載戦略 メモリへの影響
5 MB未満 直接読み込み 最小限
5~20MB オプションのチャンク 適度
20~50MB 推奨チャンク 重要な
50MB以上 必要なチャンク 致命的

サーバー側レンダリングは、100 MB を超える PDF を処理する場合、複雑な注釈を実装する場合、または複数の同時ユーザーをサポートする場合に役立ちます。

パスワードで保護されたファイルに対してBlazor PDF ビューアーをどのように保護しますか?

パスワードで保護された PDF ファイルを操作する場合は、パスワードを PdfDocument.FromFile に直接渡し、適切な HTTP セキュリティ ヘッダーを構成します。

private async Task LoadSecurePdf(string password)
{
    var pdfDocument = PdfDocument.FromFile("secure.pdf", password);

    var headers = new Dictionary<string, string>
    {
        { "X-Frame-Options", "SAMEORIGIN" },
        { "Content-セキュリティ-Policy", "default-src 'self'" },
        { "X-Content-Type-Options", "nosniff" },
        { "Referrer-Policy", "no-referrer" }
    };

    await DisplayPdfContent(pdfDocument);
}
private async Task LoadSecurePdf(string password)
{
    var pdfDocument = PdfDocument.FromFile("secure.pdf", password);

    var headers = new Dictionary<string, string>
    {
        { "X-Frame-Options", "SAMEORIGIN" },
        { "Content-セキュリティ-Policy", "default-src 'self'" },
        { "X-Content-Type-Options", "nosniff" },
        { "Referrer-Policy", "no-referrer" }
    };

    await DisplayPdfContent(pdfDocument);
}
Imports System.Collections.Generic
Imports System.Threading.Tasks

Private Async Function LoadSecurePdf(password As String) As Task
    Dim pdfDocument = PdfDocument.FromFile("secure.pdf", password)

    Dim headers As New Dictionary(Of String, String) From {
        {"X-Frame-Options", "SAMEORIGIN"},
        {"Content-セキュリティ-Policy", "default-src 'self'"},
        {"X-Content-Type-Options", "nosniff"},
        {"Referrer-Policy", "no-referrer"}
    }

    Await DisplayPdfContent(pdfDocument)
End Function
$vbLabelText   $csharpLabel

このコードは、適切なヘッダー構成を通じてセキュリティを維持しながら、パスワードで保護された PDF ドキュメントを読み込む方法を示しています。 認証を強化するためにデジタル署名を検討してください。 潜在的に悪意のあるコンテンツを削除し、機密情報を編集するためにPDF サニタイズを実装します。

パスワードを扱うときは、決してプレーンテキストやクライアント側コードで保存しないでください。 適切な検証を伴う安全な入力方法を使用し、機密文書に対してセッション タイムアウトを実装し、使用後はメモリからパスワードを消去します。 Microsoft のASP.NET Coreセキュリティ ガイダンスでは、ユーザーが入力した資格情報を下流の API に渡す前に常に検証およびサニタイズすることを推奨しています。

クライアント側とサーバー側の復号化

PDF復号化アプローチのセキュリティ比較
復号化タイプ 使用事例 セキュリティレベル
クライアント側 公文書 低い
サーバー側 機密データ 高い
ハイブリッド 混合コンテンツ 中くらい

セキュリティを最大限に高めるには、常にサーバー側で復号化を実行し、復号化されたコンテンツをクライアントに安全にストリーミングします。 長期アーカイブのニーズに対応するためにPDF/A 準拠を実装します。

Blazorで PDF を表示するための重要なポイントは何ですか?

IronPDFを使用してBlazor PDF ビューアを実装すると、開発者は Web アプリケーションで PDF を表示するための完全なソリューションを利用できるようになります。 基本的な表示からフォームの入力や注釈などの高度な機能まで、IronPDF のPDF ビューア コンポーネントは、プロフェッショナル アプリケーションに必要な機能を提供します。

ここに示す例は、さまざまな PDF ソースを処理し、インタラクティブな機能を提供し、優れたパフォーマンスを維持する信頼性の高いBlazor PDF ビューアを作成する方法を示しています。 シンプルなドキュメント ビューアーを構築する場合でも、複雑なドキュメント管理システムを構築する場合でも、IronPDF とBlazor Server アプリの統合により、プロフェッショナルな PDF 表示機能を簡単に実装できます。

主な利点は次のとおりです:

  • すべてのブラウザで一貫したレンダリングを実現するクロスプラットフォームの互換性
  • 機密文書のための高度なセキュリティ機能
  • 非同期およびチャンクロードによる大容量ファイルのパフォーマンス最適化
  • デジタル署名を含む完全なフォーム処理機能
  • 既存 for .NETアプリケーションとのスムーズな統合

IronPDF は、Azure、AWS、Docker、従来の Windows 環境をサポートしています。 独自のビューアを構築する準備はできましたか? IronPDFの無料トライアルを開始し、完全なドキュメントコード例を参照して、 Blazorアプリケーションで効果的な PDF 表示エクスペリエンスを作成してください。

よくある質問

IronPDF を使用して Blazor アプリケーションで PDF をどのように表示できますか?

IronPDF は、Blazor アプリケーション内で PDF をレンダリングおよび表示できる包括的な API を提供します。IronPDF を統合することで、強力な PDF ビューア コンポーネントを簡単に実装できます。

Blazor PDFビューイングにIronPDFを使用する利点は何ですか?

Blazor PDF 表示で IronPDF を使用することで、フォーム フィールドの処理、インタラクティブ ビューアの作成、高品質な PDF のシームレスなレンダリングなどのメリットを享受できます。

Blazor で IronPDF を使用して PDF のフォームフィールドを処理できますか?

はい、IronPDFはBlazorアプリケーション内でPDF文書のフォームフィールドを処理および操作することを可能にし、インタラクティブ性とユーザーエンゲージメントを向上させます。

IronPDF を使用して Blazor でインタラクティブな PDF ビューアを作成できますか?

もちろんです。IronPDF は、フォーム処理や動的コンテンツ表示などの機能を可能にする、Blazor でインタラクティブな PDF ビューアを作成するためのツールを提供します。

IronPDF は Blazor の PDF 操作にどのような機能を提供しますか?

IronPDF には、PDF レンダリング、フォームフィールド処理、テキスト抽出、ページ操作などの機能があり、Blazor での PDF 操作において多用途の選択肢となります。

IronPDF は Blazor アプリケーションの PDF 表示体験をどのように向上させますか?

IronPDF は、スムーズなレンダリング、インタラクティブな機能、PDF ドキュメントの堅牢な処理を提供することで、Blazor アプリケーションでの PDF 表示体験を向上させます。

カーティス・チャウ
テクニカルライター

Curtis Chauは、カールトン大学でコンピュータサイエンスの学士号を取得し、Node.js、TypeScript、JavaScript、およびReactに精通したフロントエンド開発を専門としています。直感的で美しいユーザーインターフェースを作成することに情熱を持ち、Curtisは現代のフレームワークを用いた開発や、構造の良い視覚的に魅力的なマニュアルの作成を楽しんでいます。

開発以外にも、CurtisはIoT(Internet of Things)への強い関心を持ち、ハードウェアとソフトウェアの統合方法を模索しています。余暇には、ゲームをしたりDiscordボットを作成したりして、技術に対する愛情と創造性を組み合わせています。

アイアンサポートチーム

私たちは週5日、24時間オンラインで対応しています。
チャット
メール
電話してね