在 blazor 服务器应用程序中托管 Web api

Question

我已在我的解决方案中添加了一个 webapi 项目，其中包含一个控制器来执行 HttpGet。Blazor服务器项目可以在本地很好地访问并部署。我可以在本地对服务进行邮递员调用，但部署的版本从我的 _Host 文件中向我提供 Blazor 连接失败消息。如何在不干扰 Blazor 的情况下从外部配置 webapi 访问？

我认为这可能是我需要解决的某种路由问题。我正在使用 .NET5，我的 webapi 启动有这个：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
        app.UseSwagger();
        app.UseSwaggerUI(c => c.SwaggerEndpoint("/swagger/v1/swagger.json", "myapp.WebApi v1"));
    }
    app.UseHttpsRedirection();
    app.UseRouting();
    app.UseAuthorization();
    app.UseEndpoints(endpoints =>
    {
        endpoints.MapControllers();
    });
}

WebApi程序.cs：

namespace myapp.WebApi
{
    public class Program
    {
        public static void Main(string[] args)
        {
            CreateHostBuilder(args).Build().Run();
        }

        public static IHostBuilder CreateHostBuilder(string[] args) =>
            Host.CreateDefaultBuilder(args)
                .ConfigureWebHostDefaults(webBuilder =>
                {
                    webBuilder.UseStartup<Startup>();
                });
    }
}

Blazor 程序.cs：

namespace myapp.UI
{
    public class Program
    {
        public static void Main(string[] args)
        {
            CreateHostBuilder(args).Build().Run();
        }

        public static IHostBuilder CreateHostBuilder(string[] args) =>
            Host.CreateDefaultBuilder(args)
                .ConfigureWebHostDefaults(webBuilder =>
                {
                    webBuilder.UseStartup<Startup>();
                });
    }
}

我的 Blazor 项目启动：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
{
    app.UsePathBase("/myapp");

    if (env.IsDevelopment())
    {
        app.UseDeveloperExceptionPage();
        app.UseBrowserLink();
        //TelemetryDebugWriter.IsTracingDisabled = true;
    }
    else
    {
        app.UseExceptionHandler("/Error");
        // The default HSTS value is 30 days. You may want to change this for production scenarios, see https://aka.ms/aspnetcore-hsts.
        app.UseHsts();
    }

    // SD2: app.UseSession();

    app.UseHttpsRedirection();
    app.UseStaticFiles();

    app.UseRouting();
    app.UseAuthentication();
    app.UseAuthorization();

    // SD2: app.UseMvc();

    app.UseEndpoints(endpoints =>
    {
        endpoints.MapBlazorHub();

        // prior fallback setting
        // endpoints.MapFallbackToPage("/_Host");
        
        // 1/4/22 /sf/ask/4288768221/
        endpoints.MapFallbackToPage("{*path:regex(^(?!api).*$)}", "/_Host"); // don't match paths beginning with api
    });

}

我正在研究将 .../api/... 调用路由到 webapi 项目以及将其他所有内容路由到 blazor 项目的方法。

在 VS 中，我有效的调用是 https://localhost:44368/api/controller/GetFoos/Year=2020

我部署的调用（尝试了几种变体）https://serverName/appName/api/controller/GetFoos/Year=2020

在 Blazor 中失败。我希望 Blazor 忽略并让 WebApi 处理它。

Answer 1

从 .net 6 开始，您只需向 program.cs 添加一行代码即可为 Blazor 服务器应用程序启用 API 控制器：

builder.Services.AddControllers();

示例控制器：

[ApiController]
[Route("api")]
public class ApiController : Controller {
    private static readonly string[] Summaries = new[]
    {
    "Freezing", "Bracing", "Chilly", "Cool", "Mild", "Warm", "Balmy", "Hot", "Sweltering", "Scorching"
};

    private readonly ILogger<ApiController> _logger;

    public ApiController(ILogger<ApiController> logger) {
        _logger = logger;
    }

    [HttpGet("GetWeatherForecast")]
    public IEnumerable<WeatherForecast> Get() {
        return Enumerable.Range(1, 5).Select(index => new WeatherForecast {
            Date = DateTime.Now.AddDays(index),
            TemperatureC = Random.Shared.Next(-20, 55),
            Summary = Summaries[Random.Shared.Next(Summaries.Length)]
        })
        .ToArray();
    }
}

然后，您的 blazor 应用程序将返回对以下 api 调用的响应：

 http://yourapp/api/getweatherforecast

Answer 2

这只是一些代码，用于展示如何在同一站点上运行 API 控制器和 Blazor。

通常，您可以将控制器添加到 Blazor Server 项目，如下所示：

添加服务

services.AddControllers();

或者如果控制器位于另一个项目/装配体中

services.AddControllers().PartManager.ApplicationParts.Add(new AssemblyPart(typeof(Blazr.Database.Controllers.WeatherForecastController).Assembly));

然后像这样设置中间件管道：

   app.UseEndpoints(endpoints =>
   {
      endpoints.MapControllers();
      endpoints.MapBlazorHub();
      endpoints.MapRazorPages();
      endpoints.MapFallbackToPage("/_Host");
   });

_Host.cshtml是 Blazor Server SPA 启动文件。

endpoints.MapControllers();拦截并满足控制器的所有请求。Blazor 应用程序启动页面是最后的后备页面。

Answer 3

对于 .Net 7 或 8，您需要在最小的 Program.cs 中添加两行来将 Web.API 控制器添加到 Blazor 服务器应用程序：

var builder = WebApplication.CreateBuilder(args); // Existing line
builder.Services.AddControllers();                // Must go between CreateBuilder and Build
var app = builder.Build();                        // Existing line
app.MapControllers();                             // Must go between Build and Run
app.Run();                                        // Existing line