Azure 应用服务 CORS MissingAllowOriginHeader 错误

Posted 2023-03-04

【中文标题】Azure 应用服务 CORS MissingAllowOriginHeader 错误

【英文标题】：Azure App Service CORS MissingAllowOriginHeader Error

【发布时间】：2021-10-31 09:48:16

【问题描述】：

我在 Azure 应用服务中托管了一个 Web 应用程序和 Web API（均为 .NET Core）。 Web API 位于 Azure App Gateway 后面。 Web 应用的客户端脚本通过应用网关端点调用 Web API (HTTP PUT)，这会导致 CORS 策略错误。

Web API 在 startup.cs 中有以下代码。

services.AddCors(options =>
            
                options.AddPolicy(name: MyAllowSpecificOrigins,
                                  builder =>
                                                                            
                                      builder.AllowAnyOrigin().AllowAnyMethod().AllowAnyHeader().Build();
                                  );
            );

App Gateway 的 ReWrite 规则配置如下：

If Access-Control-Request-Method == "PUT", then set the Response Headers:  
access-control-allow-headers: content-type 
access-control-allow-methods: PUT 
access-control-allow-origin: https://webappurl

使用此配置，我可以看到 Pre-flight OPTIONS 请求获得 200 响应，响应中包含上述标头。但是，随后对 https://apipurl 的 HTTP PUT 请求会导致错误：

跨域资源共享错误：MissingAllowOriginHeader

作为附加步骤，我还将 Web 应用 URI 添加到 Web API 应用服务的允许来源：

az webapp cors add --resource-group testrg --name appsvcwebapi --allowed-origins 'https://webappurl'

为什么尽管 Pre-Flight HTTP 200 响应和 access-control-allow-* 响应标头仍然出现此 CORS 错误？

【参考方案1】：

尝试添加 CORS 服务。在startup.cs 的Configure 方法中。

例子：

public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    

 app.UseCors(MyAllowSpecificOrigins);

    

更多详情请参考document

并尝试以正确的方式设置access-control-allow-origin

Access-Control-Allow-Origin : *

或

Access-Control-Allow-Origin : http://www.my-domain.com