CORS 预检响应与实际响应不匹配

Question

在我的 node.js 服务器中，我包含了 CORS 作为中间件，如下所示：

app.use(cors({ origin: 'http://<CORRECT_ORIGIN_URL>:3030', credentials: true }))

我在发送请求的应用程序中使用 Apollo Client，并在初始化 ApolloClient 时将凭据设置为 'include'，如下所示：

// Create a WebSocket link
const wsLink = process.browser ? new WebSocketLink({
    uri: `ws://<CORRECT_REQUEST_URL>:8000/graphql`,
    options: {
        reconnect: true,
    },
}) : null

// Create an http link (use batch, allow cookies response from server)
const httpLink = new BatchHttpLink({
    uri: 'http://<CORRECT_REQUEST_URL>/api/',
    credentials: 'include'
})


// Split terminating link for websocket and http requests
const terminatingLink = process.browser ? split(
    ({ query }) => {
        const { kind, operation } = getMainDefinition(query)
        return kind === 'OperationDefinition' && operation === 'subscription'
    },
    wsLink,
    httpLink,
) : httpLink

// Create Apollo client
const client = new ApolloClient({
    link: ApolloLink.from([authLink, errorLink, terminatingLink])
})

当我尝试 sign-in 时，我可以看到发送了预检选项请求并得到了正确的响应：

请求Headers（OPTIONS请求）

Access-Control-Request-Headers: content-type
Access-Control-Request-Method: POST
Origin: http://<CORRECT_ORIGIN_URL>:3030
Referer: http://<CORRECT_ORIGIN_URL>/login

响应Headers（OPTIONS请求）

Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: content-type
Access-Control-Allow-Methods: GET,HEAD,PUT,PATCH,POST,DELETE
Access-Control-Allow-Origin: http://<CORRECT_ORIGIN_URL>:3030
Connection: keep-alive
Content-Length: 0
Date: Wed, 20 Mar 2019 03:09:14 GMT
Server: nginx/1.15.5 (Ubuntu)
Vary: Origin, Access-Control-Request-Headers
X-Powered-By: Express

然而当发送实际的 POST 请求时，我收到以下响应：

响应Headers（POST请求）

Access-Control-Allow-Credentials: true
Access-Control-Allow-Origin: *
Connection: keep-alive
Content-Encoding: gzip
Content-Type: application/json
Date: Wed, 20 Mar 2019 03:09:15 GMT
Server: nginx/1.15.5 (Ubuntu)
Transfer-Encoding: chunked
Vary: Accept-Encoding, Origin
X-Powered-By: Express

我不知道为什么 post 请求中的响应 headers 不同，而选项预检显示它应该是正确的。

这种不正确的 POST 响应导致客户端出现以下错误消息：

Access to fetch at 'http://<CORRECT_REQUEST_URL/api/' from origin
'http://<CORRECT_ORIGIN_URL>:3030' has been blocked by CORS policy: 
The value of the 'Access-Control-Allow-Origin' header in the response 
must not be the wildcard '*' when the request's credentials mode is
'include'.

我已经尝试使用谷歌搜索和搜索 Whosebug 来寻找解决方案，但找不到任何东西。有什么想法吗？

Answer 1

我在 Express 服务前遇到了与 apache2 代理运行类似的问题。代理正在缓存一些（只有一些！）响应。这是我添加到 apache 配置中的内容，它解决了问题：

Header set Cache-Control "no-cache, must-revalidate"    env=no-cache-headers
Header set Pragma        "no-cache"                     env=no-cache-headers
Header set Expires       "Sat, 1 Jan 2000 00:00:00 GMT" env=no-cache-headers

Answer 2

我解决了我的问题。

问题是 Apollo Server 默认添加了 CORS 中间件，这覆盖了我的 CORS 设置。来自 Apollo's documentation:

Provide false to remove CORS middleware entirely, or true to use your middleware's default configuration.

The default value is true.

为了解决这个问题，我只需要在 Apollo 中禁用 CORS 功能，这只需要在 .applyMiddleware 中设置 cors: false，如下所示：

server.applyMiddleware({
    app,
    path: '/',
    cors: false,
});

进一步参考：

https://github.com/expressjs/cors/issues/134#issuecomment-413543241

CORS 预检响应与实际响应不匹配

CORS preflight response doesn't match actual response

node.js

cors

express

apollo

apollo-server