如何在.NET MAUI BlazorWebView中托管Blazor Server应用？

完全可以在.NET MAUI BlazorWebView中托管Blazor Server应用，你的问题出在错误使用了HostPage属性，以下是具体实现步骤：

1. 修复核心配置错误 #

BlazorWebView的HostPage属性用于指定本地嵌入式HTML文件（如MAUI项目wwwroot下的index.html），而非远程Blazor Server的URL。直接设置远程URL会导致控件无法解析，进而跳转到默认的https://0.0.0.0/引发错误。

2. 配置Blazor Server允许跨域 #

MAUI应用作为独立客户端，需要Blazor Server开启CORS支持才能建立SignalR连接：
在Blazor Server项目的Program.cs中添加CORS中间件：

builder.Services.AddCors(options =>
{
    options.AddPolicy("AllowMAUI", policy =>
    {
        policy.WithOrigins("https://0.0.0.0", "http://0.0.0.0")
              .AllowAnyHeader()
              .AllowAnyMethod()
              .AllowCredentials();
    });
});

// 需放在app.UseRouting()之后、app.UseAuthorization()之前
app.UseCors("AllowMAUI");

3. 修改MAUI项目的Blazor启动脚本 #

保留MAUI项目中默认的HostPage（如wwwroot/index.html），修改其中的Blazor启动代码，连接到远程Blazor Server：

<!-- 替换原Blazor脚本引用 -->
<script src="https://localhost:7021/_framework/blazor.server.js"></script>
<script>
    Blazor.start({
        configureSignalR: function (builder) {
            // 指定Blazor Server的SignalR端点
            builder.withUrl("https://localhost:7021/_blazor");
        }
    });
</script>

4. 配置MAUI平台网络权限 #

• Android：在AndroidManifest.xml中添加网络权限：

  <uses-permission android:name="android.permission.INTERNET" />
  <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
  

• iOS：在Info.plist中添加localhost的网络访问例外：

  <key>NSAppTransportSecurity</key>
  <dict>
      <key>NSExceptionDomains</key>
      <dict>
          <key>localhost</key>
          <dict>
              <key>NSIncludesSubdomains</key>
              <true/>
              <key>NSExceptionAllowsInsecureHTTPLoads</key>
              <true/>
          </dict>
      </dict>
  </dict>
  

5. 启动验证 #

先启动Blazor Server应用，确认https://localhost:7021/可正常访问，再启动MAUI应用，即可通过BlazorWebView加载远程Blazor Server内容。

内容的提问来源于stack exchange，提问作者IvanH