获取API：无法在Chrome上的请求标头上添加授权

Question

Chrome版：57.0.2987

实际上，在较旧的Chrome版本中我也遇到了这个问题。 我在请求标头上添加了Authorization和我的访问令牌

fetch('https://example.com/endpoint', {
  method: 'GET',
  headers: {
    'Authorization': 'Bearer ' + accesstoken
  }  
})

我总是在Chrome中的响应标题上获得Access-Control-Allow-Headers:authorization 此外，我的提取始终是请求方法：选项（不显示GET），然后Status Code在Chrome中为200 OK

但如果我在Firefox（版本52.0.1）中运行相同的获取代码，一切都很好。我可以正确地在请求标头上添加Authorization。它不会在Firefox中的响应标头上显示Access-Control-Allow-Headers:authorization。它将在Request标题上显示Authorization: Bearer accesstoken。

服务器端已经为我的请求标头处理了CORS ..

这是Chrome错误还是我的代码错误？如何在Chrome中正确显示请求标题上的Authorization？

下图是 Chrome 开发工具中的详细信息网络：

下图是 Firefox 开发工具中的详细信息网络：

Answer 1

浏览器将在OPTIONS请求之前发送，没有授权令牌，然后将发送实际请求

http://www.w3.org/TR/cors/有关详情，请参阅http://metajack.im/2010/01/19/crossdomain-ajax-for-xmpp-http-binding-made-easy/

Answer 2

正如@stackdave所说，浏览器在跨域ajax的GET请求之前发送OPTIONS请求。然后浏览器将等待服务器响应。我的情况是服务器没有响应，所以浏览器只是停止OPTIONS状态。服务器需要处理这个问题，它仍然是CORS问题，而不是获取api bug或问题。