通过Ngrok远程访问ASP.NET Core 6 Web API时遭遇CORS错误

可能的原因及解决方案 #

1. 检查CORS中间件的注册顺序 #

ASP.NET Core中间件的执行顺序直接决定CORS策略是否生效，必须保证UseCors在UseRouting之后，UseAuthorization和UseEndpoints之前。错误的顺序会导致CORS响应头无法正确添加到请求中。

正确的Program.cs配置示例：

var builder = WebApplication.CreateBuilder(args);

// 注册CORS服务，允许所有源、方法和头（测试用）
builder.Services.AddCors(options =>
{
    options.AddPolicy("AllowAll", policy =>
    {
        policy.AllowAnyOrigin()
              .AllowAnyMethod()
              .AllowAnyHeader();
    });
});

// 添加控制器服务
builder.Services.AddControllers();

var app = builder.Build();

// 中间件执行顺序：路由 -> CORS -> 授权 -> 端点映射
app.UseRouting();

// 应用CORS策略
app.UseCors("AllowAll");

app.UseAuthorization();

app.MapControllers();

app.Run();

2. 验证Ngrok请求的CORS响应头 #

打开浏览器开发者工具（F12）的「网络」面板，发起API请求后查看响应头：

• 确认是否存在Access-Control-Allow-Origin头，值应为*（如果配置了允许所有源）或对应的Ngrok域名。
• 如果是OPTIONS预检请求，检查响应是否包含Access-Control-Allow-Methods、Access-Control-Allow-Headers等必要头信息。

3. 为控制器显式绑定CORS策略 #

如果全局策略不生效，可以尝试在控制器上直接添加[EnableCors]特性强制启用：

[ApiController]
[Route("api/[controller]")]
[EnableCors("AllowAll")]
public class YourApiController : ControllerBase
{
    // 控制器方法逻辑
}

4. 排除其他中间件干扰 #

如果项目中使用了UseHsts或其他安全类中间件，确保它们在UseCors之后注册，避免覆盖CORS响应头。

5. 确认Ngrok转发端口正确性 #

检查Ngrok是否转发到了本地API的正确端口（比如默认的5000/7000），可以直接访问https://<ngrok-id>.ngrok.io/api/your-endpoint测试接口可用性，同时核对响应头。

内容的提问来源于stack exchange，提问作者Ali İbrahimov