這個問題是由於fastapi內建的介面文件使用的外網的cdn

我們在瀏覽器開發者工具中可以看到它請求了一個js指令碼，這個指令碼部署在國外，國內無法訪問，導致頁面卡死在這裡，顯示空白。

知道這個以後，我們可以講這些靜態資源配置到自己的本地，這些靜態資源都在github上開源。

swagger-ui

redoc

上面兩個連結分別是fastapi兩種模式下文件介面所需的靜態資源開源地址。

這裡我抽取出我們所需要的最少的資源放在我的百度網盤。

靜態資源連結

將靜態資源下載後放到專案的根目錄下，像下圖這樣

 然後我們需要在python直譯器環境(或虛擬環境)下Lib/site-package/fastapi/openapi/docs.py檔案

修改裡面的靜態資源訪問路徑

 可以註釋檔案原有的部分內容，再將複製下面的內容複製進去：

swagger_js_url: str="/static/swagger-ui/swagger-ui-bundle.js",

swagger_css_url: str="/static/swagger-ui/swagger-ui.css",

swagger_favicon_url: str="/static/swagger-ui/favicon.png",

redoc_js_url: str = "/static/redoc/bundles/redoc.standalone.js",

redoc_favicon_url: str 
 
= "/static/redoc/favicon.png"

最後在主程式中新增如下程式碼：

app.mount('/static', StaticFiles(directory='static'),

name='static')

告訴fastapi以/static開始的路徑從static目錄中找。

from fastapi import FastAPI
from fastapi.staticfiles import StaticFiles
from fastapi.responses import HTMLResponse

app = FastAPI()

如果你的專案結構（靜態資源目錄）和docs.py配置與筆者完全相同，那麼你再次啟動時訪問/docs和/redoc就應該不會有問題了。（如果你修改了靜態資源目錄結構，你需要對應修改docs.py中對應的路由）

成功執行結果如下：