javascript - 如何为以 docker 身份运行的两个应用程序设置 CORS

Question

我正在 https://editor.website.com 运行我的前端应用程序 (nextJS)我的后端应用程序(expressJS)位于 https://api.editor.website.com - 两者都作为 docker 容器。 我正在尝试使用 graphQL 上传一些图像文件，大多数情况下它可以工作，但有时会因这两个错误而失败:

POST https://api.editor.website.com/graphql 413

Access to fetch at 'https://api.editor.website.com/graphql' from origin 'https://editor.website.com' has been blocked by CORS policy: 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.

我尝试设置通用cors来防止这个问题，但这不起作用。那么我错过了什么？

服务器

import express from 'express'
import cors from 'cors'

const app = express()
app.options('*', cors())
// app.use(cors())

server.applyMiddleware({ app, path: '/graphql' })

Answer 1

如果它在大多数情况下都有效，我认为它与 CORS 无关(您可能会收到 CORS 错误，因为如果您没有命中链中的中间件，另一个终止它)。据我所知，您收到413 - 请求实体太大。

我对 Apollo 服务器端没有太多经验，但您应该根据 Apollo API Reference 尝试以下操作:

server.applyMiddleware({
    app, path: '/graphql',
    cors: {
        origin: 'https://editor.website.com',
        optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204
    },
    bodyParserConfig: {limit: '50mb'} // or your desired limit
})

编辑:

我们在聊天中继续讨论，发现服务前面有一个 nginx 反向代理，其请求大小限制为 1MB。这解决了问题:https://github.com/jwilder/nginx-proxy/issues/981#issuecomment-345434827