使用wai-cors正确配置CORS

Question

我正在为Servant和CORS配置而苦苦挣扎:我正在通过Servant公开和API，我有以下配置：

-- Wai application initialization logic
initializeApplication :: IO Application
initializeApplication = do
  let frontCors = simpleCorsResourcePolicy { corsOrigins = Just ([pack "https://xxxx.cloudfront.net"],  True)
                                           , corsMethods = ["OPTIONS", "GET", "PUT", "POST"]
                                           , corsRequestHeaders = simpleHeaders }
  return
    $ cors (const $ Just $ frontCors)
    $ serve (Proxy @API)
    $ hoistServer (Proxy @API) toHandler server

当我通过Chromium执行这样的查询时(通过复制和粘贴)：

curl 'https://api.xxx/' \
  -H 'Accept: application/json, text/plain, */*' \
  -H 'Referer: https://xxx.cloudfront.net' \
  -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.111 Safari/537.36' \
  -H 'Authorization: Bearer XXX==' \
  --compressed

它可以工作，但如果我在开发控制台中复制-粘贴fetch查询：

fetch("https://api.xxx", {
  "headers": {
    "accept": "application/json, text/plain, */*",
    "authorization": "Bearer XXX=="
  },
  "referrer": "https://xxx.cloudfront.net/",
  "referrerPolicy": "no-referrer-when-downgrade",
  "body": null,
  "method": "GET",
  "mode": "cors",
  "credentials": "include"
});

我得到了：

> Access to fetch at 'https://api.xxx' from origin 'https://xxx.cloudfront.net' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
polyfills-es2015.3eb4283ca820c86b1337.js:1 GET https://api.xxx net::ERR_FAILED
e.fetch @ polyfills-es2015.3eb4283ca820c86b1337.js:1
>  (anonymous) @ VM20:1
> x:1 Uncaught (in promise) TypeError: Failed to fetch

对此有什么提示吗？尤其是为什么它可以在cUrl中运行，而不能在Chromium中运行？提前谢谢。

Answer 1

这是一个基本的CORS问题，事实上，在corsRequestHeaders中发送没有它的Authorization会导致请求被拒绝。

我应该写下：

, corsRequestHeaders = ["Authorization", "Content-Type"]