Is it possible to run a Blazor client page within an ASP.NET Core MVC App?

user_148298 0
Viewed 2013

I've been reading about Razor Pages and the idea of being liberated from JavaScript is very compelling. From what I've gathered, while a Blazor client uses the same libraries as the rest of ASP.NET Core, it is a seperate ASP.NET Core web platform.

Is possible to add a Blazor page within an ASP.NET Core MVC application? Why wasn't it developed as an addition to the existing ASP.NET Core platform, instead of a seperate platform?

asp.net-core-mvc blazor asp.net-core c#
2 Answers

No, you can't "run Blazor client page within ASP.NET MVC Core page."

The concept of page in Blazor does not exist, unless you mean a Document Page displayed in the browser.

Blazor is focused around the concept of Components: Blazor Component Model.

Yes, you can embed Blazor Components in an MVC app or Razor Pages App.

This is how to do that:

  1. Add a call to an Html helper method which render the Component. Here the component is one that actually contains the rest of the components in a Blazor application (App.razor), which is why the whole Blazor app is going to be rendered in a Razor Pages Application.

Note: This is not Blazor... In Blazor we've got no Html Helpers

<app>@(await Html.RenderStaticComponentAsync<App>())</app>

Below is a link to the page where it is used: https://github.com/danroth27/ClientSideBlazorWithPrerendering/blob/master/ClientSideBlazorWithPrerendering.Server/Pages/_Host.cshtml

Note that _Host.cshtml is not a Blazor Component. It is, again, a Razor Pages page.

Note that in the sample a whole Blazor app is actually rendered, but of course you can use a normal simple Blazor component (one or more, unrelated components, or related ones, that is, parent component with child components). The principal is the same.

Hope this helps...

user_61528910

Yes. It is possible to run Blazor client page within ASP.NET MVC Core page.

This is simply because Client-side Blazor is like having React application in your MVC Core application. They are completely separate things. Client-side Blazor works in the browser. This is means that MVC create HTML page which run Client Blazor in same way, as MVC creates HTML page to running React application. Just inject some framework specific magic.

For Blazor this means adding at least.

<app>Loading...</app>
<script src="_framework/blazor.webassembly.js"></script>

and code on the server.

app.UseClientSideBlazorFiles<Client.Startup>();
app.UseEndpoints(endpoints =>
{
    // ...
    endpoints.MapFallbackToClientSideBlazor<Client.Startup>("index.html");
});

Microsoft calls this model in the templates as Hosted Blazor.

Since MVC executed on the server, the only way to have run Blazor code as part of MVC framework is to use Server-side Blazor, because it should be executed on the server. Again, because MVC executed on the server.

If you really want to run Blazor as part of MVC application, then you should publish standalone Client Blazor application and treat output as some JS library which you have to serve, using standard MVC means, and inject in the page somehow. That's still doable, but you on your own.

user_3544730
Related