前言
再次强调，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">?</a></div><script src="_framework/blazor.server.js"></script>
</body>
</html>
项目需要引用的 nuget 包：Microsoft.AspNetCore.Components
Blazor-WebAssembly
采用的是基于 WebAssembly 技术，由于是纯前端，所以在 Program 中有变化：
public static async Task Main(string[] args)
{var builder = WebAssemblyHostBuilder.CreateDefault(args);builder.RootComponents.Add<App>("app");builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });await builder.Build().RunAsync();
}
如果是后端交互，则需要使用远程访问请求的方式，例如 HTTP / TCP 等等，而不是直接调用后端代码。因为它是纯前端。
然后需要在 wwwroot 中添加一个 index.html 页面，也就是首页：
<!DOCTYPE html>
<html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /><title>Blazor WebAssembly</title><base href="/" />
</head><body><app>Loading...</app><div id="blazor-error-ui">An unhandled error has occurred.<a href="" class="reload">Reload</a><a class="dismiss">?</a></div><script src="_framework/blazor.webassembly.js"></script>
</body></html>
可以说，这样的 index.html 引导主页面是任何一个前端框架必备的，最终会将前端内容呈现在 <app> ...</app> 这个元素中。
没有 Startup 没有依赖注入配置，因为他不是后端。
概览比较
| ServerSide | WebAssembly | |
|---|---|---|
| Program.cs | 使用 Host 托管 |
使用 WebAssemblyHostBuilder 托管 |
| Startup.cs | 添加 ServerSideBlazor 服务的注入，添加 app.MapBlazorHub 和 app.MapFallbackPage 中间件 |
无 Startup.cs 类文件 |
| 启动页面 | Pages/_Host.cshtml |
wwwroot/index.html |
| App.razor | 代码相同 | 代码相同 |
| Nuget包 | Microsofot.AspNetCore.Components |
Microsoft.AspNetCore.Components.WebAssembly |
| .NET SDK | netcoreapp3.1 | netstandard2.1 |
| 交互方式 | SinglR | 支持 Web assembly 技术的浏览器 |
全栈 or 前端
一般来说，全栈意味着功能是垂直划分，前端->后端->数据库，完整的一个功能划分；而前后端，则需要由前端人员处理界面，后端人员处理数据，通过一种通信方式（目前常见的是 web api）将两人的功能进行串联。
这两种优劣势的争议已经互相厮杀了很久，对于个人来说，全栈是牛逼的象征，对于管理者来说，都是从成本出发。
但还有一个比较重要的因素，就是审美。大部分后端人员对于前端部分的审美、排版是有障碍的，而前端人员对于后端的逻辑、中间件、性能、服务器等等也只懂皮毛。如果想要通吃，那这个人的管理成本就会提升。
因此，最头疼的应该就是管理者了，需要进行权衡和考虑，它牵扯的不单单是技术问题。