ASP.NET Core Web API：重定向到 Angular

Question

似乎来自 ASP.NET Core Web API 的 Angular 重定向在共享部署中不起作用。我使用 ASP.NET Core 7 作为 Web API。当前设置与 ASP.NET Core 6 完美配合。

此屏幕截图显示了我的构建文件结构：

此屏幕截图显示了 ASP.NET Core Web API 构建文件，

wwwroot

文件夹包含 Angular 构建文件：

这是 ASP.NET Core Web API 的

program.cs

代码：

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddControllers();
builder.Services.AddEndpointsApiExplorer();
builder.Services.AddSwaggerGen();

var app = builder.Build();

if (app.Environment.IsDevelopment())
{
    app.UseSwagger();
    app.UseSwaggerUI();
}

app.Use(async (context, next) =>
{
    await next();

    if (context.Response.StatusCode == 404 && !System.IO.Path.HasExtension(context.Request.Path.Value))
    {
        context.Request.Path = "/index.html";
        await next();
    }
});

app.UseHttpsRedirection();
app.UseAuthorization();
app.MapControllers();

app.Run();

我知道

program.cs

中的这些代码行负责在请求的 URL 与任何端点都不匹配时将请求重定向到 Angular 应用程序：

app.Use(async (context, next) =>
{
    await next();

    if (context.Response.StatusCode == 404 && !System.IO.Path.HasExtension(context.Request.Path.Value))
    {
        context.Request.Path = "/index.html";
        await next();
    }
});

我已将上述文件夹结构（图 1）部署到 Azure 应用服务。

当我点击

https://sitename.azurewebsites.net/weatherforecast

时，我会收到 API 响应。

但是，当我点击

https://sitename.azurewebsites.net

时，由于 Web API 中不存在这样的端点，我希望请求被重定向到

index.html

文件夹内的

wwwroot

，以便渲染 Angular 页面 - 但我得到“HTTP 404” - 未找到”错误。

当我将 Web API (

https://sitenameapi.azurewebsites.net

) 和 Angular 应用程序 (

https://sitenameangularapp.azurewebsites.net

) 作为 2 个单独的 Azure 应用服务托管时（当然我处理了 CORS 部分），该应用程序可以正常工作。我怀疑从 Web API 到 Angular 应用程序的重定向是根本原因，但我无法解决它。任何帮助将不胜感激。

Answer 1

我们可以通过ASP.NET Core中的静态文件中间件来实现您的需求，具体代码如下：

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.

builder.Services.AddControllers();
builder.Services.AddEndpointsApiExplorer();
builder.Services.AddSwaggerGen();

var app = builder.Build();


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


app.MapControllers();
app.MapFallbackToFile("index.html");

app.Run();

然后你可以构建/发布你的angualr项目，我们可以获取以下文件然后粘贴到

wwwroot

文件夹中（如果没有这个文件夹，我们需要手动创建它）。