Blazor pdf viewer

Introduction

Portable Document Format, or PDF, is a file format created by Adobe. When presenting papers that need the text and images to be formatted, PDFs are a valuable format to employ. Document generating and invoicing are just two of the crucial services that PDF files offer in contemporary culture. The production of PDFs has become almost automatic thanks to the PDF libraries currently on the market. It is crucial to weigh the benefits and traits of each PDF library before choosing one to employ for your project.

In this tutorial, we'll use the Blazor server-side application to view a pdf report online. Iron PDF is capable of supporting Blazor applications.

1. IronPDF Features

Developers may quickly produce, read, and modify PDF documents with the help of the robust IronPDF PDF DOT NET library. It can convert HTML5, JavaScript, CSS, and picture files to PDF, add custom Headers and Footers, and produce PDFs that precisely replicate how they appear in a web browser. IronPDF, which is built on the Chrome engine, has a wide range of helpful and potent features. HTML, ASPX, Razor View, and MVC are just a few of the web and net formats that IronPDF supports. IronPDF's primary attributes are as follows:

• With the help of IronPdf, we can control the creation of PDF files and construct DOT NET C# apps that can read, write, and edit PDF files.
• using HTML login forms with User-Agents, Proxies, Cookies, HTTP Headers, and Form Variables to generate PDFs from a website URL link that is set up to accept login.
• Removing photos from PDF files that have previously been published.
• Adding text, photos, bookmarks, watermarks, and other elements to a PDF file.
• These features make it simpler to combine and divide the pages of several PDF documents.
• Having the ability to annotate media-type items, such CSS files.
• IronPDF supports a number of frameworks, such as Dot Net Windows and web frameworks like ASP.NET Forms, MVC, and blazor apps.

2.What is Blazor?

A brand-new experimental web framework called Blazor makes it possible to create client-side web applications in C# by utilising Web Assembly. Yes, C# is natively supported by browsers. Because Web Assembly apps are often given to the browser in an effective binary instruction format that can work natively and performantly at speeds that are close to native, languages like C# now have the option to run client-side in the browser. A brand-new experimental web framework called Blazor makes it possible to create client-side web applications in C# by utilising Web Assembly. Yes, C# is natively supported by browsers. The basic idea behind Web Assembly programmes is that they are delivered to the browser in a format of natively executable, effective binary instructions and efficiently at speeds that are close to native. This has created new opportunities for the client-side execution of languages like C# in browsers.

2.1 Creating a New Project in Visual Studio

In this article, we are going to use a Blazor application to generate PDF documents. To begin, open the Microsoft Visual Studio application and select “new project” from the file menu, then select blazor project "Blazor server app".

Enter a project name and select a file path. Then, click the Create button. Also, select the desired .NET Framework, as shown in the screenshot below:

Microsoft Visual Studio will now generate the structure for the selected application. If you have selected the Blazor application it will have the list of .razor files where you can enter the code and build/run the application.

Select the .NET framework version. In this example, we are going to use .NET 6.0

Next, we can add the library to test the code.

3. Install the IronPDF Library

The IronPDF Library can be downloaded and installed in four ways:

• Using Visual Studio’s NuGet package manager.
• Using Visual Studio’s Command-Line.
• Downloading directly from the NuGet website.
• Downloading directly from the IronPDF website.

3.1 Using Visual Studio’s NuGet Package Manager

Visual Studio provides the NuGet Package Manager option to install the package directly to the solution. The screenshot below shows how to open the Nuget Package Manager.

It provides a search box to find packages from the NuGet website. In the package manager we can simply search for "IronPDF", as shown in the screenshot below:

In the image above we see the list of the related search results. Please select the required options in order to install the package on your system.

3.2 Using Visual Studio Command-Line

In Visual Studio Tool Go to Tools-> NuGet Package manager -> Package manager console

Enter the following line into the package manager console tab:

Install-Package IronPdf

The package will now download and installed in the current project ready to be used.

3.3 Downloading Directly from the NuGet Website

The third way is to download the NuGet package directly from the website.

• Navigate to the link "https://www.nuget.org/packages/IronPdf/"
• Select the "download package" option from the menu on the right-hand side.
• Open the downloaded package. It will be installed automatically.
• Reload the solution and start using it in your project.

3.4 Downloading Directly from the IronPDF Website

Click this link to download the latest package directly from our website. After downloading, follow these steps to add the package to your project:

• Right-click the project from the solution window.
• Select the option "reference" and then browse the location of the downloaded reference.
• Click OK to add the reference.

4. View PDF documents with the Blazor server app

Viewing a PDF is straightforward using IronPDF. From the source file of a website that is generated from a URL, a brand-new PDF report will be generated, and it may be viewed using the technique below.

There is no cs file for the Blazor software. The corresponding.razor file should now include the following source code.

 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())}";
        }

Two techniques are provided above for saving the HTML from a URL into a PDF file that also contains the appropriate page's CSS file. The URL must be rendered using the second technique, and it must also be saved as a PDF file on the same line. Creating a PDF document from scratch is required for the first technique. By downloading the page source in chunks and producing papers from it, the process is sped up. We can also use the SaveAs function if necessary to save the created file on the server's side for reference. Javascript functions can be called from Blazor's cs code. using the special function of the Blazor programme.

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

The code shown above allows us to read documents produced using the Blazor application. The function takes in Base64 data from the Blazor server side and frames it into a string that is directly bound to the src property of the iframe element. It also integrates a webviewer to allow users to view the generated document from the Base64 string. The sample screen capture of the pdf view from the 64base string is shown below.

When a user clicks the view button, the code shown above will create a PDF document from the current page and display it in an iframe document.

4.1 View a pdf Document from HTML String

The webpage source can be transformed into a document using IronPDF. Here's an example of how to open a PDF file that was generated from an HTML string. Additionally, it has the ability to create a PDF file from any tag element.

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

Using RenderHtmlAsPdf, the aforementioned example demonstrates how to alter an HTML string. Additionally, any number of HTML strings may be sent to the function that converts the webpage source into a string. The produced pdf document can then be viewed in the Blazor pdf viewer by following the procedures above.

Conclusion

In order to help C# programmers make PDFs, I've designed a useful PDF library that they may use in this post. It is straightforward to programmatically create PDFs with IronPDF. Without even the most fundamental understanding of programming, it is still possible to comprehend the library. Some fundamental knowledge is required in order to correctly use the IronPDF library. However, it isn't open source. However, you can use it in production without a watermark with the 30-day free trial key.