# Getting Started: Document Viewer for Blazor in ASP.NET Core

> This article shows how to integrate the Document Viewer for Blazor into an ASP.NET Core application running on Windows and Linux. The Document Viewer is a powerful and flexible component to display documents in your Blazor application.

- **Author:** Bjoern Meyer
- **Published:** 2025-03-25
- **Modified:** 2025-11-16
- **Description:** This article shows how to integrate the Document Viewer for Blazor into an ASP.NET Core application running on Windows and Linux. The Document Viewer is a powerful and flexible component to display documents in your Blazor application.
- **4 min read** (687 words)
- **Tags:**
  - ASP.NET
  - ASP.NET Core
  - Blazor
  - Document Viewer
- **Web URL:** https://www.textcontrol.com/blog/2025/03/25/getting-started-document-viewer-for-blazor-in-asp-net-core/
- **LLMs URL:** https://www.textcontrol.com/blog/2025/03/25/getting-started-document-viewer-for-blazor-in-asp-net-core/llms.txt
- **LLMs-Full URL:** https://www.textcontrol.com/blog/2025/03/25/getting-started-document-viewer-for-blazor-in-asp-net-core/llms-full.txt

---

> ### Prerequisites
> 
> You need to download and install the trial version of TX Text Control .NET Server to host the required backend:
> 
> - [Download Trial Version](https://www.textcontrol.com/product/tx-text-control-dotnet-server/download/)  
>     Setup download and installation required.

### Creating the Application

Make sure that you downloaded the latest version of Visual Studio 2022 that comes with the [.NET 8 SDK](https://dotnet.microsoft.com/download/dotnet/8.0).

1. In Visual Studio 2022, create a new project by choosing *Create a new project*.
2. Select *Blazor Web App* as the project template and confirm with *Next*.
3. Choose a name for your project and confirm with *Next*.
4. In the next dialog, choose *.NET 8 (Long Term Support)* as the *Framework*, select *Server* as the *Interactive render mode* and confirm with *Create*.
    
    ![Creating the .NET 8 project](https://s1-www.textcontrol.com/assets/dist/blog/2025/03/25/a/assets/visualstudio1.webp "Creating the .NET 8 project")

#### Adding the NuGet Packages

5. In the *Solution Explorer*, select your created project and choose *Manage NuGet Packages...* from the *Project* main menu. Select **nuget.org** as the *Package source*.
    
    Install the following package:
    
    
    - **TXTextControl.Web.Blazor.DocumentViewer**
    
    ![ASP.NET Core Web Application](https://s1-www.textcontrol.com/assets/dist/blog/2025/03/25/a/assets/visualstudio2.webp "ASP.NET Core Web Application")
6. Select *Text Control Offline Packages* as the *Package source* and install the following packages:
    
    
    - **TXTextControl.TextControl.Core.SDK**
    - **TXTextControl.Web.DocumentViewer**

> **Important Notice**
> 
> The Blazor Document Viewer package depends on the TX Text Control package **TXTextControl.TextControl.Core.SDK**, which must be installed using the developer setup (trial of full version) and will be available in the *Text Control Offline Packages* package source.
> 
> If this package is not found, be sure to install the TX Text Control .NET Server setup.
> 
> - [Download Trial Version](https://www.textcontrol.com/product/tx-text-control-dotnet-server/download/)  
>     Setup download and installation required.

#### Configure the Application

7. Open the *Program.cs* file located in the project's root folder. At the very top of the file, insert the following code:
    
    ```
    using TXTextControl.Web.MVC.DocumentViewer;
    ```
    
    Add the following code after the entry *var builder = WebApplication.CreateBuilder(args);*:
    
    ```
    builder.Services.AddControllers();
    ```
    
    After *app.UseStaticFiles();*, add the following code:
    
    ```
    app.UseRouting();
    app.UseAntiforgery();
    app.UseTXDocumentViewer();
    ```

Your complete *Program.cs* file should look like this:

```
using TXTextControl.Web.MVC.DocumentViewer;
using tx_blazor_33_editor.Components;

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddControllers();
builder.Services.AddRazorComponents()
    .AddInteractiveServerComponents();

var app = builder.Build();

// Configure the HTTP request pipeline.
if (!app.Environment.IsDevelopment())
{
    app.UseExceptionHandler("/Error", createScopeForErrors: true);
    // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
    app.UseHsts();
}

app.UseHttpsRedirection();

app.UseStaticFiles();

app.UseRouting();
app.UseAntiforgery();
app.UseTXDocumentViewer();

app.MapRazorComponents<App>()
    .AddInteractiveServerRenderMode();

app.Run();
```

#### Adding the Control to the View

8. Find the *Home.razor* file in the *Components -> Pages* folder. Replace the complete content with the following code to add the document editor to the view:
    
    ```
    @page "/"
    @rendermode InteractiveServer
    
    <div style="width: 800px; height: 500px">
        <TXTextControl.Web.Blazor.DocumentViewer.DocumentViewer @ref=_documentViewer />
    </div>
    
    <button @onclick="LoadDocument">Load Document</button>
    
    @code {
        private TXTextControl.Web.Blazor.DocumentViewer.DocumentViewer _documentViewer;
    
        public async Task LoadDocument()
        {
            byte[] document = System.IO.File.ReadAllBytes("Documents/template.docx");
            await _documentViewer.LoadDocument(document);
        }
    }
    ```

#### Adding Documents

To show how to load documents into the Document Editor, we will add a few sample documents to the application.

9. Create a new folder in the project's root folder and name it *Documents*.
10. Place any documents you want to load into the Document Editor into this folder. In this sample, we will use a document named *template.docx*.

#### Running the Application

11. Run the application by pressing *F5* or by choosing *Debug -> Start Debugging* from the main menu.

When clicking the *Load Document* button, the document *template.docx* will be loaded into the Document Viewer.

![Loading documents with TX Text Control Blazor](https://s1-www.textcontrol.com/assets/dist/blog/2025/03/25/a/assets/blazor1.webp "Loading documents with TX Text Control Blazor")

> **Deploying to Linux?**
> 
> If you want to deploy to Linux or run it with WSL or Docker support, see the following article to learn how to deploy the required web server to Linux.
> 
> [Getting Started: Document Viewer with ASP.NET Core and Linux WSL Support ](https://www.textcontrol.com/blog/2025/03/12/getting-started-document-viewer-with-asp-net-core-and-linux-wsl-support/llms-full.txt)

---

## About Bjoern Meyer

As CEO, Bjoern is the visionary behind our strategic direction and business development, bridging the gap between our customers and engineering teams. His deep passion for coding and web technologies drives the creation of innovative products. If you're at a tech conference, be sure to stop by our booth - you'll most likely meet Bjoern in person. With an advanced graduate degree (Dipl. Inf.) in Computer Science, specializing in AI, from the University of Bremen, Bjoern brings significant expertise to his role. In his spare time, Bjoern enjoys running, paragliding, mountain biking, and playing the piano.

- [LinkedIn](https://www.linkedin.com/in/bjoernmeyer/)
- [X](https://x.com/txbjoern)
- [GitHub](https://github.com/bjoerntx)

---

## Related Posts

- [Building an ASP.NET Core Backend (Linux and Windows) for the Document Editor and Viewer](https://www.textcontrol.com/blog/2025/03/26/building-an-asp-net-core-backend-for-the-document-editor-and-viewer/llms.txt)
- [TX Text Control Document Editor and Viewer for Blazor Released](https://www.textcontrol.com/blog/2025/03/25/tx-text-control-document-editor-and-viewer-for-blazor-released/llms.txt)
- [Announcing Our Work on a Blazor Component for Document Editing and Viewing](https://www.textcontrol.com/blog/2025/01/24/announcing-our-work-on-a-blazor-component-for-document-editing-and-viewing/llms.txt)
- [High-Performance Text Replacement in Large DOCX Files using C# .NET](https://www.textcontrol.com/blog/2025/07/30/high-performance-text-replacement-in-large-docx-files-using-csharp-dotnet/llms.txt)
- [Document Viewer 33.2.1 Released: New Event and Bug Fixes](https://www.textcontrol.com/blog/2025/07/30/document-viewer-33-2-1-released-new-event-and-bug-fixes/llms.txt)
- [E-Sign Comes to Blazor: Document Viewer 33.0.1 Released](https://www.textcontrol.com/blog/2025/04/24/e-sign-comes-to-blazor-document-viewer-33-0-1-released/llms.txt)
- [TX Text Control for Blazor: Mail Merge Integration Tutorial](https://www.textcontrol.com/blog/2025/03/25/tx-text-control-for-blazor-mail-merge-integration-tutorial/llms.txt)
- [Getting Started: Document Editor for Blazor in ASP.NET Core](https://www.textcontrol.com/blog/2025/03/25/getting-started-document-editor-for-blazor-in-asp-net-core/llms.txt)
- [Preparing Documents for E-Signing for Multiple Signers in .NET C#](https://www.textcontrol.com/blog/2024/11/13/preparing-documents-for-e-signing-for-multiple-signers-in-net-c-sharp/llms.txt)
- [ASP.NET Core: Use the Document Editor and Viewer in the Same Razor View](https://www.textcontrol.com/blog/2024/11/08/asp-net-core-use-the-document-editor-and-viewer-in-the-same-razor-view/llms.txt)
- [Optimizing Digital Signature Workflows: Starting with MS Word DOCX Files Instead of PDFs in C#](https://www.textcontrol.com/blog/2024/09/27/optimizing-digital-signature-workflows-starting-with-ms-word-docx-files-instead-of-pdfs-in-csharp/llms.txt)
- [Document Viewer: Setting the Rendering Mode](https://www.textcontrol.com/blog/2024/08/22/document-viewer-setting-the-rendering-mode/llms.txt)
- [View MS Word DOCX and PDF Documents using a .NET C# Document Viewer for ASP.NET Core and ASP.NET](https://www.textcontrol.com/blog/2024/08/08/view-ms-word-docx-and-pdf-documents-using-a-net-csharp-document-viewer-for-aspnet-core-and-aspnet/llms.txt)
- [Getting Started Video Tutorial: How to Add Electronic and Digital Signatures to PDF Documents in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/08/05/getting-started-video-tutorial-how-to-add-electronic-and-digital-signatures-to-pdf-documents-in-asp-net-core-csharp/llms.txt)
- [Getting Started Video Tutorial: How to use the Document Viewer in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/08/05/getting-started-video-tutorial-how-to-use-the-document-viewer-in-asp-net-core-csharp/llms.txt)
- [Transforming Financial Documents into Smart and Secure Forms in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/05/01/transforming-financial-documents-into-smart-and-secure-forms-in-asp-net-core-c-sharp/llms.txt)
- [Document Viewer: Long Polling Support for Loading Documents](https://www.textcontrol.com/blog/2024/04/25/document-viewer-long-polling-support-for-loading-documents/llms.txt)
- [Adding and Sharing Annotations across Document Types using the Document Viewer in ASP.NET Core C#](https://www.textcontrol.com/blog/2024/04/19/adding-and-sharing-annotations-across-document-types-using-the-document-viewer-in-asp-net-core-c-sharp/llms.txt)
- [Adding a Security Middleware to ASP.NET Core Web Applications to Protect TX Text Control Document Editor and Document Viewer Endpoints](https://www.textcontrol.com/blog/2024/03/18/adding-a-security-middleware-to-asp-net-core-web-applications-to-protect-tx-text-control-document-editor-and-document-viewer-endpoints/llms.txt)
- [Building an ASP.NET Core Backend Application to Host the Document Editor and Document Viewer](https://www.textcontrol.com/blog/2024/03/14/building-an-asp-net-core-backend-application-to-host-the-document-editor-and-document-viewer/llms.txt)
- [Handling Electronic Signatures in a Blazor Web App using .NET 8](https://www.textcontrol.com/blog/2024/02/06/handling-electronic-signatures-in-a-blazor-web-app-using-net-8/llms.txt)
- [Using the Document Viewer in a Blazor Server App with .NET 8](https://www.textcontrol.com/blog/2024/01/29/using-the-document-viewer-in-a-blazor-server-app-with-net-8/llms.txt)
- [Signature Soft Pad Customization](https://www.textcontrol.com/blog/2023/11/20/signature-soft-pad-customization/llms.txt)
- [Securing the Signature Endpoint with Custom ActionFilterAttributes](https://www.textcontrol.com/blog/2023/07/25/securing-the-signature-endpoint-with-custom-actionfilterattributes/llms.txt)
- [Common Web API Methods for Handling E-Signature Workflows in ASP.NET Core C#](https://www.textcontrol.com/blog/2023/07/20/common-web-api-methods-for-handling-esignature-workflows-in-aspnet-core-csharp/llms.txt)