Cors跨域问题

CORS或“跨源资源共享”是指浏览器中运行的前端具有与后端进行通信的JavaScript代码，并且后端与前端具有不同的“来源”的情况。

Origin

Origin是协议（http，https），域（myapp.com，localhost，localhost.tiangolo.com）和端口（80、443、8080）的组合。
因此，所有这些都是不同的来源：
http://localhost
https://localhost * http://localhost:8080
即使它们都在localhost中，它们也使用不同的协议或端口，因此它们是不同的“origin”。

步骤

因此，假设您在浏览器中的http://localhost:8080上运行了一个前端，并且它的JavaScript试图与在http://localhost上运行的后端进行通信（因为我们没有指定端口，浏览器将采用默认端口80）。
然后，浏览器将向后端发送HTTP OPTIONS请求，如果后端发送了适当的标头，以授权来自该不同来源的通信（http://localhost:8080），则浏览器将让前端的JavaScript发送其请求到后端。
为此，后端必须具有“允许的来源”列表。
在这种情况下，前端必须包含http://localhost:8080才能正常工作。

通配符

也可以将列表声明为“*”（“通配符”）以表示所有内容都允许。
但这仅允许某些类型的通信，不包括涉及凭证的所有内容：Cookie，授权标头（如与Bearer Token一起使用的那些标头等）。
因此，为了使一切正常工作，最好明确指定允许的来源。

使用CORSMiddleware

您可以使用CORSMiddleware在FastAPI应用程序中对其进行配置。
导入CORSMiddleware
创建允许的来源列表（作为字符串）。
将其作为“中间件”添加到FastAPI应用程序。
您还可以指定后端是否允许：
凭证（授权标头，Cookie等）。
特定的HTTP方法（POST，PUT）或所有通配符“ ”。
特定的HTTP标头或所有通配符“ ”。

from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware
app = FastAPI()
origins = [
    "http://localhost.tiangolo.com",
    "https://localhost.tiangolo.com",
    "http://localhost",
    "http://localhost:8080",
]
app.add_middleware(
    CORSMiddleware,
    allow_origins=origins,
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)
@app.get("/")
async def main():
    return {"message": "Hello World"}

默认情况下，CORSMiddleware实现使用的默认参数是限制性的，因此您需要显式启用特定的来源，方法或标头，以便允许浏览器在跨域上下文中使用它们。
支持以下参数：
allow_origins - 允许进行跨域请求的来源列表。例如。 [‘https://example.org'，'https://www.example.org']。您可以使用[‘‘]允许任何来源。 allow_origin_regex - 一个正则表达式字符串，用于与应允许进行跨域请求的原点匹配。例如。 “ https：//. \ .example \ .org”。
allow_methods - 跨域请求应允许的HTTP方法列表。默认为[‘GET’]。您可以使用[‘‘]允许所有标准方法。
allow_headers - 跨域请求应支持的HTTP请求标头列表。默认为[]。您可以使用[‘‘]允许所有标题。对于CORS请求，始终允许使用Accept，Accept-Language，Content-Language和Content-Type标头。
allow_credentials - 表示跨域请求应支持cookie。默认为False。
exponse_headers - 指示应该使浏览器可以访问的任何响应头。默认为[]。
* max_age - 设置浏览器缓存CORS响应的最长时间（以秒为单位）。默认为60。
中间件响应两种特定类型的HTTP请求…

CORS 启用前请求

这些是任何带有Origin和Access-Control-Request-Method标头的OPTIONS请求。
在这种情况下，中间件将拦截传入的请求并以适当的CORS标头进行响应，并出于提供信息的目的而响应200或400。

简单的请求

任何带有Origin标头的请求。在这种情况下，中间件将照常通过请求，但在响应上将包含适当的CORS标头。

更多的信息

有关CORS的更多信息，请查看Mozilla CORS文档。