Integrate YARP and DevExpress Blazor components

Added YARP reverse proxy for API routing and DevExpress Blazor components for advanced UI features, including PDF Viewer. Updated `EnvelopeGenerator.WebUI.csproj` to include necessary packages and ensure `yarp.json` is copied to the output directory. Modified `Program.cs` to configure YARP and DevExpress services, and adjusted the HTTP pipeline for proper routing. Updated `appsettings.json` with `ApiOptions` and `PdfViewerOptions`. Added `yarp.json` to define reverse proxy routes and clusters.
This commit is contained in:
2026-06-12 13:10:17 +02:00
parent d35a35c75e
commit 536b8ef5da
4 changed files with 82 additions and 1 deletions

View File

@@ -9,6 +9,16 @@
<ItemGroup> <ItemGroup>
<ProjectReference Include="..\EnvelopeGenerator.WebUI.Client\EnvelopeGenerator.WebUI.Client.csproj" /> <ProjectReference Include="..\EnvelopeGenerator.WebUI.Client\EnvelopeGenerator.WebUI.Client.csproj" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="8.0.22" /> <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="8.0.22" />
<PackageReference Include="Yarp.ReverseProxy" Version="2.1.0" />
<PackageReference Include="DevExpress.Blazor" Version="25.2.3" />
<PackageReference Include="DevExpress.Blazor.PdfViewer" Version="25.2.3" />
<PackageReference Include="DevExpress.Blazor.Reporting.Viewer" Version="25.2.3" />
</ItemGroup>
<ItemGroup>
<Content Update="yarp.json">
<CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
</Content>
</ItemGroup> </ItemGroup>
</Project> </Project>

View File

@@ -1,12 +1,31 @@
using EnvelopeGenerator.WebUI.Components; using EnvelopeGenerator.WebUI.Components;
using DevExpress.Blazor;
var builder = WebApplication.CreateBuilder(args); var builder = WebApplication.CreateBuilder(args);
// Load YARP configuration
builder.Configuration.AddJsonFile("yarp.json", optional: false, reloadOnChange: true);
// Add services to the container. // Add services to the container.
builder.Services.AddRazorComponents() builder.Services.AddRazorComponents()
.AddInteractiveServerComponents() .AddInteractiveServerComponents()
.AddInteractiveWebAssemblyComponents(); .AddInteractiveWebAssemblyComponents();
// YARP Reverse Proxy
builder.Services.AddReverseProxy()
.LoadFromConfig(builder.Configuration.GetSection("ReverseProxy"));
// DevExpress Server-Side Services (CRITICAL for DxPdfViewer)
builder.Services.AddDevExpressBlazor(configure => configure.BootstrapVersion = BootstrapVersion.v5);
builder.Services.AddDevExpressServerSideBlazorPdfViewer();
// builder.Services.AddDevExpressBlazorReportViewer(); // Will be enabled after Options migration
// Configuration Options (will be enabled in Phase 5 after Options migration)
// builder.Services.Configure<EnvelopeGenerator.WebUI.Client.Options.ApiOptions>(
// builder.Configuration.GetSection("ApiOptions"));
// builder.Services.Configure<EnvelopeGenerator.WebUI.Client.Options.PdfViewerOptions>(
// builder.Configuration.GetSection("PdfViewerOptions"));
var app = builder.Build(); var app = builder.Build();
// Configure the HTTP request pipeline. // Configure the HTTP request pipeline.
@@ -26,9 +45,13 @@ app.UseHttpsRedirection();
app.UseStaticFiles(); app.UseStaticFiles();
app.UseAntiforgery(); app.UseAntiforgery();
// Blazor routing (BEFORE YARP - important order!)
app.MapRazorComponents<App>() app.MapRazorComponents<App>()
.AddInteractiveServerRenderMode() .AddInteractiveServerRenderMode()
.AddInteractiveWebAssemblyRenderMode() .AddInteractiveWebAssemblyRenderMode()
.AddAdditionalAssemblies(typeof(EnvelopeGenerator.WebUI.Client._Imports).Assembly); .AddAdditionalAssemblies(typeof(EnvelopeGenerator.WebUI.Client._Imports).Assembly);
// YARP proxy (AFTER Blazor - catch-all for /api/*)
app.MapReverseProxy();
app.Run(); app.Run();

View File

@@ -5,5 +5,14 @@
"Microsoft.AspNetCore": "Warning" "Microsoft.AspNetCore": "Warning"
} }
}, },
"AllowedHosts": "*" "AllowedHosts": "*",
"ApiOptions": {
"BaseUrl": ""
},
"PdfViewerOptions": {
"ThumbnailBaseScale": 0.75,
"ThumbnailEnableHiDPI": true,
"MainCanvasEnableHiDPI": true,
"ZoomStepPercentage": 5
}
} }

View File

@@ -0,0 +1,39 @@
{
"ReverseProxy": {
"Routes": {
"api-route": {
"ClusterId": "api-cluster",
"Match": {
"Path": "/api/{**catch-all}"
}
},
"swagger-route": {
"ClusterId": "api-cluster",
"Match": {
"Path": "/swagger/{**catch-all}"
}
},
"openapi-route": {
"ClusterId": "api-cluster",
"Match": {
"Path": "/openapi/{**catch-all}"
}
},
"scalar-route": {
"ClusterId": "api-cluster",
"Match": {
"Path": "/scalar/{**catch-all}"
}
}
},
"Clusters": {
"api-cluster": {
"Destinations": {
"api-destination": {
"Address": "https://localhost:8088"
}
}
}
}
}
}