解码 jwt 令牌答案

【问题标题】：Decoding jwt token解码 jwt 令牌
【发布时间】：2021-12-30 22:26:30
【问题描述】：

我正在尝试解码我在登录时收到的 jwt 令牌，但它在 console.log 中返回“null”。

这是我解码的代码：

import jwt from 'jsonwebtoken';

    function loginRequest(){
        const token = axios.post('https://afe2021fitness.azurewebsites.net/api/Users/login', 
        state).then(data => {localStorage.setItem('jwtToken', data.data.jwt);
        console.log(data.data.jwt)});

        console.log(jwt.decode(token));
    }

我还尝试了 jwt-decode 库中的解码器，但没有任何运气：

var decoded = jwtdecode(token);

它说''Uncaught (in promise) n {message: 'Invalid token specified'}''

【问题讨论】：

标签： reactjs jwt decode

【解决方案1】：

问题是您在初始化之前尝试使用token 变量。您还需要在从axios.post 返回的Promise 之前使用await。现在您必须在调用loginRequest 之前使用await。所以最终的代码是这样的：

import jsonwebtoken from "jsonwebtoken";

async function loginRequest() {
  const response = await axios.post("https://afe2021fitness.azurewebsites.net/api/Users/login", state)
  const { jwt } = response.data
  localStorage.setItem("jwtToken", jwt);
  console.log(jwt);
  console.log(jsonwebtoken.decode(jwt));
}

【讨论】：

【解决方案2】：

您应该将console.log(jwt.decode(token)) 移动到then 块内或使用async 函数：

import jwt from 'jsonwebtoken';

async function loginRequest() {
  try {
    const { data } = await axios.post(
      'https://afe2021fitness.azurewebsites.net/api/Users/login',
      state
    );
    const token = data.jwt;
    localStorage.setItem('jwtToken', token);
    console.log(token);

    console.log(jwt.decode(token));
  } catch (err) {
    console.log(err);
  }
}

【讨论】：