在飞行前停止从 Firefox 到 Beego 服务器的 CORS 获取

Posted 2023-03-04

【中文标题】在飞行前停止从 Firefox 到 Beego 服务器的 CORS 获取

【英文标题】：CORS fetch from Firefox to Beego server stops after pre-flight

【发布时间】：2016-06-19 11:30:30

【问题描述】：

我有一个 ecmascript 7 浏览器应用程序在 Firefox 44.0.2 浏览器中的 http://localhost:3000 上运行。它发布到在https://localdev.net:8443 上运行的 Beego 1.6.0 服务器。 'localdev.net' 在同一个盒子上并解析为本地主机地址。浏览器代码是：

var serverURL = 'https://localdev.net:8443/v1/user/login'
fetch(serverURL, 
  method: 'post',
  headers: 
    'Accept': 'application/json',
    'Content-Type': 'application/json'
  ,
  mode: 'cors',
  cache: 'default',
  body: JSON.stringify(username: this.state.username, password: this.state.password)
)
.then(function(response)
  if (response.status >= 200 && response.status < 300) 
    return Promise.resolve(response)
  
  return Promise.reject(new Error(response.statusText))
)
.then(function(data)
  console.log('data: ' + data)
)
.catch((err) => console.error(serverURL, err.toString()))

beego服务器配置如下处理CORS请求：

beego.InsertFilter("*", beego.BeforeRouter, cors.Allow(&cors.Options
  AllowOrigins:     []string"*",
  AllowMethods:     []string"*",
  AllowHeaders:     []string"Origin",
  ExposeHeaders:    []string"Content-Length",
  AllowCredentials: true,
))

Wireshark 看到客户端向服务器发送飞行前 CORS 选项请求：

OPTIONS /v1/user/login HTTP/1.1\r\n
Host: localdev.imaginout.net:8443\r\n
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:44.0) Gecko/20100101 Firefox/44.0\r\n
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8\r\n
Accept-Language: en-US,en;q=0.5\r\n
Accept-Encoding: gzip, deflate, br\r\n
Access-Control-Request-Method: POST\r\n
Access-Control-Request-Headers: content-type\r\n
Origin: http://localhost:3000\r\n
Connection: keep-alive\r\n

作为响应，beego 服务器输出：

2016/03/05 12:54:29 [router.go:828][D] | OPTIONS    | /v1/user/login                           | 102.08µs         | not match   |

即使服务器说“不匹配”，wireshark 也会记录响应：

HTTP/1.1 200 OK\r\n
Access-Control-Allow-Credentials: true\r\n
Access-Control-Allow-Origin: http://localhost:3000\r\n
Access-Control-Expose-Headers: Content-Length\r\n
Server: beegoServer:1.6.0\r\n
Date: Sat, 05 Mar 2016 17:54:29 GMT\r\n
Content-Length: 0\r\n
Content-Type: text/plain; charset=utf-8\r\n

对我来说，将 Access-Control-Allow-Origin 设置为浏览器应用程序域的 200 状态表明 CORS 预检成功，但 Firefox 开发者控制台显示：

"https://localdev.net:8443/v1/user/login" TypeError: NetworkError when attempting to fetch resource.

所以应用程序和/或 Firefox 似乎认为请求失败。 Wireshark 显示该应用程序没有向服务器发送另一个请求。我期待一个帖子。

有很多关于 CORS 的问题，但是浏览器/API/服务器变化很大，所以我还没有找到完全匹配的。深入研究它，但任何帮助将不胜感激。

【问题讨论】：

尝试从 Chrome 运行请求，它在开发者控制台中给出了一个额外的错误：“请求标头字段内容类型在预检响应中被 Access-Control-Allow-Headers 不允许。”在此错误之后，它会打印“TypeError: Failed to fetch”。

在 Beego 配置中将 AllowHeaders 设置为“Origin, Content-Type”，但仍然出现相同的错误。 Beego 发送的飞行前响应不包含设置为 'Origin, Content-Type' 的 Access-Control-Allow-Headers。我怀疑它应该。

【参考方案1】：

已修复。需要在 Beego CORS 选项中设置 Access-Control-Allow-Headers 为 []string"Origin", "Content-Type"。然后正确设置 Access-Control-Allow-Headers 并且预检成功。在此之后主帖成功。