FastAPI教程 CORS（跨域資源共享）

CORS 或者「跨域資源共享」 指瀏覽器中運行的前端擁有與后端通信的 JavaScript 代碼，而后端處于與前端不同的「源」的情況。

源

源是協(xié)議（http，https）、域（myapp.com，localhost，localhost.tiangolo.com）以及端口（80、443、8080）的組合。

因此，這些都是不同的源：

• http://localhost
• https://localhost
• http://localhost:8080

即使它們都在 localhost 中，但是它們使用不同的協(xié)議或者端口，所以它們都是不同的「源」。

步驟

假設你的瀏覽器中有一個前端運行在 http://localhost:8080，并且它的 JavaScript 正在嘗試與運行在 http://localhost 的后端通信（因為我們沒有指定端口，瀏覽器會采用默認的端口 80）。

然后，瀏覽器會向后端發(fā)送一個 HTTP OPTIONS 請求，如果后端發(fā)送適當?shù)?headers 來授權(quán)來自這個不同源（http://localhost:8080）的通信，瀏覽器將允許前端的 JavaScript 向后端發(fā)送請求。

為此，后端必須有一個「允許的源」列表。

在這種情況下，它必須包含 http://localhost:8080，前端才能正常工作。

通配符

也可以使用 "*"（一個「通配符」）聲明這個列表，表示全部都是允許的。

但這僅允許某些類型的通信，不包括所有涉及憑據(jù)的內(nèi)容：像 Cookies 以及那些使用 Bearer 令牌的授權(quán) headers 等。

因此，為了一切都能正常工作，最好顯式地指定允許的源。

使用 CORSMiddleware

你可以在 FastAPI 應用中使用 CORSMiddleware 來配置它。

• 導入 CORSMiddleware。
• 創(chuàng)建一個允許的源列表（由字符串組成）。
• 將其作為「中間件」添加到你的 FastAPI 應用中。

你也可以指定后端是否允許：

• 憑證（授權(quán) headers，Cookies 等）。
• 特定的 HTTP 方法（POST，PUT）或者使用通配符 "*" 允許所有方法。
• 特定的 HTTP headers 或者使用通配符 "*" 允許所有 headers。

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 實現(xiàn)所使用的默認參數(shù)較為保守，所以你需要顯式地啟用特定的源、方法或者 headers，以便瀏覽器能夠在跨域上下文中使用它們。

支持以下參數(shù)：

• allow_origins - 一個允許跨域請求的源列表。例如 ['https://example.org', 'https://www.example.org']。你可以使用 ['*'] 允許任何源。
• allow_origin_regex - 一個正則表達式字符串，匹配的源允許跨域請求。例如 'https://.*\.example\.org'。
• allow_methods - 一個允許跨域請求的 HTTP 方法列表。默認為 ['GET']。你可以使用 ['*'] 來允許所有標準方法。
• allow_headers - 一個允許跨域請求的 HTTP 請求頭列表。默認為 []。你可以使用 ['*'] 允許所有的請求頭。Accept、Accept-Language、Content-Language 以及 Content-Type 請求頭總是允許 CORS 請求。
• allow_credentials - 指示跨域請求支持 cookies。默認是 False。另外，允許憑證時 allow_origins 不能設定為 ['*']，必須指定源。
• expose_headers - 指示可以被瀏覽器訪問的響應頭。默認為 []。
• max_age - 設定瀏覽器緩存 CORS 響應的最長時間，單位是秒。默認為 600。

中間件響應兩種特定類型的 HTTP 請求……

CORS 預檢請求

這是些帶有 Origin 和 Access-Control-Request-Method 請求頭的 OPTIONS 請求。

在這種情況下，中間件將攔截傳入的請求并進行響應，出于提供信息的目的返回一個使用了適當?shù)?CORS headers 的 200 或 400 響應。

簡單請求

任何帶有 Origin 請求頭的請求。在這種情況下，中間件將像平常一樣傳遞請求，但是在響應中包含適當?shù)?CORS headers。

更多信息

更多關于 CORS 的信息，請查看 Mozilla CORS 文檔。

技術細節(jié)

你也可以使用 from starlette.middleware.cors import CORSMiddleware。

出于方便，F(xiàn)astAPI 在 fastapi.middleware 中為開發(fā)者提供了幾個中間件。但是大多數(shù)可用的中間件都是直接來自 Starlette。