Blazor PDF 檢視器教程

介紹

Adobe 創建了可攜式文檔格式 (PDF)，廣泛用於發布格式化文本和圖像。在本教程中，推薦將 IronPDF 集成到一個 Blazor 伺服器端應用程式 顯示 PDF 因為它易於使用且效率高。

1. IronPDF 功能

借助強大的 IronPDF PDF .NET 庫，開發人員可以輕鬆地創建、閱讀和修改 PDF 文件。基於 內建的 Chrome 引擎, IronPDF 包含廣泛實用且強大的功能，例如將 HTML5、JavaScript、CSS 和圖像轉換為 PDF 的功能，添加自訂頁首和頁尾至 PDF 的功能，並且能創建與網頁瀏覽器中完全相符的 PDF。

IronPDF 支援多種網頁技術，包括 HTML、ASPX、Razor 視圖和 MVC。以下是 IronPDF 的主要特點：

• IronPDF 在 .NET C# 應用程式中，提供對 PDF 檔案創建和修改的全面控制
• IronPDF 能 從網址生成網頁的 PDF 文件 使用特定的User-Agent、Proxy、Header和Cookie配置。
• IronPDF可以從現有的PDF文檔中刪除圖片
• IronPDF可以添加文本、照片、書籤 浮水印, 以及其他元素轉換為 PDF 文件
• IronPDF 擁有多種功能，可以 合併與拆分 一個或多個 PDF 文件輕鬆
• IronPDF 可以理解和渲染網頁媒體資源，例如 CSS 和 JavaScript
• IronPDF 支援各種 .NET 桌面和 MVC 網頁應用程式框架，包括 ASP.NET 和 Blazor

2. 什麼是 Blazor？

Blazor 是一個實驗性的 Web 應用框架，它使得用戶可以使用 C# 和 HTML 透過 Web Assembly 來創建客戶端 Web 應用。

Web Assembly 應用程式以二進制指令格式發送到瀏覽器，可以以接近本機速度運行。這為像 C# 這樣的語言在瀏覽器內運行創造了新的可能性。

在 Visual Studio 創建新專案

首先，打開 Microsoft Visual Studio 應用程式，從檔案選單中選擇“新建專案”。然後，選擇“Blazor 伺服器應用程式”。

在 Visual Studio 中创建新项目

输入项目名称并选择文件路径。然后，点击 Create 按钮。

在 Visual Studio 中建立新專案

另外，選擇所需的 .NET Framework。建議使用最新版本以確保穩定性。

選擇 .NET 6.0 架構建立新的 Blazor Server 應用程式

Microsoft Visual Studio 現在會為新的 Blazor Server 應用程式生成結構。此專案將包含一系列的 .razor 檔案，您可以在其中輸入原始碼。

下一步將會把 IronPDF 程式庫新增到專案中。

3. 安裝 IronPDF 庫

可以通過四種方式下載和安裝 IronPDF 庫：

• 使用 Visual Studio 的 NuGet 套件管理器
• 使用 Visual Studio 的命令行
• 從 NuGet 網站直接下載
• 從 IronPDF 網站直接下載

3.1 使用 Visual Studio 的 NuGet 套件管理器

Visual Studio 提供了 NuGet 套件管理器來幫助直接將庫安裝到專案中。以下截圖顯示如何打開 NuGet 套件管理器。

存取 Visual Studio 的 NuGet 套件管理員

使用「瀏覽」標籤下的搜尋欄位，來搜尋「IronPDF」，如下圖所示：

在NuGet套件管理器GUI中搜尋IronPDF庫

上圖顯示了相關搜尋結果的列表。選擇所需的選項以將套件安裝到您的專案中。

3.2 使用 Visual Studio 命令行

在 Visual Studio 中，前往 工具 > NuGet 套件管理器 > 套件管理器控制台

在套件管理器控制台面板中输入以下行：

Install-Package IronPdf

這個軟體包現在將被下載並安裝到目前的專案中。

使用 NuGet 套件管理控制台安裝 IronPDF 程式庫

3.3 從 NuGet 網站直接下載

第三種安裝 IronPDF 程式庫的方法是直接從網站下載 NuGet 套件。

導航至 https://www.nuget.org/packages/IronPdf/

• 從右側菜單中點擊「下載套件」選項。
• 在您的文件系統上打開下載的套件。它將自動安裝。
• 重新加載解決方案並開始在您的項目中使用它。

3.4 直接從IronPDF網站下載

點擊此連結以 下載最新套件 直接來自IronPDF網站。

下載後，請按照以下步驟將套件添加到您的專案中：

• 在解決方案視窗中右鍵點擊專案。
• 選擇“引用”選項，然後導航到您先前下載的庫的位置。
• 點擊“確定”以將庫添加為引用。

4. 使用 Blazor 伺服器應用程式檢視 PDF 文件

本教程中將構建的 Blazor 應用程式，會從網頁的 URL 創建 PDF 文件並在客戶端的網頁瀏覽器中渲染。

使用 IronPDF，檢視 PDF 十分簡單。

將以下原始碼添加到相應的 .razor 文件中。

string _imgUrl = "";
private async Task ViewFile()
{
    var renderer = new IronPdf.ChromePdfRenderer();
    var pdf = renderer.RenderUrlAsPdf("https://localhost:7018/fetchdata");
    _imgUrl = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.Stream.ToArray())}";
}

string _imgUrl = "";
private async Task ViewFile()
{
    var renderer = new IronPdf.ChromePdfRenderer();
    var pdf = renderer.RenderUrlAsPdf("https://localhost:7018/fetchdata");
    _imgUrl = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.Stream.ToArray())}";
}

Private _imgUrl As String = ""
Private Async Function ViewFile() As Task
	Dim renderer = New IronPdf.ChromePdfRenderer()
	Dim pdf = renderer.RenderUrlAsPdf("https://localhost:7018/fetchdata")
	_imgUrl = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.Stream.ToArray())}"
End Function

以上代碼片段首先使用了 IronPDF 的 RenderUrlAsPdf 方法，從給定的 URL 下載 HTML 內容並轉換為 PDF 格式。之後，程式碼片段將生成的 PDF 內容呈現為原始 base64 數據字串並將其儲存在本地變數中。

為了方便，應用程式可以使用 IronPDF 的 保存為 方法 (可用於任何 ChromePdfRenderer 實例) 將生成的 PDF 文件保存在伺服器的文件系統上，以便稍後快速訪問。

下一段程式碼準備用於在客戶端瀏覽器上輸出的 base-64 PDF 數據。

@if (_imgUrl != string.Empty)
{
    <iframe src="@_imgUrl" style="width:750px;height:750px;" type="application/pdf"/>
}

@if (_imgUrl != string.Empty)
{
    <iframe src="@_imgUrl" style="width:750px;height:750px;" type="application/pdf"/>
}

'INSTANT VB WARNING: The following constructor is declared outside of its associated class:
'ORIGINAL LINE: if(_imgUrl != string.Empty)
Private Sub New(Optional _imgUrl (Not ByVal) As = String.Empty)
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <iframe src="@_imgUrl" style="width:750px;height:750px;" type="application/pdf"/>
	"width:750px;height:750px;" type="application/pdf"/>
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <iframe src="@_imgUrl" style="width:750px;height:750px;" type
	"@_imgUrl" style="width:750px;height:750px;" type
	<iframe src="@_imgUrl" style
End Sub

上述函式從 Blazor 伺服器端接收 base64 資料，並將其綁定到 iframe 元素的 src 屬性。在頁面加載時，這會觸發瀏覽器使用其內建的網頁檢視器來將 base64 內容呈現為適當的 PDF 文件。

以下是從 base64 字串渲染的 PDF 文件截圖。

在瀏覽器中查看 Blazor 應用程式生成的 PDF。這個 PDF 是由 IronPDF 創建並作為 base64 字串發送到瀏覽器的。

從 HTML 字串檢視 PDF 文件

以下是 IronPDF 如何從 HTML 標籤字串生成 PDF 文件的示例。

var pdf = new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("<h1>Hello world!!</h1>")

var pdf = new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("<h1>Hello world!!</h1>")

'INSTANT VB TODO TASK: The following line uses invalid syntax:
'var pdf = New IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("<h1>Hello world!!</h1>")

生成的 PDF 文件可以按照上一節中詳細說明的程序從客戶端瀏覽器查看。

結論

這篇文章展示了如何開發一個使用 IronPDF 程式庫從網頁生成 PDF 檔案並在使用者瀏覽器中顯示的 Blazor Web 應用程式。

IronPDF 不是開放原始碼，不過， 免費試用密鑰 允許您在生產環境中使用它而沒有浮水印。