Integrating Bold Reports with Blazor Server and Handling Dependency Injection (DI) Limitations
In Blazor Server, essential services such as user authentication, localization, and session management are accessible only through Dependency Injection (DI). If a controller or class is instantiated using the new keyword (instead of being injected via DI), it bypasses the DI system. As a result, you lose access to:
- HttpContext
- ClaimsPrincipal
- IJSRuntime
- IStringLocalizer
- AuthenticationStateProvider
- Any other registered service (e.g., CSLA. NET context)
This becomes a challenge when integrating Bold Reports into a Blazor Server application, as the BoldReportsAPIController is not natively designed to work within the Blazor DI context.
Limitation: No Native Blazor Integration
Currently, Bold Reports does not offer native support for Blazor Server DI. This means that services typically injected into Blazor components or pages are not available inside the BoldReportsAPIController.
Workaround: Simulating DI Context via Client-Side Hooks
Bold Reports provides client-side hooks that allow you to pass custom headers and data to the server, enabling simulated access to user context and dynamic report customization.
1. Pass Custom Headers Using ajaxBeforeLoad
Use the ajaxBeforeLoad event in the Bold Reports Viewer component to add custom headers (e.g., authorization tokens or user IDs).
<script type="text/javascript">
$(function () {
$("#viewer").boldReportViewer({
reportServiceUrl: "/api/ReportViewer",
reportPath: '~/Resources/docs/sales-order-detail.rdl',
ajaxBeforeLoad: onAjaxRequest
});
});
function onAjaxRequest(args) {
args.headers.push({ Key: 'Authorization', Value: btoa('guest', 'demo@123') });
}
</script>
Server-side:
public object PostReportAction(Dictionary<string, object> jsonResult)
{
var authHeader = HttpContext.Current.Request.Headers["Authorization"];
if (string.IsNullOrEmpty(authHeader))
return new Exception("Authentication failed!!!");
return ReportHelper.ProcessReport(jsonResult, this);
}
2. Pass Custom Data Using args.data
<script type="text/javascript">
function onAjaxRequest(args) {
args.data = "CI0021"; // Example: Customer ID
}
</script>
Server-side:
string customerID = null;
public object PostReportAction(Dictionary<string, object> jsonResult)
{
if (jsonResult?.ContainsKey("customData") == true)
customerID = jsonResult["customData"].ToString();
return ReportHelper.ProcessReport(jsonResult, this);
}
3. Customize Report Behavior in OnInitReportOptions
[NonAction]
public void OnInitReportOptions(ReportViewerOptions reportOption)
{
if (customerID == "CI0021")
{
reportOption.ReportModel.DataSourceCredentials.Add(
new BoldReports.Web.DataSourceCredentials("<database>", "Data Source=<instancename>;Initial Catalog=<database>;")
);
}
}
4. Handle Ajax Success and Error Events
Success
function onAjaxSuccess(args) {
alert("Ajax request success!");
}
Error
function onAjaxFailure(args) {
alert("Status: " + args.status + "\nError: " + args.responseText);
}
5. Use Custom Web API Endpoints
Custom Report Action:
public object PostReportCustomAction(Dictionary<string, object> jsonResult)
{
return ReportHelper.ProcessReport(jsonResult, this);
}
Client-side:
function onAjaxRequest(args) {
args.actionName = "PostReportCustomAction";
}
Summary
While Bold Reports does not currently support native Blazor Server DI, you can still integrate it effectively by:
- Passing custom headers and data using the ajaxBeforeLoad event in the Bold Reports Viewer.
- Retrieving those values in the BoldReportsAPIController to simulate access to services like HttpContext or user identity.
- Dynamically configuring reports in OnInitReportOptions based on the received data.
This approach allows you to work around the DI limitation and still build a secure, personalized, and dynamic reporting experience in your Blazor Server application.
Feedback Logged:🔗 Report Viewer for Blazor – Feedback #6689