后端返回"Access-Control-Allow-Origin"标头两次，每次都有不同的值

Question

我使用Python的FastAPI来管理我的前端服务器的API和Axios钩子。

下面是处理服务器上CORS策略细节的代码片段:

origins = ["http://localhost:3000"]
*****some code here*****
app = FastAPI(
title=settings.PROJECT_NAME,
version="1.0",
docs_url=f"{settings.API_V1_STR}/docs",
openapi_url=f"{settings.API_V1_STR}/openapi.json",
)
app.container = app
app.add_middleware(
CORSMiddleware,
allow_origins=origins,
allow_credentials=True,
allow_methods=["*"],
allow_headers=["*"],
)
app.include_router(api_router, prefix=settings.API_V1_STR)

这是我通过Axios-hooks在前端使用的相关钩子:

const [
{
response: marketResponse,
loading: marketLoading,
error: marketError,
},
] = useAxios({
url: serverURL("market/list"),
method: "GET",
});

重要的是要注意，我已经仔细检查了允许的原点。

问题:

当我的web应用程序通过上述axios钩子请求列表时，出现以下错误:

前端HTTP错误

这里是网络选项卡的标头信息:

网络报头信息

你会注意到Access-Control-Allow-Origin出现了2倍!第一次是大写字母，第二次是全小写字母。我认为这个问题在某种程度上源于这个标题。不幸的是，我找不到一种特殊的方法来修复它。

谢谢你的帮助!

谷歌搜索了多个类似的问题，并研究了Axios和;快速Api文档。遗憾的是，连一点解决办法都找不到。

Answer 1

问题

这实际上是Starlette cor中间件的一个已知问题。所以问题是，Starlette corsmidleware添加的起源头没有检查它是否已经存在。这是故意的。

FastAPI正在封装这个模块。

如果你看一下实际的Starlette代码，你会发现它会转到这一行。

说明了Access-Control-Allow-Origin的大写版本。

为什么会发生这种情况呢?

多个服务器正在运行。一个已知的问题是，如果您使用python-socketio，那么套接字将添加自己版本的头。

我注意到这一行:

app.container = app

这是什么原因?你能试着把它注释掉然后重新运行代码吗?

检查你的NGINX是否设置了CORS。