Hi, can you tell me how we can dynamically load the Blazor Components in Web Forms? Without using WASM Static strategy and iframe as we don't know it's future because google is ending the support for 3rd part cookies.
Created this blazor component in pages\MyBlazorComponent.razor:
`@page "/component"
@inject IJSRuntime JS
In program.cs, addded all the builder services related to CORS, HTTPS Redirection.
// Enable CORS for localhost:port for your Web Forms app builder.Services.AddCors(options => { options.AddPolicy("AllowWebFormsApp", builder => builder.WithOrigins("https://localhost:44307") .AllowAnyMethod() .AllowAnyHeader() .AllowCredentials()); // Ensure credentials are allowed if needed }); var app = builder.Build(); // Configure the HTTP request pipeline. if (!app.Environment.IsDevelopment()) { app.UseExceptionHandler(errorApp => { errorApp.Run(async context => { context.Response.StatusCode = StatusCodes.Status500InternalServerError; await context.Response.WriteAsync("Circuit initialization failed. Please check server logs."); }); }); // 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.UseCors("AllowWebFormsApp"); app.UseRouting(); app.UseWebSockets(); // Enable WebSockets explicitly app.MapBlazorHub(); app.MapFallbackToPage("/_Host"); app.Run();
And in Web Forms application, I have created a new Page, Component.aspx file:
`<!DOCTYPE html>
Blazor Web Form
`
But I am still getting these two errors, screenshot is attaches:
![Image](https://github.com/user-attachments/assets/3630582a-2e2d-40b5-a752-2e1a4f565b91)
I also add `builder.Services.AddServerSideBlazor().AddCircuitOptions(o =>
{
o.DetailedErrors = true;
});`
But it also doesn't seems to resolve the issue. Can anyone tell me how we can load dynamically Blazor Components in Web Forms, We have a huge application in .NET 4.8 Framework, which we need to migrate to Blazor Server, page by page, as the application communicates with real time updates and get data from other clients and server applications.
You can't load Blazor Web Components on .NET framework 4.8. It's not a supported platform. The only strategies you can follow are:
Rendering components inside an iframe (on a separate host process that runs .NET Core if you are using prerendering or Blazor Server).
Use Blazor Webassembly without prerendering, typically creating a standalone webassembly app and copying the output files into your host webforms app and configuring IIS to serve it.
Hi, can you tell me how we can dynamically load the Blazor Components in Web Forms? Without using WASM Static strategy and
iframe
as we don't know it's future because google is ending the support for 3rd part cookies.Created this blazor component in
pages\MyBlazorComponent.razor
: `@page "/component" @inject IJSRuntime JSBlazor Component
This is rendered by Blazor!
<button @onclick="ShowAlert">Click Me! @code { private void ShowAlert() { JS.InvokeVoidAsync("alert", "Blazor button clicked!"); } }`
In
program.cs
, addded all the builder services related to CORS, HTTPS Redirection.// Enable CORS for localhost:port for your Web Forms app builder.Services.AddCors(options => { options.AddPolicy("AllowWebFormsApp", builder => builder.WithOrigins("https://localhost:44307") .AllowAnyMethod() .AllowAnyHeader() .AllowCredentials()); // Ensure credentials are allowed if needed }); var app = builder.Build(); // Configure the HTTP request pipeline. if (!app.Environment.IsDevelopment()) { app.UseExceptionHandler(errorApp => { errorApp.Run(async context => { context.Response.StatusCode = StatusCodes.Status500InternalServerError; await context.Response.WriteAsync("Circuit initialization failed. Please check server logs."); }); }); // 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.UseCors("AllowWebFormsApp"); app.UseRouting(); app.UseWebSockets(); // Enable WebSockets explicitly app.MapBlazorHub(); app.MapFallbackToPage("/_Host"); app.Run();
And in Web Forms application, I have created a new Page,
Component.aspx
file: `<!DOCTYPE html>