从React读取Cookie (后端使用FastAPI + fastapi-jwt-auth)

从React读取Cookie是指在React前端应用中获取浏览器中存储的Cookie信息。Cookie是一种在客户端存储数据的机制，用于跟踪用户会话、存储用户偏好设置等。

要从React中读取Cookie，可以使用JavaScript的document.cookie属性来访问当前页面的Cookie。以下是一个示例代码：

const cookieValue = document.cookie
  .split('; ')
  .find(row => row.startsWith('cookieName='))
  .split('=')[1];

上述代码中，我们首先使用split('; ')将所有的Cookie分割成一个数组，然后使用find方法找到以"cookieName="开头的那一行，最后使用split('=')将该行分割成键值对，并取得值。

在后端使用FastAPI + fastapi-jwt-auth时，可以通过设置Cookie的方式将用户的身份信息传递给前端。在FastAPI中，可以使用Response类的set_cookie方法来设置Cookie。以下是一个示例代码：

from fastapi import FastAPI, Response
from fastapi_jwt_auth import AuthJWT

app = FastAPI()
authjwt = AuthJWT()

@app.post("/login")
def login(response: Response, authjwt: AuthJWT):
    # 在此处进行用户身份验证，验证通过后生成JWT令牌
    access_token = authjwt.create_access_token(identity=user_id)
    response.set_cookie(key="access_token", value=access_token, httponly=True)
    return {"message": "Login successful"}

上述代码中，我们通过调用response.set_cookie方法来设置名为"access_token"的Cookie，并将生成的JWT令牌作为值传递给前端。设置httponly=True可以防止JavaScript代码直接访问该Cookie，提高安全性。

在React中读取该Cookie的代码示例如下：

const cookieValue = document.cookie
  .split('; ')
  .find(row => row.startsWith('access_token='))
  .split('=')[1];

上述代码中，我们通过查找名为"access_token"的Cookie来获取JWT令牌的值。

推荐的腾讯云相关产品：腾讯云云服务器（ECS）、腾讯云对象存储（COS）、腾讯云数据库（TencentDB）等。您可以访问腾讯云官网（https://cloud.tencent.com/）了解更多产品信息和文档。