(已解决)vue中如何解析jwt令牌,vue中jwt-decode无法使用,报错缺少类jwt-decode,无法找到jwt-decode

本文讲述了在更新后的项目中,由于jwt-decode模块已被替换为jwtDecode,开发者需使用es6语法导入并解析JWT令牌的过程,以获取和存储用户信息。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

jwt-decode经过了一次更新,jwt-decode中已没有jwt-decode模块,所以无法使用jwt-decode进行jwt令牌解析。

通过查找模块,发现jwt-decode模块更新为jwtDecode模块

所以需要使用jwtDecode进行解析


使用es6语法进行导入

import { jwtDecode } from "jwt-decode";

进行解析并存入数组

export default {
  data() {
    return {
      // 版块和圈子数据
      localData: [],
      // 走马灯数据
      imagebox: [],
      //token数据
      token: "",
      // 个人中心数据
      decode: [],
    };
  },
  mounted() {
    // console.log(this.$route.query.token); // 输出 "your-token-value"
    // 从路由的meta字段中获取token的值
    const token = this.$route.query.token;
    // 将token存储到组件的data属性中
    this.token = token;
    console.log(token.token); // 输出 "your-token-value"
    console.log(123);
    console.log(jwtDecode(token.token));
    const decode = jwtDecode(token.token); // 解析JWT获取内部数据
    // 将token的用户信息存储到组件的data属性中
    this.decode = decode;

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值