Message icon
Skip to footer content
  1. IronPDF
  2. IronPDF Blog
  3. Using IronPDF
  4. Blazor PDF Viewer
USING IRONPDF

How to Build a Blazor PDF Viewer with IronPDF

Curtis Chau
Curtis Chau
Updated:

A Blazor PDF viewer renders PDF documents inline by converting them to a base64 data URI and loading the result in an <iframe> element. IronPDF's ChromePdfRenderer converts HTML strings, live URLs, or dynamic content into PDF bytes in a single async call, giving Blazor Server and Blazor WebAssembly applications full PDF generation and display capability without external viewer plugins.

Business applications regularly need to display invoices, contracts, and reports without redirecting users to a separate tab or relying on browser PDF support that varies across devices. Blazor's component model makes it straightforward to generate a PDF on the server, encode it, and stream it into any page component, provided the library handles the conversion reliably.

This guide covers installation, URL and HTML-based rendering, customization with headers and footers, browser downloads using JavaScript interop, a comparison of Blazor Server and Blazor WebAssembly approaches, and four extended operations: merging, annotations, password protection, and user-uploaded file display. Razor components and equivalent top-level C# examples are provided for each technique.

Start a free IronPDF trial to follow along with the examples in this guide.

How Do I Get Started with IronPDF in a Blazor Project?

Getting started requires installing the NuGet package and adding a license key to Program.cs. Install IronPDF from the Package Manager Console:

Install-Package IronPdf

Alternatively, search for "IronPdf" in the NuGet Package Manager UI and select the latest version.

NuGet Install with NuGet

PM >  Install-Package IronPdf

Check out IronPDF on NuGet for quick installation. With over 10 million downloads, it’s transforming PDF development with C#. You can also download the DLL or Windows installer.

After installation, add your license key to Program.cs before any PDF operations:

IronPdf.License.LicenseKey = "YOUR-LICENSE-KEY-HERE";
IronPdf.License.LicenseKey = "YOUR-LICENSE-KEY-HERE";
$vbLabelText   $csharpLabel

IronPDF is compatible with .NET 10, .NET 9, .NET 8, .NET 6, and .NET Framework 4.6.2 and later. For development and testing, the library functions without a license key but stamps a watermark on generated PDFs. A free trial license removes the watermark during evaluation.

IronPDF supports both Blazor Server and Blazor WebAssembly projects. In Blazor Server, the rendering engine runs directly on the server. In Blazor WebAssembly, PDF generation requires a server-side API endpoint; the architecture section later in this guide explains both approaches.

How Can I Display a PDF File from a URL in Blazor?

The most direct way to create a Blazor PDF viewer is to convert a URL into a PDF and display it in an <iframe>. IronPDF's ChromePdfRenderer fetches the webpage and converts it to PDF format using the same Chrome rendering engine that powers Google Chrome, preserving CSS, JavaScript output, and layout faithfully.

Razor Component Approach

The following Razor component converts a URL to a PDF and displays it inline. The GeneratePdf method runs on the server in a Blazor Server app, so the full Chrome rendering engine is available:

@page "/pdfviewer"
@using IronPdf

<h3>PDF Viewer</h3>
<button @onclick="GeneratePdf" class="btn btn-primary">Load PDF</button>
@if (!string.IsNullOrEmpty(pdfDataUri))
{
    <iframe src="@pdfDataUri" style="width:100%; height:600px; border:1px solid #ccc; margin-top:20px;"></iframe>
}

@code {
    private string pdfDataUri = string.Empty;

    private async Task GeneratePdf()
    {
        var renderer = new ChromePdfRenderer();
        // Convert the URL to PDF using the Chrome rendering engine
        var pdf = await renderer.RenderUrlAsPdfAsync("https://ironpdf.com");
        // Encode the PDF bytes as a base64 data URI for iframe display
        var base64 = Convert.ToBase64String(pdf.BinaryData);
        pdfDataUri = $"data:application/pdf;base64,{base64}";
    }
}

Top-Level C# Example

For background services, console apps, or server-side API endpoints, the same conversion uses identical API calls outside of any component context:

using IronPdf;

var renderer = new ChromePdfRenderer();
// Fetch and convert the target URL to a PDF document
var pdf = await renderer.RenderUrlAsPdfAsync("https://ironpdf.com");

// Save to disk or use BinaryData for in-memory operations
pdf.SaveAs("output.pdf");
byte[] pdfBytes = pdf.BinaryData;
using IronPdf;

var renderer = new ChromePdfRenderer();
// Fetch and convert the target URL to a PDF document
var pdf = await renderer.RenderUrlAsPdfAsync("https://ironpdf.com");

// Save to disk or use BinaryData for in-memory operations
pdf.SaveAs("output.pdf");
byte[] pdfBytes = pdf.BinaryData;
$vbLabelText   $csharpLabel

RenderUrlAsPdfAsync fetches the page, executes all JavaScript, applies CSS, and returns a PdfDocument object containing the rendered output. The BinaryData property exposes the raw PDF bytes for storage, streaming, or display. The <iframe> displays the output with a built-in browser toolbar for zoom, navigation, and printing.

How to Create a Blazor PDF Viewer Using IronPDF: Figure 1 - URL to PDF PDF viewer output

How Do I Customize PDF Generation?

IronPDF provides output control through the ChromePdfRenderOptions class. You can set paper size, adjust margins, and add text or HTML headers and footers to every page. The rendering options guide covers the complete list of available properties.

Razor Component Approach

The following component configures A4 paper with margins and adds header and footer text to each page. Assign RenderingOptions before calling any render method to apply them globally to the renderer instance:

@page "/pdfcustom"
@using IronPdf

<h3>Customized PDF Viewer</h3>
<button @onclick="GenerateCustomizedPdf" class="btn btn-primary">Generate Customized PDF</button>
@if (!string.IsNullOrEmpty(pdfDataUri))
{
    <iframe src="@pdfDataUri" style="width:100%; height:600px; border:1px solid #ccc; margin-top:20px;"></iframe>
}

@code {
    private string pdfDataUri = string.Empty;

    private async Task GenerateCustomizedPdf()
    {
        var renderer = new ChromePdfRenderer
        {
            RenderingOptions = new ChromePdfRenderOptions
            {
                PaperSize = IronPdf.Rendering.PdfPaperSize.A4,
                MarginTop = 25,
                MarginBottom = 25,
                MarginLeft = 20,
                MarginRight = 20,
                // Header with dynamic date replacement
                TextHeader = new TextHeaderFooter
                {
                    CenterText = "Monthly Report - {date}",
                    FontSize = 12
                },
                // Footer with page numbering
                TextFooter = new TextHeaderFooter
                {
                    LeftText = "Confidential",
                    RightText = "Page {page} of {total-pages}",
                    FontSize = 10
                }
            }
        };

        var pdf = await renderer.RenderUrlAsPdfAsync("https://example.com/report");
        pdfDataUri = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.BinaryData)}";
    }
}

Top-Level C# Example

The same options apply in any .NET context. This pattern works well inside an ASP.NET Core minimal API or a scheduled report generator:

using IronPdf;
using IronPdf.Rendering;

var renderer = new ChromePdfRenderer
{
    RenderingOptions = new ChromePdfRenderOptions
    {
        PaperSize = PdfPaperSize.A4,
        MarginTop = 25,
        MarginBottom = 25,
        TextHeader = new TextHeaderFooter { CenterText = "Report - {date}", FontSize = 12 },
        TextFooter = new TextHeaderFooter { RightText = "Page {page} of {total-pages}", FontSize = 10 }
    }
};

var pdf = await renderer.RenderUrlAsPdfAsync("https://example.com/report");
pdf.SaveAs("customized-report.pdf");
using IronPdf;
using IronPdf.Rendering;

var renderer = new ChromePdfRenderer
{
    RenderingOptions = new ChromePdfRenderOptions
    {
        PaperSize = PdfPaperSize.A4,
        MarginTop = 25,
        MarginBottom = 25,
        TextHeader = new TextHeaderFooter { CenterText = "Report - {date}", FontSize = 12 },
        TextFooter = new TextHeaderFooter { RightText = "Page {page} of {total-pages}", FontSize = 10 }
    }
};

var pdf = await renderer.RenderUrlAsPdfAsync("https://example.com/report");
pdf.SaveAs("customized-report.pdf");
$vbLabelText   $csharpLabel

Template variables including {page}, {total-pages}, and {date} are replaced with actual values at render time. For complex branded layouts, use HtmlHeader and HtmlFooter properties instead of TextHeader and TextFooter. The headers and footers guide contains complete examples for both approaches.

How to Create a Blazor PDF Viewer Using IronPDF: Figure 2 - Customized PDF opened in PDF viewer

What's the Best Way to Enable PDF Downloads?

Displaying PDFs in an <iframe> handles viewing, but users frequently need to download the file. JavaScript interop triggers a browser download from a .NET byte stream. For additional download and export patterns, see the export and save PDF guide.

Razor Component Approach

Inject IJSRuntime into the component and call a JavaScript helper function to initiate the download. The DotNetStreamReference streams the PDF bytes without loading the entire file into JavaScript memory at once:

@page "/pdfdownload"
@using IronPdf
@inject IJSRuntime JSRuntime

<h3>Download PDF</h3>
<button @onclick="DownloadPdf" class="btn btn-success">Download PDF</button>

@code {
    private async Task DownloadPdf()
    {
        var renderer = new ChromePdfRenderer();
        var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Invoice</h1><p>Total: $1,299</p>");
        // Stream the PDF bytes to the browser as a downloadable file
        using var streamRef = new DotNetStreamReference(stream: new MemoryStream(pdf.BinaryData));
        await JSRuntime.InvokeVoidAsync("downloadFileFromStream", "invoice.pdf", streamRef);
    }
}

Add this JavaScript function to your _Host.cshtml or App.razor file, as described in Microsoft's Blazor JavaScript interop documentation:

window.downloadFileFromStream = async (fileName, contentStreamReference) => {
    const arrayBuffer = await contentStreamReference.arrayBuffer();
    const blob = new Blob([arrayBuffer]);
    const url = URL.createObjectURL(blob);
    const anchorElement = document.createElement('a');
    anchorElement.href = url;
    anchorElement.download = fileName ?? '';
    anchorElement.click();
    anchorElement.remove();
    URL.revokeObjectURL(url);
};
window.downloadFileFromStream = async (fileName, contentStreamReference) => {
    const arrayBuffer = await contentStreamReference.arrayBuffer();
    const blob = new Blob([arrayBuffer]);
    const url = URL.createObjectURL(blob);
    const anchorElement = document.createElement('a');
    anchorElement.href = url;
    anchorElement.download = fileName ?? '';
    anchorElement.click();
    anchorElement.remove();
    URL.revokeObjectURL(url);
};
JAVASCRIPT

Top-Level C# Example

In a server-side API endpoint, return the PDF bytes directly using Results.File. The browser receives the file with correct Content-Disposition headers and triggers the download automatically:

using IronPdf;

// ASP.NET Core minimal API endpoint
app.MapGet("/api/pdf/invoice", async () =>
{
    var renderer = new ChromePdfRenderer();
    var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Invoice</h1><p>Total: $1,299</p>");
    // Return with file download headers
    return Results.File(pdf.BinaryData, "application/pdf", "invoice.pdf");
});
using IronPdf;

// ASP.NET Core minimal API endpoint
app.MapGet("/api/pdf/invoice", async () =>
{
    var renderer = new ChromePdfRenderer();
    var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Invoice</h1><p>Total: $1,299</p>");
    // Return with file download headers
    return Results.File(pdf.BinaryData, "application/pdf", "invoice.pdf");
});
$vbLabelText   $csharpLabel

How Can I Generate PDFs from Razor Components?

Generating PDFs from HTML gives complete control over layout, data binding, and styling. This approach suits invoices, reports, and any document built from live application data. For more advanced rendering techniques, see the HTML to PDF conversion guide.

Razor Component Approach

The component below builds an invoice HTML string from C# data and converts it to a PDF. The ChromePdfRenderer treats the HTML string the same as a webpage, applying all CSS and rendering it with the Chrome engine:

@page "/invoicedemo"
@using IronPdf

<h3>Invoice Generator</h3>
<button @onclick="GenerateInvoice" class="btn btn-primary">Generate Invoice PDF</button>
@if (!string.IsNullOrEmpty(pdfDataUri))
{
    <iframe src="@pdfDataUri" style="width:100%; height:600px; border:1px solid #ccc; margin-top:20px;"></iframe>
}

@code {
    private string pdfDataUri = string.Empty;

    private async Task GenerateInvoice()
    {
        var invoiceHtml = $@"
            <html>
            <head>
                <style>
                    body {{ font-family: Arial, sans-serif; }}
                    .header {{ background-color: #f0f0f0; padding: 20px; }}
                    .invoice-table {{ width: 100%; border-collapse: collapse; }}
                    .invoice-table th, .invoice-table td {{ border: 1px solid #ddd; padding: 8px; }}
                    .total {{ font-weight: bold; font-size: 18px; }}
                </style>
            </head>
            <body>
                <div class='header'>
                    <h1>Invoice #INV-2025-001</h1>
                    <p>Date: {DateTime.Now:MM/dd/yyyy}</p>
                </div>
                <table class='invoice-table'>
                    <thead>
                        <tr>
                            <th>Item</th><th>Quantity</th><th>Price</th><th>Total</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>IronPDF License</td><td>1</td><td>$749</td><td>$749</td>
                        </tr>
                        <tr>
                            <td>Priority Support</td><td>1</td><td>$250</td><td>$250</td>
                        </tr>
                    </tbody>
                </table>
                <p class='total'>Total Amount: $999</p>
            </body>
            </html>";

        var renderer = new ChromePdfRenderer();
        var pdf = await renderer.RenderHtmlAsPdfAsync(invoiceHtml);
        pdfDataUri = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.BinaryData)}";
    }
}

Top-Level C# Example

The same HTML string approach works in any .NET context, including console apps, background services, and API endpoints. C# string interpolation or a templating library inserts dynamic data before passing the string to the renderer:

using IronPdf;

var html = """
    <html>
    <body>
        <h1>Invoice #INV-2025-001</h1>
        <table>
            <tr><th>Item</th><th>Total</th></tr>
            <tr><td>IronPDF License</td><td>$749</td></tr>
            <tr><td>Priority Support</td><td>$250</td></tr>
        </table>
        <p><strong>Total: $999</strong></p>
    </body>
    </html>
    """;

var renderer = new ChromePdfRenderer();
var pdf = await renderer.RenderHtmlAsPdfAsync(html);
pdf.SaveAs("invoice.pdf");
using IronPdf;

var html = """
    <html>
    <body>
        <h1>Invoice #INV-2025-001</h1>
        <table>
            <tr><th>Item</th><th>Total</th></tr>
            <tr><td>IronPDF License</td><td>$749</td></tr>
            <tr><td>Priority Support</td><td>$250</td></tr>
        </table>
        <p><strong>Total: $999</strong></p>
    </body>
    </html>
    """;

var renderer = new ChromePdfRenderer();
var pdf = await renderer.RenderHtmlAsPdfAsync(html);
pdf.SaveAs("invoice.pdf");
$vbLabelText   $csharpLabel

RenderHtmlAsPdfAsync accepts any valid HTML string, including inline CSS and embedded JavaScript. The implementation handles layout, font rendering, and page breaks automatically.

How to Create a Blazor PDF Viewer Using IronPDF: Figure 3 - Invoice PDF in viewer

How Does a Blazor Server PDF Viewer Differ from Blazor WebAssembly?

The hosting model determines where PDF generation runs and how the bytes reach the browser. Understanding this distinction prevents a common architectural mistake when building Blazor PDF viewers.

Blazor Server executes all C# code on the server. ChromePdfRenderer runs server-side, and the resulting bytes are pushed to the browser over the existing SignalR connection. This is the simplest integration path, requiring no additional API endpoints or network calls beyond what is shown in the earlier sections.

Blazor WebAssembly runs C# in the browser's sandbox using WASM. IronPDF's rendering engine depends on native binaries that cannot run inside the browser sandbox, so ChromePdfRenderer is not available in a WASM project directly. The correct approach is to call a server-side API endpoint that performs PDF generation and returns the bytes as a response.

Setting Up a PDF Generation API for Blazor WebAssembly

On the server, define a minimal API endpoint that generates and returns the PDF:

// Program.cs (ASP.NET Core host project)
using IronPdf;

IronPdf.License.LicenseKey = "YOUR-LICENSE-KEY-HERE";

app.MapGet("/api/pdf/report", async () =>
{
    var renderer = new ChromePdfRenderer();
    var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Quarterly Report</h1><p>Generated server-side.</p>");
    // Return PDF bytes with file download headers
    return Results.File(pdf.BinaryData, "application/pdf", "report.pdf");
});
// Program.cs (ASP.NET Core host project)
using IronPdf;

IronPdf.License.LicenseKey = "YOUR-LICENSE-KEY-HERE";

app.MapGet("/api/pdf/report", async () =>
{
    var renderer = new ChromePdfRenderer();
    var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Quarterly Report</h1><p>Generated server-side.</p>");
    // Return PDF bytes with file download headers
    return Results.File(pdf.BinaryData, "application/pdf", "report.pdf");
});
$vbLabelText   $csharpLabel

On the WASM client, inject HttpClient and call the API endpoint. The Blazor WASM hosted project template pre-configures HttpClient to target the server's base address:

@page "/wasm-pdf-viewer"
@inject HttpClient Http

<h3>PDF Viewer</h3>
<button @onclick="LoadPdf" class="btn btn-primary">Load Report</button>
@if (!string.IsNullOrEmpty(pdfDataUri))
{
    <iframe src="@pdfDataUri" style="width:100%; height:600px;"></iframe>
}

@code {
    private string pdfDataUri = string.Empty;

    private async Task LoadPdf()
    {
        // Fetch PDF bytes from the server-side generation endpoint
        var bytes = await Http.GetByteArrayAsync("/api/pdf/report");
        pdfDataUri = $"data:application/pdf;base64,{Convert.ToBase64String(bytes)}";
    }
}

This pattern keeps all heavy rendering work on the server while the WASM client handles only the display. For production use, add authentication to the API endpoint and scope the generated PDF content to the authenticated user's data.

What Other PDF Operations Can I Perform?

IronPDF's API extends well beyond basic viewing. The following sections cover four operations commonly needed in Blazor document workflows: merging multiple documents, adding annotations, applying password protection, and displaying user-uploaded files.

How Do I Merge Multiple PDF Documents?

Merging combines multiple PdfDocument instances into a single file, useful for assembling report sections, appending appendices, or concatenating user-selected files. The merge and split PDFs guide covers page-level insertion and splitting operations.

using IronPdf;

var renderer = new ChromePdfRenderer();

// Generate two separate sections as individual PDF documents
var section1 = await renderer.RenderHtmlAsPdfAsync("<h1>Section 1: Overview</h1>");
var section2 = await renderer.RenderHtmlAsPdfAsync("<h1>Section 2: Details</h1>");

// Merge into a single document preserving all pages
var merged = PdfDocument.Merge(section1, section2);
merged.SaveAs("combined-report.pdf");
using IronPdf;

var renderer = new ChromePdfRenderer();

// Generate two separate sections as individual PDF documents
var section1 = await renderer.RenderHtmlAsPdfAsync("<h1>Section 1: Overview</h1>");
var section2 = await renderer.RenderHtmlAsPdfAsync("<h1>Section 2: Details</h1>");

// Merge into a single document preserving all pages
var merged = PdfDocument.Merge(section1, section2);
merged.SaveAs("combined-report.pdf");
$vbLabelText   $csharpLabel

To display the merged document in a Blazor component, pass merged.BinaryData to the base64 data URI pattern from the earlier sections. The merged PdfDocument object also accepts further operations (watermarking, security settings, or additional page appends) before being encoded for display.

How Do I Add Annotations to a PDF?

Annotations attach reviewer notes and comments to specific page locations without altering the underlying document content. IronPDF supports text annotations, free-text boxes, and other markup types. See the annotations guide for the full list of annotation properties.

using IronPdf;
using IronPdf.Annotations;

var renderer = new ChromePdfRenderer();
var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Contract Document</h1><p>Review required on clause 3.</p>");

// Add a text annotation to page 0 at position (50, 650)
var annotation = new TextAnnotation(pageIndex: 0)
{
    Title = "Reviewer Note",
    Contents = "Please confirm clause 3 before signing.",
    X = 50,
    Y = 650,
    Width = 200,
    Height = 50,
    Printable = false,
    OpenByDefault = true
};

pdf.Annotations.Add(annotation);
pdf.SaveAs("annotated-contract.pdf");
using IronPdf;
using IronPdf.Annotations;

var renderer = new ChromePdfRenderer();
var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Contract Document</h1><p>Review required on clause 3.</p>");

// Add a text annotation to page 0 at position (50, 650)
var annotation = new TextAnnotation(pageIndex: 0)
{
    Title = "Reviewer Note",
    Contents = "Please confirm clause 3 before signing.",
    X = 50,
    Y = 650,
    Width = 200,
    Height = 50,
    Printable = false,
    OpenByDefault = true
};

pdf.Annotations.Add(annotation);
pdf.SaveAs("annotated-contract.pdf");
$vbLabelText   $csharpLabel

Annotations are preserved when the PDF is opened in any standard viewer, including the browser <iframe> display. For Blazor applications, run the annotation logic server-side and return pdf.BinaryData to the component for display.

How Do I Apply Password Protection to a PDF?

Password protection restricts access to sensitive documents such as financial reports or HR records. IronPDF supports user passwords (required to open the document) and owner passwords (required to change permissions). The PDF security guide lists all available permission flags.

using IronPdf;

var renderer = new ChromePdfRenderer();
var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Confidential Report</h1>");

// Set the password required to open the document
pdf.Password = "user-open-password";
// Set the owner password to control editing and printing rights
pdf.SecuritySettings.OwnerPassword = "owner-edit-password";
pdf.SecuritySettings.AllowUserPrinting = IronPdf.Security.PdfPrintSecurity.FullPrintRights;
pdf.SecuritySettings.AllowUserCopyPasteContent = false;

pdf.SaveAs("protected-report.pdf");
using IronPdf;

var renderer = new ChromePdfRenderer();
var pdf = await renderer.RenderHtmlAsPdfAsync("<h1>Confidential Report</h1>");

// Set the password required to open the document
pdf.Password = "user-open-password";
// Set the owner password to control editing and printing rights
pdf.SecuritySettings.OwnerPassword = "owner-edit-password";
pdf.SecuritySettings.AllowUserPrinting = IronPdf.Security.PdfPrintSecurity.FullPrintRights;
pdf.SecuritySettings.AllowUserCopyPasteContent = false;

pdf.SaveAs("protected-report.pdf");
$vbLabelText   $csharpLabel

Password-protected PDFs display a password prompt in the browser <iframe>. This approach works for documents distributed via download; for inline display without a prompt, apply the password only to documents returned through the download route.

How Do I Display User-Uploaded PDFs?

Displaying a PDF that a user has uploaded requires reading the incoming file bytes and encoding them as a data URI. The upload component below uses Blazor's InputFile control to capture the file, then displays it directly without any re-rendering:

@page "/upload-viewer"
@using IronPdf

<h3>Upload and View a PDF</h3>
<InputFile OnChange="LoadUploadedPdf" accept=".pdf" />
@if (!string.IsNullOrEmpty(pdfDataUri))
{
    <iframe src="@pdfDataUri" style="width:100%; height:600px; margin-top:20px;"></iframe>
}

@code {
    private string pdfDataUri = string.Empty;

    private async Task LoadUploadedPdf(InputFileChangeEventArgs e)
    {
        using var stream = e.File.OpenReadStream(maxAllowedSize: 10 * 1024 * 1024);
        using var ms = new MemoryStream();
        await stream.CopyToAsync(ms);
        var bytes = ms.ToArray();
        // Encode the uploaded PDF bytes directly for display
        pdfDataUri = $"data:application/pdf;base64,{Convert.ToBase64String(bytes)}";
    }
}

For uploaded PDFs that require server-side processing before display, such as watermarking, page extraction, or re-encryption, load the bytes into a PdfDocument first:

var pdf = new PdfDocument(bytes);
// Apply operations, then re-encode
pdfDataUri = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.BinaryData)}";
var pdf = new PdfDocument(bytes);
// Apply operations, then re-encode
pdfDataUri = $"data:application/pdf;base64,{Convert.ToBase64String(pdf.BinaryData)}";
$vbLabelText   $csharpLabel

This keeps the same component structure while enabling the full IronPDF API on the uploaded file.

What Are My Next Steps?

This guide covered the complete workflow for a Blazor PDF viewer with IronPDF: installation on .NET 10, URL and HTML rendering, output customization with headers and footers, JavaScript interop for browser downloads, the architectural difference between Blazor Server and Blazor WebAssembly, and four document operations: merging, annotations, password protection, and user uploads.

To extend this foundation, explore these resources:

Get your free trial license to remove watermarks and test IronPDF across your Blazor application. IronPDF supports .NET 10, ASP.NET Core, Blazor Server, and hosted Blazor WebAssembly projects without additional configuration. For additional integration guidance, see Microsoft's official Blazor documentation.

Frequently Asked Questions

What is a Blazor PDF viewer?

A Blazor PDF viewer is a component that displays PDF documents inline in a Blazor Server or WebAssembly application. It typically converts PDF bytes to a base64 data URI and renders them inside an iframe element, giving users a built-in browser toolbar for zoom, navigation, and printing.

How do I display a PDF in a Blazor Server application?

Install IronPDF via NuGet, add your license key to Program.cs, then use ChromePdfRenderer to generate PDF bytes from a URL or HTML string. Encode the bytes as a base64 data URI and assign it to the src attribute of an iframe in your Razor component.

Can IronPDF run in a Blazor WebAssembly project?

IronPDF's rendering engine requires native binaries that cannot run in the browser's WASM sandbox. For Blazor WebAssembly projects, create a server-side ASP.NET Core API endpoint that generates the PDF with IronPDF and returns the bytes. The WASM client calls this endpoint via HttpClient and displays the result.

How do I trigger a PDF download in Blazor?

Inject IJSRuntime into your component, generate PDF bytes with IronPDF, wrap them in a DotNetStreamReference, and call a JavaScript function using InvokeVoidAsync. The JavaScript function creates a Blob URL and clicks an anchor element to trigger the browser download.

What are the benefits of using IronPDF for Blazor PDF viewing?

IronPDF uses a Chrome rendering engine that accurately converts HTML, CSS, and JavaScript output into PDF format. It supports .NET 10, works in Blazor Server and WebAssembly architectures, and provides a single API for PDF generation, merging, annotations, password protection, and user-upload processing.

How do I add headers and footers to a generated PDF in Blazor?

Set the RenderingOptions property on ChromePdfRenderer before calling a render method. Use TextHeader and TextFooter for plain-text headers and footers with template variables like {page}, {total-pages}, and {date}. For HTML-based layouts, use HtmlHeader and HtmlFooter instead.

How do I merge multiple PDF documents in Blazor?

Generate each document as a PdfDocument instance using ChromePdfRenderer, then call PdfDocument.Merge(pdf1, pdf2) to combine them. Pass the merged document's BinaryData to your Blazor component's base64 data URI to display the combined result.

Can I display a user-uploaded PDF in Blazor without saving it to disk?

Yes. Use Blazor's InputFile component to read the uploaded file into a MemoryStream, convert the bytes to a base64 data URI, and assign it to an iframe's src attribute. No file system write is required. For server-side processing, load the bytes into a PdfDocument instance before encoding.

How do I apply password protection to a PDF generated in Blazor?

After generating the PdfDocument, set the Password property for the user open password and use SecuritySettings.OwnerPassword for the owner password. Use SecuritySettings.AllowUserPrinting and AllowUserCopyPasteContent to control permissions before saving or encoding the document.

Is IronPDF compatible with .NET 10 for Blazor PDF viewer projects?

Yes. IronPDF supports .NET 10, .NET 9, .NET 8, .NET 6, and .NET Framework 4.6.2 and later. No special configuration is required to use IronPDF in a Blazor application targeting .NET 10.

Curtis Chau
Curtis Chau
  Chat with engineering team now
Technical Writer

Curtis Chau holds a Bachelor’s degree in Computer Science (Carleton University) and specializes in front-end development with expertise in Node.js, TypeScript, JavaScript, and React. Passionate about crafting intuitive and aesthetically pleasing user interfaces, Curtis enjoys working with modern frameworks and creating well-structured, visually appealing manuals.

...

Read More

Related Articles

30-day trial → Full product. No limits. No card. Start Free Trial

Iron Support Team

We're online 24 hours, 5 days a week.
Chat
Email
Call Me