看似随意"Response for preflight is invalid (redirect)"

Seemingly random "Response for preflight is invalid (redirect)"

我 运行 遇到了看似随机的 CORS 错误消息的问题。这将在同一个调用中使用不同的参数工作 100 次中的 99 次。下次我尝试使用先前抛出 Response for preflight is invalid (redirect) 的相同参数进行调用时,将会成功。它几乎发生在我的每一个 API 电话中。

我设法捕获了这些错误之一,并且我正试图找出它发生的原因。

登录发生在 Angular 服务中:

login(UserId: string, password: string) {

const formData = {
  'username': UserId,
  'password': password
};

const headers = new HttpHeaders();

headers.set('Content-Type', 'application/json');

return this.http.post<AuthResult>(environment.apiUrl + '/Authorization', formData, { headers: headers })
  .map(authResult => {
   if (authResult && authResult.Succeeded && authResult.Token) {
     // handle results here
   } else {
     console.error(`Error: ${authResult.ErrorMessage}`);
  })
  .do(response => console.log('Login method finished in Auth Service.'));
}

导致 Chrome 控制台错误:

Failed to load http://localhost:12711/api/Authorization: Response for preflight is invalid (redirect)  :4200/#/login:1

返回的可观察对象的订阅者进入 onError 代码块。

奇怪的是,查看 Fiddler 跟踪显示服务器响应正确的 CORS 响应,没有重定向:

OPTIONS http://localhost:12711/api/Authorization HTTP/1.1
Host: localhost:12711
Connection: keep-alive
Access-Control-Request-Method: POST
Origin: http://localhost:4200
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.119 Safari/537.36
Access-Control-Request-Headers: content-type
Accept: */*
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9


HTTP/1.1 200 OK
Cache-Control: no-cache
Pragma: no-cache
Expires: -1
Server: Microsoft-IIS/10.0
Access-Control-Allow-Origin: http://localhost:4200
Access-Control-Allow-Headers: content-type
X-AspNet-Version: 4.0.30319
X-SourceFiles: =?UTF-8?B?QzpcVXNlcnNcUFhHOTA1MlxEb2N1bWVudHNcVlNQcm9qZWN0c1xDYXJlT3B0aW1pemF0aW9uU2VydmljZXNcQ2FyZU9wdGltaXphdGlvblNlcnZpY2VzXGFwaVxBdXRob3JpemF0aW9u?=
X-Powered-By: ASP.NET
Date: Fri, 16 Mar 2018 15:53:47 GMT
Content-Length: 0

我应该注意到这个特别是 POST,但我在 GET 上遇到了同样的错误。我只是还没有在 Fiddler 中捕捉到其中一个。

我的 API 99% 的调用工作正常这一事实告诉我 CORS 配置正确。 (我觉得!)

为什么 Angular 没有返回重定向却告诉我存在预检重定向问题?为什么它看似随机,它可以正常工作但在极少数情况下会失败?

我现在将 Angular 视为问题,因为在我看来 API 正在为 CORS 返回正确的 headers。

详情:

我在我的开发环境中 运行(用于测试)。在 Visual Studio 2015 Enterprise 中,Angular 4 应用程序是 运行 "ng serve",API 是 运行。 API 是用 C# 和 Web API 2 编写的 REST API。

这些错误也发生在已部署的环境中。同样,99% 的 API 调用在那里工作正常,只有 1% 失败。

another question 的帮助下,我能够弄清楚发生了什么并修复它。 Chrome 扩展(Digital Guardian)导致 Chrome 在每次 CORS 预检时同时发送两个 OPTIONS 请求。删除扩展程序后,一切都按预期进行。