【FastAPI 學習筆記 EP.26】CORS 跨來源資源共享

什麼是 CORS？

CORS 是瀏覽器的安全機制，會自動阻擋網頁向不同「來源」發出的 API 請求。

CORS 基礎語法

1. 從 fastapi.middleware.cors 匯入 CORSMiddleware，使用 app.add_middleware() 掛載，而非 @app.middleware() 裝飾器。
2. allow_origins：允許的來源清單，開發時可暫用 ["*"] 允許所有來源
3. allow_methods：允許的 HTTP 方法，["*"] 代表全部。
4. allow_headers：允許前端帶入的 Header，使用非簡單 Header（如 Authorization）時需明確列出；["*"] 允許全部。
5. allow_credentials=True：允許請求攜帶 Cookie 或 Authorization，此時 allow_origins 不可使用 ["*"]，須明確列出來源。

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

app = FastAPI()

app.add_middleware(
    CORSMiddleware,
    allow_origins=[
        "http://localhost:3000",
        "https://www.example.com",
    ],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

@app.get("/")
def read_root():
    return {"message": "CORS 已設定完成"}