CORS 中间件

目录

CORS 中间件用于解决前端页面调用 API 时可能出现的跨域访问问题。对于前后端分离的项目来说，这是非常常用的配置。

先理解什么是 CORS？

CORS（Cross-Origin Resource Sharing，跨域资源共享）是浏览器的一种安全机制。当前端页面（比如运行在 http://localhost:3000）想调用另一个域名的 API（比如 http://localhost:8000）时，浏览器会默认阻止这种“跨域”请求，以防止潜在的安全风险。

添加 CORS 中间件就是告诉浏览器：“允许特定的外部域名访问我的 API”。

逐参数解释代码

# 首先需要从 fastapi.middleware.cors 导入 CORSMiddleware
from fastapi.middleware.cors import CORSMiddleware

# 给 app 添加 CORS 中间件
app.add_middleware(
    CORSMiddleware,  # 指定要添加的中间件类型
    allow_origins=["*"],  # 允许哪些域名访问（* 表示允许所有域名）
    allow_credentials=True,  # 是否允许携带 Cookie 等身份凭证
    allow_methods=["*"],  # 允许哪些 HTTP 方法（GET、POST、PUT 等，* 表示所有）
    allow_headers=["*"],  # 允许请求中携带哪些 HTTP 头信息（* 表示所有）
)

每个参数的具体作用

  1. CORSMiddleware
    这是 FastAPI 提供的 CORS 处理中间件，专门用于处理跨域请求的权限控制。中间件会在每个请求到达你的 API 之前先做一层检查，判断这个请求是否符合跨域规则。

  2. allow_origins=["*"]

    • 控制“允许哪些域名的前端页面”访问你的 API。
    • ["*"] 是开发阶段的简化配置，表示“允许所有域名”（包括 http://localhost:3000、https://example.com 等）。
    • 生产环境中通常需要指定具体域名，比如 ["https://yourfrontend.com"]，更安全。

  3. allow_credentials=True

    • 控制是否允许前端请求携带身份凭证（如 Cookie、Token 等）。
    • 如果你的 API 需要用户登录（比如通过 Cookie 保持登录状态），就需要设为 True。

  4. allow_methods=["*"]

    • 控制允许哪些 HTTP 方法（GET、POST、PUT、DELETE 等）。
    • ["*"] 表示允许所有方法，也可以指定具体方法，比如 ["GET", "POST"]。

  5. allow_headers=["*"]

    • 控制允许请求中携带哪些自定义头信息（比如 Authorization 头用于传递 Token）。
    • ["*"] 表示允许所有头信息，也可以指定具体头，比如 ["Content-Type", "Authorization"]。

生产环境的安全配置

开发阶段用 ["*"] 很方便，但生产环境建议收紧权限，比如：

app.add_middleware(
    CORSMiddleware,
    allow_origins=["https://yourfrontend.com", "https://admin.yourfrontend.com"],  # 只允许特定域名
    allow_credentials=True,
    allow_methods=["GET", "POST", "PUT", "DELETE"],  # 只允许需要的方法
    allow_headers=["Content-Type", "Authorization"],  # 只允许必要的头信息
)
posted @ 2025-08-21 18:04  Filament  阅读(7)  评论(0)    收藏  举报
返回顶端