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])
})

当我尝试登录时，可以看到发送了预检OPTIONS请求，并返回了正确的响应：

请求标头（OPTIONS请求）

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

响应标题（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请求发送后，我得到以下响应：

响应标题（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响应导致客户端上出现以下错误消息：

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'.

我尝试谷歌搜索并搜索stackoverflow寻找解决方案，但找不到任何东西。有任何想法吗？

Answer 1

我解决了我的问题。

问题是 Apollo Server 默认添加了 CORS 中间件，它覆盖了我的 CORS 设置。从阿波罗的文档：

提供 false 以完全删除 CORS 中间件，或提供 true 以使用中间件的默认配置。

默认值是true。

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

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

进一步参考：

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