FastAPI中解决 SwaggerUI 加载不出来的情况

FastAPI中解决 SwaggerUI 加载不出来的情况

前言：

国内环境原因或局域网问题静态资源无法加载，我们需要将静态资源下载到本地后替换FastAPI中默认的引用。

一：下载静态资源

https://wwsm.lanzouy.com/i682Q1frjnmd 密码:9zw2  

下载好的目录结构为：

将其放在主文件夹的下一目录下

二：挂载静态路由

app.mount("/static", StaticFiles(directory="static"), name="static")

三：将FastAPI中 SwaggerUI 的路径替换为本地静态资源

1. get_swagger_ui_html 实现docs

不用找，导入即可

from fastapi.openapi.docs import get_swagger_ui_html

@app.get("/docs", include_in_schema=False)
async def custom_swagger_ui_html():
    return get_swagger_ui_html(
        openapi_url="/openapi.json",
        title="xx",
        # oauth2_redirect_url=app.swagger_ui_oauth2_redirect_url,
        swagger_js_url='/static/swagger/swagger-ui-bundle.js',
        swagger_css_url='/static/swagger/swagger-ui.css',
        swagger_favicon_url='/static/swagger/img.png',
    )

2. get_redoc_html 实现redoc

from fastapi.openapi.docs import get_redoc_html

@app.get("/redoc", include_in_schema=False)
async def redoc_html():
    return get_redoc_html(
        openapi_url=app.openapi_url,
        title=app.title + " - ReDoc",
        redoc_js_url="/static/swagger/redoc.standalone.js",
    )

四：去除原来的路由地址

五：启动即可实现

可以打断点测试一下是否用的是本地的静态资源

总体代码

import uvicorn
from fastapi import FastAPI
from starlette.middleware.cors import CORSMiddleware
from fastapi.staticfiles import StaticFiles
from fastapi.openapi.docs import get_swagger_ui_html, get_redoc_html

app = FastAPI()
app.mount("/static", StaticFiles(directory="static"), name="static")


@app.get("/docs", include_in_schema=False)
async def custom_swagger_ui_html():
    return get_swagger_ui_html(
        openapi_url="/openapi.json",
        title="xx",
        # oauth2_redirect_url=app.swagger_ui_oauth2_redirect_url,
        swagger_js_url='/static/swagger/swagger-ui-bundle.js',
        swagger_css_url='/static/swagger/swagger-ui.css',
        swagger_favicon_url='/static/swagger/img.png',
    )


@app.get("/redoc", include_in_schema=False)
async def redoc_html():
    return get_redoc_html(
        openapi_url=app.openapi_url,
        title=app.title + " - ReDoc",
        redoc_js_url="/static/swagger/redoc.standalone.js",
    )