如何用get_token接口返回的JWT认证FastAPI的OpenAPI/Swagger UI页面？

方法1：手动在Swagger UI中输入令牌 #

这是最直接的临时方案，步骤简单：

• 先调用公开的get_token端点拿到JWT令牌，比如用命令行：

  curl -X POST "http://你的API域名/get_token" -H "Content-Type: application/x-www-form-urlencoded" -d "username=你的账号&password=你的密码"
  

• 打开FastAPI的/docs页面，点击右上角的Authorize按钮
• 在弹出框里选Bearer类型，把拿到的JWT直接粘贴到输入框（不用加Bearer 前缀，Swagger UI会自动补全）
• 点Authorize确认，之后页面上所有受保护的端点都会自动带上这个令牌发起请求，和用内置认证按钮的效果完全一致

方法2：修改FastAPI配置，让Swagger UI自动调用get_token #

如果想让用户在Swagger UI里直接完成认证流程，不用手动复制令牌，可以自定义Swagger的初始化配置：

from fastapi import FastAPI
from fastapi.openapi.docs import get_swagger_ui_html

app = FastAPI(docs_url="/docs")

# 重写默认的/docs路由，自定义Swagger UI配置
@app.get("/docs", include_in_schema=False)
async def custom_swagger_ui():
    return get_swagger_ui_html(
        openapi_url=app.openapi_url,
        title=f"{app.title} - 接口文档",
        swagger_ui_init_oauth={
            "tokenUrl": "/get_token",  # 指定你的公开令牌端点
            "clientId": "你的OAuth2客户端ID",  # 没有的话可以留空
            "scopes": [],
            "usePkceWithAuthorizationCodeGrant": False
        }
    )

修改后，用户点击Authorize按钮时，Swagger UI会自动调用你配置的get_token端点，输入用户名密码后就能直接完成页面认证，和内置认证逻辑完全对齐。

方法3：浏览器控制台手动注入令牌（临时测试用） #

如果只是自己测试，不想走流程，可以直接在浏览器控制台把令牌塞进Swagger的存储：

• 先拿到JWT令牌，比如const token = "你的JWT字符串"
• 在/docs页面按F12打开控制台，输入：

  localStorage.setItem("swagger-ui-auth", JSON.stringify({
    "Bearer": {
      "value": token,
      "name": "Bearer",
      "type": "http"
    }
  }));
  

• 刷新页面，Swagger UI会自动读取这个存储的令牌，所有受保护端点都会自动带上认证头

核心原理 #

FastAPI的Swagger UI是靠浏览器的localStorage保存认证状态的，只要把JWT令牌按照Swagger的格式存入swagger-ui-auth这个key，页面就会自动识别并应用到所有请求，和用内置Authorize按钮的效果一模一样。

内容的提问来源于stack exchange，提问作者writes_on