如何将我的 JWT 令牌存储在我的状态中?

Posted

技术标签:

【中文标题】如何将我的 JWT 令牌存储在我的状态中?【英文标题】:How can I store my JWT Token in my state? 【发布时间】:2022-01-14 16:31:39 【问题描述】:

userAction.js -> 前端,动作

export const login = (userID, password) => async (dispatch) => 
    try 
        dispatch( type: USER_LOGIN_REQUEST );
       
        const url = "http://localhost:8080/authenticate/";
        const config = 
          auth: 
            username: userID,
            password,

          ,
        ;
    
        const data = ;
        const response = await axios.post(
            url, 
            data, 
            config,
            
        )

        dispatch( type: USER_LOGIN_SUCCESS, payload: config);
        
 
        if (response.status === 200) 
          // Login succeeded
          const token = response.data.token;
          console.log("TOKEN\n" + token);
          config.token = response.data.token;
          console.log(response.data.token);
          
        
        
        localStorage.setItem("userInfo", JSON.stringify(config) );
    

我在 REST 服务器中的登录功能:

exports.login = async (req,res) =>

  const b64auth = (req.headers.authorization || '').split(' ')[1] || '';
  const [userID, password] = Buffer.from(b64auth, 'base64').toString().split(':');
  const user = await User.findOne( userID: userID );
  if(!user) return res.status(400).send('User not found');
  const validPass = await bcrypt.compare(password, user.password);
  if(!validPass) return res.status(400).send('Incorrect Password');

  //const token = generateToken(user.userID);
  let payload = 
    userID: user.userID
  
  const token = generateToken(userID);
  
  res.header('Authorization', 'Bearer ' + token).json(token);
  console.log(user);
  return res.json(token);

我以这种方式生成我的令牌:

const generateToken = (_id, userID) => 
  console.log('Signing token for ID ', _id);
  console.log('Secret key is ', process.env.JWT_KEY);
  const token = jwt.sign( _id, userID, process.env.JWT_KEY, 
    expiresIn: "30d",
  );
  console.log('Signed token: ', token);
  return token;
;

我尝试将我的令牌存储在我的“userInfo”状态中..但只显示用户名和密码而不是令牌..它以前可以工作..但我不知道为什么它不再工作了^^我我完全不知所措

希望有人看到错误

我的控制台给了我详细信息:

TOKEN 
undefined

【问题讨论】:

jwt.sign((generateToken(userID),payload), SECRET_KEY); 你为什么在generateToken 上打电话给jwt.sign? generateToken 已经签名了... 我不知道..我试过了..我可以删除它 //return res.json(token); 取消注释 不幸的是它仍然没有工作:/@whygee 【参考方案1】:

在 REST API 中的登录函数末尾返回带有令牌密钥的令牌,因为这是您在前端访问它的方式。

return res.status(200).json(token: token);

【讨论】:

我收到错误消息:如果我在 rest api 的登录功能中键入此标题,则无法在将标题发送到客户端后设置标题 尝试从res.header 调用开始的行尾删除.json(token)。另外,我写的代码应该在登录函数的最后,将当前版本的return res.json(token);替换为答案中的那个。 你不能同时做res.header('Authorization', 'Bearer ' + token).json(token);res.status(200).json(token: token) 是的,没错.. 它与我的 userAction.js .. 我认为 @whygee 试试我在上面评论中写的解决方案。如果您不确定,您可以随时在前端调试响应。 (具体来说是 response.data)。但我相当确定我写的内容解决了这个问题。

以上是关于如何将我的 JWT 令牌存储在我的状态中?的主要内容,如果未能解决你的问题,请参考以下文章

如何在 Spring Security 无状态(jwt 令牌)中注销用户?

我应该/如何将我的 JWT 令牌存储在 redis 中以便我可以看到当前的用户会话?

如何在刷新页面上存储在本地存储中的 reactjs 中使用 JWT 进行身份验证?

需要 JWT 教程

如何将我的 JWT 令牌附加到每个 axios 调用?

我已经在 Spring Boot 代码中实现了 JWT 令牌安全性。如何在我的代码中的任何地方获取 jwt 令牌?需要保存审核