IronPDF on Blazor Server App (HTML to PDF Tutorial)

ByChaknith Bin

January 25, 2023

Updated June 22, 2025

IronPDF is supported with .NET 6 and includes project types like Blazor. Using Visual Studio, you can add IronPDF to your Blazor Server App project and use it as demonstrated in the following example:

How to View PDFs in Blazor Server-side Applications

Install the HTML-to-PDF Library for Blazor Applications
Create a new Blazor Project in Visual Studio.
Convert the web pages by URL into PDF documents
Render the web pages into the client's web browser
View PDF documents from HTML strings

Create a new Blazor server project

Create a new project and select the type Blazor Server App.

Install IronPDF into your Blazor project

After you have created the project, follow the next steps to install the IronPDF library from NuGet within Visual Studio.

In the Solution Explorer window in Visual Studio, right-click References and choose Manage NuGet Packages.
Select Browse and search for IronPdf.
Select the latest version of the package, check the checkbox for your project, and click install.

Alternatively, you can use the .NET CLI to install it:

Install-Package IronPdf

Add New Razor Component

Once IronPDF is installed in your Blazor project, start by adding a new Razor Component. For this tutorial, we will name it "IronPdfComponent":

After that, update the code as follows:

@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

Add this JavaScript code to _layout.cshtml to allow downloading of the PDF rendered by IronPDF in the Blazor Application:

<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

Edit the NavMenu.razor file in the Shared folder to include a navigation tab to our new Razor component. Add the following code:

<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

Once this has all been applied, you can run your solution, and you should see this:

Frequently Asked Questions

How does a PDF library integrate with a Blazor Server App?

IronPDF is a library that enables PDF generation and manipulation in .NET applications, including Blazor Server Apps. It can be integrated into a Blazor Server App using Visual Studio and NuGet for HTML-to-PDF conversion.

How do I install a PDF library in a Blazor project?

To install IronPDF in a Blazor project, navigate to the Solution Explorer in Visual Studio, right-click 'References', select 'Manage NuGet Packages', search for 'IronPdf', and install the latest version. Alternatively, use the .NET CLI with the command 'dotnet add package IronPdf'.

What are the steps to create a new Blazor Server App for a PDF library?

To create a new Blazor Server App, open Visual Studio, create a new project, and select the Blazor Server App template. After setting up your project, you can integrate IronPDF to handle PDF generation.

How can I render HTML to PDF in a Blazor application using a PDF library?

After installing IronPDF, add a new Razor Component, inject IJSRuntime, and use IronPdf.ChromePdfRenderer to render HTML input into a PDF document. Implement JavaScript functions in _layout.cshtml to download the generated PDF.

How do I view PDFs in a Blazor Server-side application?

To view PDFs in a Blazor Server-side application, convert web pages by URL into PDF documents using IronPDF, then render these PDFs in the client's web browser.

What is the role of JavaScript in downloading PDFs in a Blazor application?

JavaScript is used to create a function that downloads the PDFs generated by IronPDF. It converts the PDF content to a Blob and programmatically clicks an anchor element to initiate the download, ensuring the PDF is saved on the user's device.

How do I add a navigation tab for the PDF component in a Blazor app?

To add a navigation tab for the IronPDF component, edit the NavMenu.razor file in the Shared folder and include a NavLink element directing to the IronPdf route.

What is a Razor Component in the context of Blazor and a PDF library?

A Razor Component in Blazor is a reusable piece of UI defined in .razor files. In the context of IronPDF, it is used to handle the user interface and logic for converting HTML input into a PDF.

Chaknith Bin

Chat with engineering team now

Software Engineer

Chaknith works on IronXL and IronBarcode. He has deep expertise in C# and .NET, helping improve the software and support customers. His insights from user interactions contribute to better products, documentation, and overall experience.