IIS同端口部署Angular与.NET Core WebAPI 刷新页面报404如何解决

修复方案如下： #

• 修正IIS重写规则
  原规则的重写目标配置错误，Angular入口文件存放在wwwroot目录下，需将重写目标指向实际的index.html路径，同时修正路径匹配规则适配Web API路由前缀，正确配置如下：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
    <system.webServer>
        <rewrite>
            <rules>
                <rule name="Angular-Routes" stopProcessing="true">
                <match url=".*" />
                <conditions logicalGrouping="MatchAll">
                  <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                  <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                  <add input="{REQUEST_URI}" pattern="^/webapi/" negate="true" />
                </conditions>
                <action type="Rewrite" url="/index.html" />
                </rule>
            </rules>
        </rewrite>
    </system.webServer>
</configuration>

• 调整.NET Core中间件配置
  在项目启动文件中添加兜底路由配置，同时保证中间件注册顺序正确，.NET 6+ 版本的Program.cs参考配置如下：

var builder = WebApplication.CreateBuilder(args);
// 注册服务逻辑省略
var app = builder.Build();

app.UseHttpsRedirection();
// 优先注册静态文件中间件，读取wwwroot下的Angular资源
app.UseStaticFiles();
app.UseRouting();
app.UseAuthorization();
// 注册Web API接口路由
app.MapControllers();
// 添加兜底路由，所有非接口、非静态文件的请求都返回Angular入口文件
app.MapFallbackToFile("index.html");

app.Run();

• 校验Angular构建参数
  根路径部署时，Angular项目构建命令需指定正确的基础路径：
  ng build --base-href /
  构建完成后检查wwwroot下index.html文件中的<base>标签值为<base href="/">。
• 确认配置生效

1. 给IIS站点对应的应用程序池账号（默认归属于IIS_IUSRS用户组）开放站点根目录、wwwroot目录的读取与执行权限
2. 修改配置或重新部署后，重启IIS站点并回收对应应用程序池

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