当前位置: 首页 > news >正文

❤Node11-登录人token信息接口

❤Node11-登录人token信息接口​

上一章我们已经从登录部分拿到了用户的登录jwt返回的token信息,接下来我们就通过token来换取用户信息 这里我们可以将其理解为一种加密以及解密的思想来思考这个jwt和token的关系,token就是一个加密的字符串,而jwt就是那把钥匙。

1、解析 JWT字符串 还原为JSON对象​

客户端每次在访问那些有权限接口的时候,都需要主动通过请求头中的 **Authorization** 字段,将 Token 字符串发送到服务器进行身份认证。 此时,服务器可以通过 express-jwt这个中间件,自动将客户端发送过来的 Token 解析还原成 JSON 对象: token解析如下:

app.use(expressJWT.expressjwt({ secret: secretKey, algorithms: ["HS256"] }).unless({// path: [/^\/api\//],path: ['/','/api/login','/api/register','/api/resetPwd']})
);

image.png

这个时候我们请求的接口里面携带一下刚刚的token然后访问一下试试

jsaxios({method: 'get',url: api,headers: {'Authorization': 'Bearer '+localStorage.getItem("login"),'Content-Type': 'application/json;charset=utf-8','Custom-Header': 'custom-value'},params: params,}).then(res => {console.log(res.data);if (res.status == 200) {// console.log(res, 'res');tableData.value = res.data.data;totalvalue.value = res.data.total;}}).catch(error => {console.error(error);});

可以看到,这个时候我们的接口请求参数已经完全没问题了!

image.png

2、 获取用户信息(接口)​

当 express-jwt 这个中间件配置成功之后,即可在那些有权限的接口中,使用 req.user 对象,来访问从 JWT 字符串中解析出来的用户信息了,示例代码如下:

js// 这是一个有权限的api接口
app.get('/api/getInfo', (req, res) => {console.log(req.user);res.send({status: 200,message: 'success',data: req.user,})
})

从上面我们注册时候的接口可以看到,我们当时候注册了一个用户的username

image.png

返回的信息如下:

image.png

jsreq.auth信息如下:
{ username: 'admin', iat: 1713773255, exp: 1713780455 }

返回的信息内容如下:

js-   `username: 'admin'`: 这是 JWT 中存储的用户名信息,指示该令牌是以管理员身份签发的或者与管理员相关联的。
-   `iat: 1713773255`: 这是 JWT 的 "issued at"(签发时间)字段,表示 JWT 的签发时间。它是一个 Unix 时间戳,表示从 1970 年 1 月 1 日 00:00:00 UTC 到签发 JWT 的时间经过的秒数。
-   `exp: 1713780455`: 这是 JWT 的 "expiration time"(过期时间)字段,表示 JWT 的过期时间。也是一个 Unix 时间戳,表示 JWT 过期的时间点。在这个时间点之后,JWT 将不再被认为是有效的,需要重新获取新的 JWT。

从这个返回信息的签发时间,我们可以思考一下可以起到什么样的用途呢:

3、查询我们数据用户信息​

通过我们的用户接口返回的username参数去查询我们数据用户信息

jsapp.get('/api/getInfo', (req, res) => {// 查询用户详情接口 const values=[req.auth.username];let query = 'SELECT * FROM user WHERE username = ?';connectionpool.query(query, values, (err, results) => {if (err) {console.error('Error querying database:', err);res.status(500).json({ error: '用户不存在!' });return;}else{res.json({code: '200',data: results,});}});
})

最后我们查到的数据库信息如下: 可以看到我们查出来的其实是一个数组,这个时候我们可以优化一下,当查询出来的数据是空数据的时候,默认给个赋值,当含有数据的时候,拿数组的第一项数据 优化结果

jsdata: results?.length>0? results[0] : {},

image.png

4、测试使用用户信息接口​

接下来我们找个网页利用axios(自己把token给放进去哦记得!)尝试请求一下看是否可以获取对应的用户信息

js// 获取用户信息
function getUserinfo() {let api = "http://localhost:8888/api/getInfo";axios({method: 'get',url: api,headers: {'Authorization': 'Bearer '+localStorage.getItem("login"),'Content-Type': 'application/json;charset=utf-8','Custom-Header': 'custom-value'},}).then(res => {console.log(res.data);if (res.status == 200) {console.log(res, 'res-获取用户信息');}}).catch(error => {console.error(error);});}

在我们自己封装的项目之中进行封装一下

js// 获取用户信息
export function getInfo () {return request({url: '/api/getInfo',method: 'get',})
}import React,{ useEffect } from "react";
import { getInfo } from '@/api/common/comon';// 获取用户信息
const getUserInfo = () => {console.log('获取用户信息');getInfo().then(res => {console.log(res,'获取用户信息');setUserinfo(res.data);})
}useEffect(() => {console.log('useEffect-home');getUserInfo();
},[])

image.png

查询没问题,可以获取用户的信息!

5、优化用户信息接口​

👍 time(2024-8-10) 优化提示信息​

之前我们简单实现了我们的用户信息接口,但是在使用token换取信息的过程之中,很多次都是直接500,但是找不到其中的原因 接下来我们完善优化一下我们的用户信息接口

  • 授权信息提示的完善

jsif (!req.auth || !req.auth.username) {return res.status(401).send({code: 401,message: '未认证用户或缺少用户名!',});
}
  • 优化一下信息提示部分

jsif (err) {console.error('Error querying database:', err);return res.status(500).send({code: 500,message: '数据库查询错误!',});
}if (results.length === 0) {return res.status(404).send({code: 404,message: '用户不存在!',});
}res.send({code: 200,data: results[0],message: '欢迎你的访问!',
});

👍 time(2024-8-14)处理问题​

今天访问接口,一直提示我这个问题

js{code: 500, message: "服务器错误!"}

然后我找了一遍可能是链接过程的问题,之前我们对于接口500的时候进行了一个拦截,我们打印出来看看

js// 接口错误的封装---拦截部分
app.use((err, req, res, next) => {// 如果错误是由token解析失败导致的if (err.name === 'UnauthorizedError') {return res.send({code: 401,message: '登录过期,请重新登录!'})}console.log('其他原因导致的错误!',err);// 如果是其他位置原因导致的错误res.send({code: 500,message: '服务器错误!'})next()
})

输出以后我们能看到消息,这里我的报错部分是这样子的:

js

查询语句 SELECT * FROM user WHERE username = ?
其他原因导致的错误! ReferenceError: connectionpool is not defined

原来是我们项目大小写的原因,这里我们改一下,因为之前我们拆分模块的时候,把所有的 connectionpool=> connectionPool ,更改为了小驼峰命名,所以,这里出现问题,建议大家还是细心啊!

image.png

再次查询,这里问题已经处理好了!

image.png

👍 优化返回信息接口user​

之前我们直接返回的data信息,这里我们返回来的部分更改为user用户信息

js

res.send({code: 200,data: results[0],message: '欢迎你的访问!',
});=> 更改为res.send({code: 200,user: results[0],message: '欢迎你的访问!',
});

报错​

expressJWT is not a function(expressJWT版本语法)​

导入和使用expressJWT时遇到问题

c

import expressJWT  from 'express-jwt' 
app.use(expressJWT({ secret: secretKey }).unless({ path: ['/login'] }))

image.png

原因 由于express-jwt 版本的更新,之前的语法不适用于现在的 新版本 ,可以看到现在 是 8 开头的版本 express-jwt8的版本如下图所示:

javascript

 app.use(expressJWT.expressjwt({ secret: secretKey, algorithms: ["HS256"] }).unless({// path: [/^\/api\//],path: ['/','/api/login','/api/register','/api/resetPwd']})
);

相关文章:

  • 页面禁用鼠标右键属于反爬虫措施吗 ?
  • Python--操作列表
  • 《柔性供料器原理及用途》JKTECH柔性振动盘
  • 设计模式实战——开发中常用到的单例模式
  • 二叉树进阶
  • MySQL 中删除重复的数据并只保留一条
  • Pandas和matplotlib实现同期天气温度对比
  • 【计算机网络 - 基础问题】每日 3 题(二十三)
  • ArcGIS Desktop使用入门(三)常用工具条——拓扑(下篇:地理数据库拓扑)
  • 【机器学习】13-决策树2——决策树生成、剪枝
  • Ubuntu上如何优雅下载huggingface上某个gguf模型文件
  • 解决 ValueError: did not find HDF5 headers----安装netCDF4报错
  • Elasticsearch分布式搜索引擎入门
  • Anaconda虚拟环境创建和配置以使用PyTorch和DGL
  • 机器学习课程学习周报十三
  • CAP 一致性协议及应用解析
  • co模块的前端实现
  • es6
  • go append函数以及写入
  • JS正则表达式精简教程(JavaScript RegExp 对象)
  • laravel with 查询列表限制条数
  • Meteor的表单提交:Form
  • ucore操作系统实验笔记 - 重新理解中断
  • Vue实战(四)登录/注册页的实现
  • 汉诺塔算法
  • 好的网址,关于.net 4.0 ,vs 2010
  • 前端每日实战:61# 视频演示如何用纯 CSS 创作一只咖啡壶
  • 我的面试准备过程--容器(更新中)
  • 怎么把视频里的音乐提取出来
  • 【云吞铺子】性能抖动剖析(二)
  • Python 之网络式编程
  • ​Distil-Whisper:比Whisper快6倍,体积小50%的语音识别模型
  • ​iOS安全加固方法及实现
  • ​ubuntu下安装kvm虚拟机
  • ​二进制运算符:(与运算)、|(或运算)、~(取反运算)、^(异或运算)、位移运算符​
  • ## 基础知识
  • #nginx配置案例
  • #在 README.md 中生成项目目录结构
  • (2)空速传感器
  • (AngularJS)Angular 控制器之间通信初探
  • (Redis使用系列) Springboot 在redis中使用BloomFilter布隆过滤器机制 六
  • (动态规划)5. 最长回文子串 java解决
  • (非本人原创)史记·柴静列传(r4笔记第65天)
  • (附源码)spring boot校园健康监测管理系统 毕业设计 151047
  • (九十四)函数和二维数组
  • (六)vue-router+UI组件库
  • (没学懂,待填坑)【动态规划】数位动态规划
  • (一)pytest自动化测试框架之生成测试报告(mac系统)
  • (一)RocketMQ初步认识
  • (转)IIS6 ASP 0251超过响应缓冲区限制错误的解决方法
  • * 论文笔记 【Wide Deep Learning for Recommender Systems】
  • .netcore 6.0/7.0项目迁移至.netcore 8.0 注意事项
  • ??在JSP中,java和JavaScript如何交互?
  • @RestController注解的使用
  • [ 物联网 ]拟合模型解决传感器数据获取中数据与实际值的误差的补偿方法