为什么会出现 CORS 错误原因：CORS 请求未成功

Question

我正在开发一个svelte应用程序，它使用FastAPI后端与我的组织本地的PostgreSQL数据库交互，而不是在我的AWS EC2实例上。

我使用 javascript 的 fetch api 向我的后端发送请求，以查询数据库中的各种内容，在我的本地计算机上，所有这些请求都会在两端收到，但在 AWS 上，来自我前端的请求甚至无法被 fastAPI 后端识别。

我对设置这样的服务器相当缺乏经验，所以我认为我在设置这些服务器时存在一些基本错误，导致它们在 AWS 上无法进行通信。

fastapi 代码如下所示：

import uvicorn
from fastapi import (Depends, FastAPI, HTTPException, Query,
                     Request)
from fastapi.middleware.cors import CORSMiddleware


app = FastAPI(debug=True)

origins = [
    '*'
]

app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)


@app.get("/")
async def root():
    return {"message": "Hello World"}

if __name__ == '__main__':
    uvicorn.run(app, host="0.0.0.0", port=8000)

我的获取请求通常如下所示：

const endpoint = public_IP:8000 + `/`;

let objs = [];

fetch(endpoint)
    .then(response => {
        if (!response.ok) {
            throw Error(response.statusText);
        }
        return response.json();
    })

当我发送像上面这样的获取请求时，我收到 CORS 错误，原因是：CORS 请求未成功。FastAPI 服务器没有反馈，请求似乎从未到达它，我不确定为什么。据我所知，这通常与 HTTP 和 HTTPS 请求之间的问题有关，但这些似乎与我的问题无关，因为我的设置没有任何部分不使用 HTTP。使用 chrome 时出现错误：无法加载资源：net::ERR_CONNECTION_REFUSED。

我的 EC2 实例的 AWS 安全组允许从任何 IP 到端口 5000 和 8000 的 TCP 流量。这是我的两个应用程序（分别是 Svelte 和 FastAPI）的托管位置。

Answer 1

最有可能的是，fastapi 应用程序中的端点引发了异常。当出现这种情况时，CORSMiddleware安装的viaapp.add_middleware(...)看不到任何HTTP响应，并且没有机会对FastAPI错误处理程序生成的HTTP响应执行其工作。

解决方案是使用 CORSMiddleware 包装整个 FastAPI 应用程序，如下所示：

import uvicorn
from fastapi import (Depends, FastAPI, HTTPException, Request
from fastapi.middleware.cors import CORSMiddleware


app = FastAPI(debug=True)

origins = [
    '*'
]


@app.get("/")
async def root():
    return {"message": "Hello World"}


app = CORSMiddleware(
    app=app,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

if __name__ == '__main__':
    uvicorn.run(app, host="0.0.0.0", port=8000)

Answer 2

概括

CORS 错误有时会令人困惑，因为错误消息不够清晰，而且有很多可能的解决方案。

第一种可能性

• 例如，如果您从给定主机加载页面，0.0.0.0然后尝试向另一个主机发出请求，127.0.0.1该请求将被阻止以防止 XSS 攻击

将您的主机从 更改0.0.0.0为127.0.0.1应该可以解决此问题。

第二种可能

如果您是 Mozillian，Mozilla 中存在错误[请参阅，请参阅]，但如果是这种情况，您的代码应该可以在其他浏览器中运行

解决方案：您必须分别在每个端口上启用证书。

其他可能性

尝试更改您的端点

const endpoint = public_IP:8000 + `/`;

对此

const endpoint = `/`;