FastAPI 如何配置 CORS 跨域?

文章导读
Previous Quiz Next 跨源资源共享 (CORS) 是指运行在客户端浏览器上的前端应用试图通过 JavaScript 代码与后端通信,而后端位于与前端不同的“origin”时的场景。此处的 origin 是协议、域名和端口号的组合。因此,http://local
📋 目录
  1. 示例 - 使用 CORS
A A

FastAPI - CORS



Previous
Quiz
Next

跨源资源共享 (CORS) 是指运行在客户端浏览器上的前端应用试图通过 JavaScript 代码与后端通信,而后端位于与前端不同的“origin”时的场景。此处的 origin 是协议、域名和端口号的组合。因此,http://localhosthttps://localhost 具有不同的 origin。

如果浏览器从一个 origin 的 URL 发送请求,执行来自另一个 origin 的 JavaScript 代码,浏览器会发送 OPTIONS HTTP 请求。

如果后端通过发送适当的 headers 来授权来自该不同 origin 的通信,则允许前端的 JavaScript 发送请求到后端。为此,后端必须维护一个“允许的 origins”列表。

示例 - 使用 CORS

要显式指定允许的 origins,请导入 CORSMiddleware,并将 origins 列表添加到 app 的 middleware 中。

main.py

from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware

app = FastAPI()

origins = [
   "http://192.168.211.:8000",
   "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"}