如何使用 IronPDF 与 Blazor 进行 PDF 生成 | IronPDF

IronPDF on Blazor Server App (HTML to PDF Tutorial)

This article was translated from English: Does it need improvement?
Translated
View the article in English

IronPDF支持.NET 6,并包含诸如Blazor之类的项目类型。 使用Visual Studio,您可以将IronPDF添加到Blazor服务器应用项目中,并按以下示例使用它:

快速入门:在Blazor服务器中轻松渲染PDF

快速开始在您的Blazor服务器应用中使用IronPDF。 本示例演示了如何以最少的设置将HTML内容渲染为PDF。只需几行代码,即可将您的Blazor组件转换为专业外观的PDF。 对于希望在其Blazor项目中无缝集成PDF功能的开发人员来说,这是理想的选择。

Nuget IconGet started making PDFs with NuGet now:

  1. Install IronPDF with NuGet Package Manager

    PM > Install-Package IronPdf

  2. Copy and run this code snippet.

    IronPdf.HtmlToPdf.RenderHtmlAsPdf(htmlContent).SaveAs(outputPath);
  3. Deploy to test on your live environment

    Start using IronPDF in your project today with a free trial
    arrow pointer
class="hsg-featured-snippet">

最小化工作流程(5个步骤)

  1. 安装Blazor应用的HTML到PDF库
  2. 在Visual Studio中创建一个新的Blazor项目。
  3. 通过URL将网页转换为PDF文档
  4. 在客户端的浏览器中渲染网页
  5. 从HTML字符串查看PDF文档

创建一个新的Blazor服务器项目

新建一个项目并选择Blazor服务器应用类型。

class="content-img-align-center">
class="center-image-wrapper"> Blazor创建项目图像

将IronPDF安装到您的Blazor项目中

在创建项目后,按照以下步骤在Visual Studio中从NuGet安装IronPDF库

  1. 在Visual Studio的解决方案资源管理器窗口中,右键单击References并选择管理NuGet包
  2. 选择浏览并搜索IronPdf
  3. 选择软件包的最新版本,勾选您的项目复选框,然后单击安装。

或者,您可以使用.NET CLI来安装它:

Install-Package IronPdf

添加新Razor组件

一旦IronPDF安装在您的Blazor项目中,首先添加一个新的Razor组件。 在本教程中,我们将其命名为"IronPdfComponent":

class="content-img-align-center">
class="center-image-wrapper"> Blazor IronPDF组件图像

之后,更新代码如下:

@page "/IronPdf"
@inject IJSRuntime JS

<h3>IronPdfComponent</h3>

<EditForm Model="@_InputMsgModel" id="inputText">
  <div>
    <InputTextArea @bind-Value="@_InputMsgModel.HTML" rows="20" />
  </div>
  <div>
    <button type="button" @onclick="@SubmitHTML">Render HTML</button>
  </div>
</EditForm>
@page "/IronPdf"
@inject IJSRuntime JS

<h3>IronPdfComponent</h3>

<EditForm Model="@_InputMsgModel" id="inputText">
  <div>
    <InputTextArea @bind-Value="@_InputMsgModel.HTML" rows="20" />
  </div>
  <div>
    <button type="button" @onclick="@SubmitHTML">Render HTML</button>
  </div>
</EditForm>
HTML
@code {

    // Model to bind user input
    private InputHTMLModel _InputMsgModel = new InputHTMLModel();

    private async Task SubmitHTML()
    {
        // Set your IronPDF license key
        IronPdf.License.LicenseKey = "IRONPDF-MYLICENSE-KEY-1EF01";

        // Create a renderer to convert HTML to PDF
        var render = new IronPdf.ChromePdfRenderer();

        // Render the HTML input into a PDF document
        var doc = render.RenderHtmlAsPdf(_InputMsgModel.HTML);

        var fileName = "iron.pdf";

        // Create a stream reference for the PDF content
        using var streamRef = new DotNetStreamReference(stream: doc.Stream);

        // Invoke JavaScript function to download the PDF in the browser
        await JS.InvokeVoidAsync("SubmitHTML", fileName, streamRef);
    }

    public class InputHTMLModel
    {
        public string HTML { get; set; } = "My new message";
    }
}
@code {

    // Model to bind user input
    private InputHTMLModel _InputMsgModel = new InputHTMLModel();

    private async Task SubmitHTML()
    {
        // Set your IronPDF license key
        IronPdf.License.LicenseKey = "IRONPDF-MYLICENSE-KEY-1EF01";

        // Create a renderer to convert HTML to PDF
        var render = new IronPdf.ChromePdfRenderer();

        // Render the HTML input into a PDF document
        var doc = render.RenderHtmlAsPdf(_InputMsgModel.HTML);

        var fileName = "iron.pdf";

        // Create a stream reference for the PDF content
        using var streamRef = new DotNetStreamReference(stream: doc.Stream);

        // Invoke JavaScript function to download the PDF in the browser
        await JS.InvokeVoidAsync("SubmitHTML", fileName, streamRef);
    }

    public class InputHTMLModel
    {
        public string HTML { get; set; } = "My new message";
    }
}
code
If True Then

	' Model to bind user input
	private InputHTMLModel _InputMsgModel = New InputHTMLModel()

'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'	private async Task SubmitHTML()
'	{
'		' Set your IronPDF license key
'		IronPdf.License.LicenseKey = "IRONPDF-MYLICENSE-KEY-1EF01";
'
'		' Create a renderer to convert HTML to PDF
'		var render = New IronPdf.ChromePdfRenderer();
'
'		' Render the HTML input into a PDF document
'		var doc = render.RenderHtmlAsPdf(_InputMsgModel.HTML);
'
'		var fileName = "iron.pdf";
'
'		' Create a stream reference for the PDF content
'		var streamRef = New DotNetStreamReference(stream: doc.Stream);
'
'		' Invoke JavaScript function to download the PDF in the browser
'		await JS.InvokeVoidAsync("SubmitHTML", fileName, streamRef);
'	}

'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'	public class InputHTMLModel
'	{
'		public string HTML
'		{
'			get;
'			set;
'		} = "My new message";
'	}
End If
$vbLabelText   $csharpLabel

将此JavaScript代码添加到_layout.cshtml中,以允许在Blazor应用中下载IronPDF渲染的PDF。

<script>
    // JavaScript function to download PDFs generated by IronPdf
    window.SubmitHTML = async (fileName, contentStreamReference) => {
        // Get the PDF content as an ArrayBuffer
        const arrayBuffer = await contentStreamReference.arrayBuffer();

        // Create a Blob from the ArrayBuffer
        const blob = new Blob([arrayBuffer]);

        // Create an object URL for the Blob
        const url = URL.createObjectURL(blob);

        // Create an anchor element to initiate the download
        const anchorElement = document.createElement("a");
        anchorElement.href = url;
        anchorElement.download = fileName ?? "download.pdf";

        // Programmatically click the anchor to start the download
        anchorElement.click();

        // Clean up by removing the anchor and revoking the object URL
        anchorElement.remove();
        URL.revokeObjectURL(url);
    };
</script>
<script>
    // JavaScript function to download PDFs generated by IronPdf
    window.SubmitHTML = async (fileName, contentStreamReference) => {
        // Get the PDF content as an ArrayBuffer
        const arrayBuffer = await contentStreamReference.arrayBuffer();

        // Create a Blob from the ArrayBuffer
        const blob = new Blob([arrayBuffer]);

        // Create an object URL for the Blob
        const url = URL.createObjectURL(blob);

        // Create an anchor element to initiate the download
        const anchorElement = document.createElement("a");
        anchorElement.href = url;
        anchorElement.download = fileName ?? "download.pdf";

        // Programmatically click the anchor to start the download
        anchorElement.click();

        // Clean up by removing the anchor and revoking the object URL
        anchorElement.remove();
        URL.revokeObjectURL(url);
    };
</script>
JAVASCRIPT

编辑共享文件夹中的NavMenu.razor文件,以包含到我们新Razor组件的一个导航选项卡。 添加以下代码:

<div class="nav-item px-3">
    <NavLink class="nav-link" href="IronPdf">
        <span class="oi oi-list-rich" aria-hidden="true"></span> IronPdf
    </NavLink>
</div>
<div class="nav-item px-3">
    <NavLink class="nav-link" href="IronPdf">
        <span class="oi oi-list-rich" aria-hidden="true"></span> IronPdf
    </NavLink>
</div>
HTML

一旦这一切都应用,您可以运行您的解决方案,您应该会看到如下所示:

class="content-img-align-center">
class="center-image-wrapper"> Blazor IronPDF运行页面图像

常见问题解答

PDF 库如何与 Blazor Server 应用程序集成?

IronPDF 能够在 .NET 应用程序中实现 PDF 生成和操作,包括 Blazor Server 应用程序。它可以通过 Visual Studio 和 NuGet 集成进行 HTML 转 PDF 转换。

如何在 Blazor 项目中安装 PDF 库?

要在 Blazor 项目中安装 IronPDF,请在 Visual Studio 中导航到解决方案资源管理器,右键单击“引用”,选择“管理 NuGet 包”,搜索“IronPdf”并安装。或者,使用 .NET CLI 输入 dotnet add package IronPdf

创建一个适用于 PDF 库的新 Blazor Server 应用程序的步骤是什么?

要创建新的 Blazor Server 应用程序,打开 Visual Studio,创建新项目,并选择 Blazor Server 应用程序模板。设置项目后,集成 IronPDF 以处理 PDF 生成。

如何在 Blazor 应用程序中使用 PDF 库将 HTML 渲染为 PDF?

安装 IronPDF 后,添加新的 Razor 组件,注入 IJSRuntime,并使用 IronPdf.ChromePdfRenderer 将 HTML 输入渲染为 PDF 文档。在 _layout.cshtml 实现 JavaScript 函数以下载生成的 PDF。

如何在 Blazor 服务端应用程序中查看 PDF?

要在 Blazor 服务端应用程序中查看 PDF,请使用 IronPDF 将网页通过 URL 转换为 PDF 文档,然后在客户端的网页浏览器中渲染这些 PDF。

JavaScript 在 Blazor 应用程序中下载 PDF 的作用是什么?

JavaScript 用于创建一个下载由 IronPDF 生成的 PDF 的函数。它将 PDF 内容转换为 Blob,并通过编程方式点击锚元素启动下载,确保 PDF 保存到用户设备。

如何在 Blazor 应用中为 PDF 组件添加导航选项卡?

要为 PDF 组件添加导航选项卡,请编辑 Shared 文件夹中的 NavMenu.razor 文件,并包含一个指向 PDF 路由的 NavLink 元素。

在 Blazor 和 PDF 库背景下,什么是 Razor 组件?

Blazor 中的 Razor 组件是定义在 .razor 文件中的可重用 UI 片段。在 IronPDF 的背景下,它用于处理用户界面和将 HTML 输入转换为 PDF 的逻辑。

如何排除 Blazor 中生成 PDF 的问题?

如果在 Blazor 中遇到 PDF 生成问题,请检查 IronPDF 是否正确安装,以及 HTML 输入是否有效。确保 JavaScript 函数正确设置以处理文件下载。

我可以在 Blazor 应用程序中将整页网页转换为 PDF 吗?

可以,IronPDF 允许你通过 URL 转换功能在 Blazor 应用程序中将整页网页转换为 PDF。

使用 IronPDF 构建 Blazor 应用程序时,它是否与 .NET 10 兼容?

是的。IronPDF 完全兼容 .NET 10,支持其运行时、ASP.NET Core 和 Blazor 功能。它可在 .NET 10 项目中开箱即用,并受益于性能提升和增强的语言特性。([ironpdf.com](https://ironpdf.com/?utm_source=openai))

Curtis Chau
技术作家

Curtis Chau 拥有卡尔顿大学的计算机科学学士学位,专注于前端开发,精通 Node.js、TypeScript、JavaScript 和 React。他热衷于打造直观且美观的用户界面,喜欢使用现代框架并创建结构良好、视觉吸引力强的手册。

除了开发之外,Curtis 对物联网 (IoT) 有浓厚的兴趣,探索将硬件和软件集成的新方法。在空闲时间,他喜欢玩游戏和构建 Discord 机器人,将他对技术的热爱与创造力相结合。

准备开始了吗?
Nuget 下载 16,154,058 | 版本: 2025.11 刚刚发布