How to Display PDF From Byte Array in Blazor

1. Introduction

Blazor is a web framework that allows developers to build modern, feature-rich applications using C# and .NET. With Blazor, developers can create UI components that can be reused across different web applications. Blazor can be used to display PDF files and provide easy navigation using a professional-grade UI library.

IronPDF is a C# PDF library that supports handling PDF rendering, converting byte arrays to PDF file. It also supports reviewing and printing PDFs; it also supports reviewing PDFs with annotation tools. Adding headers and footers, and merging multiple PDFs is also very convenient using IronPDF.

IronPDF can be used with Blazor PDF viewer to create a PDF viewer, and it can handle larger file sizes by creating an object URL that the browser can display.

Using IronPDF with Blazor, developers can create a PDF viewer that can display PDF files from byte arrays or from a file name, and it also supports uploading files and handling file downloads. IronPDF also provides a method to handle paging of PDF documents, which works fine with Blazor.

In addition, IronPDF provides code examples to convert byte arrays to PDF documents, download PDF files, and display PDFs from a base64 string. Developers can also convert PDF files to other file formats, such as converting images to PDF files.

IronPDF can be used with a Blazor server app and can be integrated with Visual Studio to provide a seamless development experience. With IronPDF, developers can create a professional-grade UI component that can be used to build modern, feature-rich web applications.

This article explains how developers can use IronPDF to convert PDF byte arrays to a PDF document and display it in a Blazor PDF viewer.

2. Requirements

To follow along with the tutorial, the following tools and requirements are needed:

  • Visual Studio 2019 or later: This is required to create and run the Blazor application. It can be downloaded from the official file download website: https://visualstudio.microsoft.com/downloads/
  • .NET 5.0 or later: This is required to build and run the Blazor application. It can be downloaded from the official file download website: https://dotnet.microsoft.com/download
  • IronPDF: This is the professional-grade UI library that will be used to convert PDF byte arrays to a PDF document and display it in the Blazor PDF viewer. It can be downloaded from the IronPDF file download website: https://ironpdf.com/
  • IronPDF.Blazor NuGet package: This is the NuGet package that will be used to integrate IronPDF with the Blazor application. It can be installed from the NuGet Package Manager within Visual Studio.

Some features discussed in the tutorial may require a paid version of IronPDF. Additionally, the tutorial assumes a basic understanding of Blazor and C#.

3. Creating a Blazor Application

We must create a new Visual Studio project before we can start building our first Blazor app.

  • Open Visual Studio.
  • Click on Create a New Project.
  • Blazor Server App Template should be chosen.

    How to Display PDF From Byte Array in Blazor: Figure 1 - Viewing PDFs in Blazor using IronPDF, Figure 1: Creating a New Project in Visual Studio

  • Select the Next option.
  • Your application's name.

    How to Display PDF From Byte Array in Blazor: Figure 2 - Viewing PDFs in Blazor using IronPDF, Figure 2: Creating a New Project in Visual Studio

  • Select the Next option.
  • Select a .NET Framework

    How to Display PDF From Byte Array in Blazor: Figure 3 - Viewing PDFs in Blazor using IronPDF, Figure 3: Choosing the .NET 6.0 Framework for the New Blazor Server App

  • Click on the Create button.
  • As seen below, a new project will be created.

    How to Display PDF From Byte Array in Blazor: Figure 4 - What is Blazor and How Does It Work

To give you a straightforward Blazor software that is ready to use, several files were produced.

  • The entry point for the app that launches the server is program.cs, which is also where you set up the middleware and services for the app.
  • The main part of the application is called "App.razor".
  • Some sample web pages for the app can be found in the Pages directory.
  • Different profile settings for the local development environment are defined in the "launchSettings.json" file located in the Properties directory. When a project is created, a port number is automatically assigned and saved to this file.

Start the template program.

Blazor Project Types

Blazor supports two project types: Blazor Server and Blazor WebAssembly.

The former type run on the server and use SignalR to communicate with the browser. This means that the application's UI is rendered on the server, and the browser only receives updates from the server. Blazor Server has the advantage of being able to support larger applications and can easily handle more users.

Blazor WebAssembly applications, on the other hand, run entirely in the browser and do not require a server to function. This makes them more lightweight and faster to load, but they have a few limitations, such as not being able to support larger files.

For this tutorial, it is recommended to use a Blazor Server application since it can support displaying and handling PDF files, which may be larger. Additionally, Blazor Server can support reviewing and printing PDFs, which may be a useful feature for a PDF viewer application.

Installing IronPDF

In this section, we will discuss how to install IronPDF using different methods

Using the Command Line

Navigate to Tools > NuGet Package Manager > Package manager console in Visual Studio.

Enter the following line into the terminal tab of the package manager:

```shell
:ProductInstall

Now that the package has been downloaded, the current project will have it installed.

![How to Display PDF From Byte Array in Blazor: Figure 5](/static-assets/pdf/blog/blazor-display-pdf-From-byte-array-tutorial/blazor-display-pdf-From-byte-array-tutorial-5.webp)

#### Using NuGet Package Manager for Solutions

The NuGet Package Manager UI is available in Visual Studio to install the package directly into the project. The below screenshot shows how to open it.

![How to Display PDF From Byte Array in Blazor: Figure 6](/static-assets/pdf/blog/blazor-display-pdf-From-byte-array-tutorial/blazor-display-pdf-From-byte-array-tutorial-6.webp)

The Package Manager UI provides a Browse feature that displays a list of the package libraries that are offered on the NuGet website. Enter the "IronPDF" keyword, as in the below screenshot, to find the IronPDF package.

![How to Display PDF From Byte Array in Blazor: Figure 7](/static-assets/pdf/blog/blazor-display-pdf-From-byte-array-tutorial/blazor-display-pdf-From-byte-array-tutorial-7.webp)

Locate the IronPDF library in NuGet Package Manager by searching for it in the **Browse** section.

Select the IronPDF package and click the "Install" button to add it to the project.

## 4. Creating and Displaying PDFs from Byte Array

To generate PDF byte arrays using IronPDF in a Blazor application, you first need to add the IronPDF dependency to your project.

Once you have added the IronPDF dependency to your Blazor application, you can create a PDF document using the following code:

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

The aforementioned code snippet first makes use of IronPDF's RenderUrlAsPdf method, which downloads the HTML text from a specified URL and converts it into a PDF format. The resulting PDF material is then rendered as a string of unprocessed Base-64 data by the code snippet and saved in a local variable.

Applications can save created PDF files on the server's file system for later access by using IronPDF's SaveAs function (accessible on every ChromePdfRenderer instance).

The base-64 PDF data is prepared for output onto the client's browser in the next section of code.

@if (_Url != string.Empty)
{

}
@if (_Url != string.Empty)
{

}
'INSTANT VB WARNING: The following constructor is declared outside of its associated class:
'ORIGINAL LINE: if(_Url != string.Empty)
Private Sub New(Optional _Url (Not ByVal) As = String.Empty)

End Sub
VB   C#

The aforementioned function binds the Base64 data to the src attribute of an iframe element after receiving it from the Blazor server-side. This causes browsers to use their built-in web viewers to render the Base64 content as an appropriate PDF document as soon as the page loads.

Here is an image of a PDF file that was generated from a Base64 string.

How to Display PDF From Byte Array in Blazor: Figure 8 - Viewing PDFs in Blazor using IronPDF, Figure 7: Viewing a PDF Generated in a Blazor app in the browser. This PDF has been created by IronPDF and sent to the browser as a Base64 string.

Creating Simple PDF Files

Here's an example code snippet for creating a simple PDF document using IronPDF in C#:


var Renderer = new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("Hello world!!")

var Renderer = new IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("Hello world!!")
'INSTANT VB TODO TASK: The following line uses invalid syntax:
'var Renderer = New IronPdf.ChromePdfRenderer().RenderHtmlAsPdf("Hello world!!")
VB   C#

Using the method described in the preceding section, a client's browser can be used to view the created PDF document.

6. Conclusion

The tutorial shows how to use IronPDF to create and display PDF documents in a Blazor Server app. It first introduces IronPDF and its capabilities, including converting HTML to PDF, adding headers and footers, and merging multiple PDFs. It then provides step-by-step instructions for installing IronPDF and creating a PDF file in a Blazor Server app then converting it to PDF byte array and displaying it on Blazor PDF viewer by using iframe.

Overall, the tutorial provides a comprehensive overview of how to work with IronPDF and Blazor to create and display PDF documents. It encourages readers to experiment with IronPDF further and try out different features to create feature-rich applications.

If you're interested in trying out IronPDF in your Blazor project, you can take advantage of the free trial license. This gives you ample time to experiment with the features and functionality of the library and see if it meets your needs.

To get started, you can refer to the IronPDF documentation for Blazor, which provides detailed information on using the library in your project. You can also browse the IronPDF blog for tutorials and articles that cover a range of topics related to PDF manipulation and rendering.

We encourage you to take the time to experiment with IronPDF and Blazor further and see how they can enhance your PDF-related development efforts. For more Information on Blazor PDF viewer Please refer to the following link.