从angular $http到asp.net webapi的Preflight请求中发送正确的报头值错误

本文关键字:错误 报头 请求 Preflight http angular asp webapi net | 更新日期: 2023-09-27 18:18:20

我正在尝试使用angular的$http将认证数据发送到后端web api。当我添加下面这行代码时,浏览器开始发送飞行前请求

$http.defaults.headers.common.Authorization = 'Basic xxxxyyyyyy' ;

从web api端,当我得到一个带有OPTIONS方法的请求时,我按如下方式处理它。

if (request.Method == HttpMethod.Options && request.Headers.Any(k => k.Key.Contains("Origin")))
            {
                var response = new HttpResponseMessage(HttpStatusCode.OK);
                response.Headers.Add("Access-Control-Allow-Headers", "Content-Type,X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5,  Date, X-Api-Version, X-File-Name");
                response.Headers.Add("Access-Control-Allow-Origin", request.Headers.GetValues("Origin"));
                response.Headers.Add("Access-Control-Allow-Credentials", "true");
                response.Headers.Add("Access-Control-Allow-Methods", "POST, GET, PUT, DELETE, OPTIONS");
                var tsc = new TaskCompletionSource<HttpResponseMessage>();
                tsc.SetResult(response);
                return tsc.Task;  
            }

但是pre - flight请求访问控制检查失败。

XMLHttpRequest无法加载http://localhost:53024/api.............对预飞行请求的响应未通过访问控制检查'Access-Control-Allow-Origin'头包含多个值'http://localhost:9000, *',但只允许一个。起源因此,'http://localhost:9000'不允许访问。

我做错了什么?

从angular $http到asp.net webapi的Preflight请求中发送正确的报头值错误

" Access-Control-Allow-Origin报头包含多个值"的错误解决方案在此链接中给出。请试试。

希望这对你有帮助!

我有同样的问题,这是由web配置设置引起的:

<httpProtocol>
      <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Headers" value="Origin, X-Requested-With, Content-Type, Accept, Cache-Control" />
        <add name="Access-Control-Allow-Methods" value="GET,PUT,POST,OPTIONS" />
      </customHeaders>
 </httpProtocol>

删除Access-Control-Allow-Origin自定义头将解决此问题