掃二維碼與項目經(jīng)理溝通
我們在微信上24小時期待你的聲音
解答本文疑問/技術咨詢/運營咨詢/技術建議/互聯(lián)網(wǎng)交流
CORS 或者「跨域資源共享」 指瀏覽器中運行的前端擁有與后端通信的 JavaScript 代碼,而后端處于與前端不同的「源」的情況。

專注于為中小企業(yè)提供成都網(wǎng)站制作、做網(wǎng)站服務,電腦端+手機端+微信端的三站合一,更高效的管理,為中小企業(yè)橫山免費做網(wǎng)站提供優(yōu)質的服務。我們立足成都,凝聚了一批互聯(lián)網(wǎng)行業(yè)人才,有力地推動了千余家企業(yè)的穩(wěn)健成長,幫助中小企業(yè)通過網(wǎng)站建設實現(xiàn)規(guī)模擴充和轉變。
源是協(xié)議(http,https)、域(myapp.com,localhost,localhost.tiangolo.com)以及端口(80、443、8080)的組合。
因此,這些都是不同的源:
即使它們都在 localhost 中,但是它們使用不同的協(xié)議或者端口,所以它們都是不同的「源」。
假設你的瀏覽器中有一個前端運行在 http://localhost:8080,并且它的 JavaScript 正在嘗試與運行在 http://localhost 的后端通信(因為我們沒有指定端口,瀏覽器會采用默認的端口 80)。
然后,瀏覽器會向后端發(fā)送一個 HTTP OPTIONS 請求,如果后端發(fā)送適當?shù)?headers 來授權來自這個不同源(http://localhost:8080)的通信,瀏覽器將允許前端的 JavaScript 向后端發(fā)送請求。
為此,后端必須有一個「允許的源」列表。
在這種情況下,它必須包含 http://localhost:8080,前端才能正常工作。
也可以使用 "*"(一個「通配符」)聲明這個列表,表示全部都是允許的。
但這僅允許某些類型的通信,不包括所有涉及憑據(jù)的內容:像 Cookies 以及那些使用 Bearer 令牌的授權 headers 等。
因此,為了一切都能正常工作,最好顯式地指定允許的源。
你可以在 FastAPI 應用中使用 CORSMiddleware 來配置它。
你也可以指定后端是否允許:
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ù):
中間件響應兩種特定類型的 HTTP 請求……
這是些帶有 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。

我們在微信上24小時期待你的聲音
解答本文疑問/技術咨詢/運營咨詢/技術建議/互聯(lián)網(wǎng)交流