Blazor —— 大家来找茬之 ServerSide 和 WebAssembly
程序员文章站
2022-07-03 09:27:32
再次强调，Blazor 是一套前端框架，和 Vue/Angular/React 三大框架是一回事。不同的是 Blazor 采用的是 C# 作为编程语言，而它可以基于 .NET Core 的体系，与 MVC / Razor Page / WebApi 框架进行混用，并且开发人员可以选择成为全栈 or 纯前端的模式。...
前言
再次强调，Blazor 是一套前端框架，和 Vue/Angular/React 三大框架是一回事。不同的是 Blazor 采用的是 C# 作为编程语言，而它可以基于 .NET Core 的体系，与 MVC / Razor Page / WebApi 框架进行混用，并且开发人员可以选择成为全栈 or 纯前端的模式。
Blazor-ServerSide
基于 .NET CORE 的托管，通信方式使用的是 SinglR ，而托管取决于你的 Program 类的托管服务，所以在 Program 里面没有任何特殊变化。
public static async Task Main(string[] args)
{
var builder = Host.CreateDefaultBuilder(args)
.ConfigureWebHostDefaults(host =>
{
host.UseStartup<Startup>();
});
await builder.Build().RunAsync();
}
需要在 Startup.cs 中添加服务 services.AddServerSideBlazor() 服务。
并且要添加路由和终结点：
app.UseEndpoints(route =>
{
route.MapBlazorHub();
route.MapFallbackToPage("/_Host");
});
这个 Host 是一个 Razor 页面，即 _Host.cshtml
@page "/"
@{
Layout = null;
}
@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Blazor Server</title>
<base href="/" />
</head>
<body>
<app>
<component type="typeof(App)" render-mode="ServerPrerendered" />
</app>
<div id="blazor-error-ui">
An unhandled error has occurred.
<a href="" class="reload">Reload</a>
<a class="dismiss">