Integrating RDLC reports in Blazor Web apps

Diwakar Devangam 55 Reputation points
2023-12-25T14:16:50.2066667+00:00

Hello,

Is it possible to call RDLC reports in a Blazor web app or use report viewer to load RDLC reports? I'm not seeing the reporting options in the latest framework. Could someone please share examples and resources for integrating RDLC reports with .NET Blazor framework? Thank you.

Best regards, Diwakar

Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,391 questions
0 comments No comments
{count} votes

Accepted answer
  1. JasonPan - MSFT 4,281 Reputation points Microsoft Vendor
    2023-12-26T03:16:37.9966667+00:00

    Hi @Diwakar Devangam,

    Since .rdlc is based on .Net Framework, so you can use RDLC in windows platform. Linux is not support. You can follow my steps to implement this requirement.

    Step 1

    Create a Blazor Web Application and Windows Froms App.

    User's image

    Step 2

    Create report in Windows Froms App, and copy it to Blazor Web Application.

    User's image

    Step 3

    Click Report1.rdlc file (1) and right click Parameters folder to add a new Parameter(2). Then right click blank area to insert a testbox.

    User's image

    Then drag ReportParameter1 into the textbox. All configuration items in these steps use the default values, and you can directly click Next to create them.
    User's image

    Step 4

    I am using Controller in Blazor Web App to render data.

    Program.cs

    using RDLC_BlazorWebApp.Components;
    
    namespace RDLC_BlazorWebApp
    {
        public class Program
        {
            public static void Main(string[] args)
            {
                var builder = WebApplication.CreateBuilder(args);
    
    
                builder.Services.AddRazorComponents()
                    .AddInteractiveServerComponents();
                // add this line
                builder.Services.AddControllers();
    
                var app = builder.Build();
    
    
                if (!app.Environment.IsDevelopment())
                {
                    app.UseExceptionHandler("/Error");
                   
                    app.UseHsts();
                }
    
                app.UseHttpsRedirection();
    
                app.UseStaticFiles();
                    
                app.UseAntiforgery();
                app.MapRazorComponents<App>()
                    .AddInteractiveServerRenderMode();
                // add this line
                app.MapControllers();
    
                app.Run();
            }
        }
    }
    
    

    HomeController

    using AspNetCore.Reporting;
    using Microsoft.AspNetCore.Components.RenderTree;
    using Microsoft.AspNetCore.Mvc;
    
    namespace RDLC_BlazorWebApp.Controllers
    {
        [ApiController]
        [Route("[controller]")]
        public class HomeController : Controller
        {
            private readonly ILogger<HomeController> _logger;
            private readonly IWebHostEnvironment _webHostEnvironment;
    
            public HomeController(ILogger<HomeController> logger, IWebHostEnvironment webHostEnvironment)
            {
                _logger = logger;
                this._webHostEnvironment = webHostEnvironment;
                System.Text.Encoding.RegisterProvider(System.Text.CodePagesEncodingProvider.Instance);
    
            }
            [HttpGet("print")]
            public IActionResult Print() {
                string mimetype = "";
                int extension = 1;
                var path = $"{this._webHostEnvironment.WebRootPath}\\Reports\\Report1.rdlc";
                Dictionary<string,string> parameters = new Dictionary<string,string>();
                parameters.Add("ReportParameter1", "RDLC in Blazor Web Application.");
                LocalReport localReport = new LocalReport(path);
                var result = localReport.Execute(RenderType.Pdf, extension,parameters,mimetype);
                return File(result.MainStream,"application/pdf");
            }
            
        }
    }
    
    

    **
    Step 5 Required**

    My Packages

    <Project Sdk="Microsoft.NET.Sdk.Web">
    
      <PropertyGroup>
        <TargetFramework>net8.0</TargetFramework>
        <Nullable>enable</Nullable>
        <ImplicitUsings>enable</ImplicitUsings>
      </PropertyGroup>
    
      <ItemGroup>
        <Content Remove="wwwroot\Reports\Report1.rdlc" />
      </ItemGroup>
    
      <ItemGroup>
        <EmbeddedResource Include="wwwroot\Reports\Report1.rdlc">
          <CopyToOutputDirectory>Always</CopyToOutputDirectory>
        </EmbeddedResource>
      </ItemGroup>
    
      <ItemGroup>
        <PackageReference Include="AspNetCore.Reporting" Version="2.1.0" />
        <PackageReference Include="System.CodeDom" Version="8.0.0" />
        <PackageReference Include="System.Drawing.Common" Version="8.0.0" />
        <PackageReference Include="System.Security.Permissions" Version="8.0.0" />
        <PackageReference Include="System.Text.Encoding.CodePages" Version="8.0.0" />
      </ItemGroup>
    
    </Project>
    
    

    Step 6 Others

    User's image

    <div class="top-row ps-3 navbar navbar-dark">
        <div class="container-fluid">
            <a class="navbar-brand" href="">RDLC_BlazorWebApp</a>
        </div>
    </div>
    
    <input type="checkbox" title="Navigation menu" class="navbar-toggler" />
    
    <div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()">
        <nav class="flex-column">
            <div class="nav-item px-3">
                <NavLink class="nav-link" href="" Match="NavLinkMatch.All">
                    <span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home
                </NavLink>
            </div>
    
            <div class="nav-item px-3">
                <NavLink class="nav-link" href="counter">
                    <span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span> Counter
                </NavLink>
            </div>
    
            <div class="nav-item px-3">
                <NavLink class="nav-link" href="weather">
                    <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather
                </NavLink>
            </div>
            <div class="nav-item px-3">
                <NavLink class="nav-link" href="home/print">
                    <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> RDLC
                </NavLink>
            </div>
        </nav>
    </div>
    
    
    

    Step 7 Test Result

    Animation


    If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Best regards,

    Jason

    1 person found this answer helpful.
    0 comments No comments

1 additional answer

Sort by: Most helpful
  1. Diwakar Devangam 55 Reputation points
    2023-12-27T05:31:52.1133333+00:00

    Hi JasonPan - MSFT,

    RDLC Error.png

    Thank you for your prompt response. I tried your solution shared here, but the getting the below error.

    DefinitionInvalidException: The definition of the report 'C:\Learning\RDLC_BlazorWebApp\RDLC_BlazorWebApp\wwwroot\Reports\Report1.rdlc' is invalid.

    An unexpected error occurred in Report Processing.

    Compiler executable file C:\WINDOWS\Microsoft.NET\Framework64\v8.0.0\vbc.exe cannot be found.

    Can you please help me, if anything missing.

    Thanks

    Diwakar