这个访问令牌是如何存储在客户端的，参见FastAPI的教程“Simple OAuth2 with Password and Bearer”

总的来说，我对 FastAPI 和 OAuth2 还很陌生。我刚刚完成了教程“带有密码和承载的简单 OAuth2” https://fastapi.tiangolo.com/tutorial/security/simple-oauth2/这基本上是有道理的，但有一步对我来说就像魔法一样……

访问令牌如何存储到客户端并随后传递到客户端的请求中？

我对流程的理解基本上是

1. 用户使用他们的用户名和密码进行身份验证（这些内容被发布到/token终点）。
2. 用户的凭据经过验证，并且/token端点返回访问令牌（johndoe) 在一些 JSON 中。 （这是用户接收访问令牌的方式）
3. ???
4. 用户向专用端点发出后续请求，例如GET /users/me。用户的请求包含 headerAuthorization: Bearer johndoe。 （我认为文档没有提到这一点，但这是我通过检查 Chrome 开发者工具中的请求收集到的信息）
5. 然后使用授权令牌来查找在 (4) 中发出请求的用户

步骤（3）是我不明白的部分。访问令牌似乎如何存储在客户端上，然后作为标头传递到下一个请求中？

Demo

当您运行教程中的代码时，您将获得以下 swagger 文档。 （注意授权按钮。）

I click Authorize and enter my credentials. (username: johndoe, password: secret)

现在我可以访问/users/me端点。

注意标题如何Authorization: Bearer johndoe自动包含在我的请求中。

最后的注释：

1. 我检查了我的 cookie、会话存储和本地存储，全部都是空的
2. 如果刷新页面或打开新选项卡，授权标头就会消失

我怀疑 Swagger 正在暗中做事，但我无法证实。

如果您需要令牌的持久性，您通常会使用 localStorage 或类似的，但在 SwaggerUI 的特定情况下，身份验证信息保存在库内部。

如果您启用了持久性 SwaggerUI将把访问令牌持久保存到 localStorage https://github.com/swagger-api/swagger-ui/blob/cc408812fc927e265da158bf68239530740ab4cc/src/core/plugins/auth/actions.js#L274:

export const persistAuthorizationIfNeeded = () => ( { authSelectors, getConfigs } ) => {
  const configs = getConfigs()
  if (configs.persistAuthorization)
  {
    const authorized = authSelectors.authorized()
    localStorage.setItem("authorized", JSON.stringify(authorized.toJS()))
  }
}