跳過到頁腳內容
使用IRONPDF

如何用IronPDF在Blazor中顯示PDF

要在 Blazor 應用程式中顯示 PDF,請使用 IronPDF 的 PDF 檢視器元件,該元件與 Blazor Server 應用程式集成,並提供高效能的 PDF 渲染,具有表單填寫、註釋和行動支援等功能——所有這些都無需依賴第三方瀏覽器工具。

為什麼 Blazor 應用程式需要專用的 PDF 檢視器?

在現代 Web 應用程式中顯示 PDF 需要一個可靠的檢視器元件,該元件的功能超越了瀏覽器的基本功能。 對於建立 Blazor 應用程式的 .NET 開發人員來說, IronPDF提供了一個有效的 PDF 檢視器解決方案,可與您的Blazor Server 應用程式整合。 這樣一來,無需依賴第三方瀏覽器工具,即可實現高效能的 PDF 渲染和豐富的功能。

不同瀏覽器和平台對原生瀏覽器 PDF 的支援程度差異很大,導致使用者體驗不一致。 透過在 Blazor 應用程式中實作自訂 PDF 檢視器,您可以完全控制檢視體驗,確保在所有平台上實現一致的功能。 對於需要符合合規標準和進階安全功能的應用來說,這一點尤其重要。

Blazor 框架——基於微軟的 ASP.NET Core建置——支援基於元件的開發,可以與 PDF 作業庫自然地結合使用。 與其從外部 CDN 嵌入第三方檢視器小部件,不如建立一個根據應用程式的特定需求量身定制的元件。

如何在 Blazor 專案中安裝 IronPDF?

在部署 Blazor PDF 檢視器之前,請先安裝 IronPDF。 透過 NuGet,使用套件管理器控制台或 .NET CLI 將其新增至 Blazor Server 應用程式:

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

接下來,建立一個新的 Blazor 應用程序,並確保已安裝最新版本的 .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 轉 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 InteractiveServer

<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 檢視器元件,該元件會載入 PDF 文件並使用 iframe 顯示它。 LoadPdfDocument 方法從 wwwroot 資料夾讀取 PDF 文件,並將其轉換為 iframe 直接渲染的 base64 資料 URL。 這種方法適用於各種 PDF 版本,並支援國際文件的 UTF-8 編碼。

組件如何載入 PDF 文件?

此組件利用 IronPDF 的文件載入功能有效率地讀取 PDF 文件。 當使用者點擊"開啟檔案"按鈕時,該方法:

  1. 使用 PdfDocument.FromFile載入 PDF 文件
  2. 從載入的 PDF 文件中提取二進位數據 3.轉換為 Base64格式以相容瀏覽器。 4.建立瀏覽器可以直接渲染的資料 URL

這種方法既能確保在不同瀏覽器上的相容性,又能保持良好的 PDF 顯示效能。 此組件可以處理各種紙張尺寸和頁面方向

輸出

! Blazor PDF 檢視器元件的螢幕截圖,顯示了一個包含"什麼是 PDF?"內容的範例 PDF,其中顯示了導航控制項、縮放選項和"開啟檔案"按鈕。

如何使用 JavaScript 互通來改善 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 IronPdf
Imports Microsoft.AspNetCore.Components
Imports Microsoft.AspNetCore.Components.Web
Imports Microsoft.JSInterop

@page "/pdf-jsinterop"
@rendermode InteractiveServer
@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 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

此 JavaScript 函數從 PDF 資料建立一個 blob,產生一個物件 URL,並將一個 iframe 附加到容器中。 該技術支援JavaScript 渲染和複雜文件的自訂渲染延遲。

輸出

IronPDF JavaScript 互通檢視器介面顯示了一個 PDF 文檔,其中包含"什麼是 PDF?"的內容,示範了 JavaScript Blob/ObjectURL PDF 渲染功能。

如何從多個來源載入 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 文檔,而 LoadFromHtmlContent 則展示如何即時將 HTML 轉換為 PDF 。 Chrome渲染引擎可確保HTML轉換的準確性。 其他來源選項包括 Azure Blob 儲存體、資料庫記憶體流DOCX 文件

哪種資料來源方法最適合您的使用場景?

Blazor 應用程式的 PDF 來源方法
來源類型 最適合 表現 安全性
本地文件 靜態內容 出色的 低的
網址 外部文件 好的 中等的
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。

輸出

這是一個功能齊全的 PDF 檢視器元件,採用 Blazor 構建,顯示文件導航控制項、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 的效能指南

其他最佳化策略包括線性化以實現更快的網頁瀏覽速度,壓縮以減小檔案大小,以及非同步處理以同時處理多個 PDF 檔案。 根據PDF 協會的最佳實踐,線性化(網路最佳化)PDF 可以將大型文件的初始載入時間減少 30% 至 60%。

什麼大小的檔案需要分塊載入?

PDF 檔案大小載入策略指南
文件大小 裝載策略 記憶體影響
小於 5 MB 直接裝載 極簡主義
5-20 MB 可選分塊 緩和
20-50 MB 推薦分塊 重要的
超過 50 MB 需要分塊 批判的

當處理大於 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);
}
Private Async Function LoadSecurePdf(password As String) As Task
    Dim pdfDocument = PdfDocument.FromFile("secure.pdf", password)

    Dim headers = 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文件進行清理,以刪除潛在的惡意內容並編輯敏感資訊。

處理密碼時,切勿以明文或客戶端代碼形式儲存。 使用安全的輸入法並進行適當的驗證,對敏感文件實施會話逾時,並在使用後清除記憶體中的密碼。 微軟的ASP.NET Core 安全指南建議,在將使用者提供的任何憑證傳遞給下游 API 之前,請務必對其進行驗證和清理。

客戶端解密與伺服器端解密

PDF解密方法安全性比較
解密類型 用例 安全等級
客戶端 公開文件 低的
伺服器端 敏感數據 高的
雜交種 混合內容 中等的

為了最大限度地提高安全性,始終在伺服器端執行解密,並將解密後的內容安全地傳輸到客戶端。 為滿足長期存檔需求,實施PDF/A 合規性

在 Blazor 中顯示 PDF 的關鍵要點是什麼?

使用 IronPDF 實作 Blazor PDF 檢視器,可為開發人員提供在 Web 應用程式中顯示 PDF 的完整解決方案。 從基本顯示到表單填寫和註釋等進階功能,IronPDF 的PDF 檢視器元件提供了專業應用程式所需的功能。

所示範例示範如何建立一個可靠的 Blazor PDF 檢視器,該檢視器可以處理各種 PDF 來源,提供互動式功能,並保持良好的效能。 無論是建立簡單的文件檢視器還是複雜的文件管理系統,IronPDF 與Blazor Server 應用程式的整合都使得實現專業的 PDF 檢視功能變得簡單易行。

主要優勢包括:

-跨平台相容性,在所有瀏覽器上都能保持一致的渲染效果

  • 針對敏感檔案的進階安全功能
  • 透過非同步和分塊載入優化大檔案的效能 -具備完整的表單處理功能,包括數位簽名
  • 與現有 .NET 應用程式無縫集成

IronPDF 支援 Azure、AWS、Docker 和傳統 Windows 環境。 準備好建立自己的檢視器了嗎? 首先,您可以免費試用 IronPDF ,並查閱完整的文件程式碼範例,以便在 Blazor 應用程式中建立有效的 PDF 檢視體驗。

常見問題解答

我如何使用 IronPDF 在 Blazor 應用程式中顯示 PDF?

IronPDF 提供了一個全面的 API,允許您在 Blazor 應用程式中渲染和顯示 PDF。通過整合 IronPDF,您可以輕鬆實施強大的 PDF 檢視元件。

使用 IronPDF 進行 Blazor PDF 檢視有哪些好處?

使用 IronPDF 進行 Blazor PDF 檢視的好處包括處理表單字段、創建互動檢視器,並在應用程式中無縫渲染高品質的 PDF。

是否可以使用 IronPDF 在 Blazor 中處理 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
技術作家

Curtis Chau 擁有卡爾頓大學計算機科學學士學位,專注於前端開發,擅長於 Node.js、TypeScript、JavaScript 和 React。Curtis 熱衷於創建直觀且美觀的用戶界面,喜歡使用現代框架並打造結構良好、視覺吸引人的手冊。

除了開發之外,Curtis 對物聯網 (IoT) 有著濃厚的興趣,探索將硬體和軟體結合的創新方式。在閒暇時間,他喜愛遊戲並構建 Discord 機器人,結合科技與創意的樂趣。

鋼鐵支援團隊

我們每週 5 天,每天 24 小時在線上。
聊天
電子郵件
打電話給我