使用express搭建项目
-
安装express-generator,推荐全局安装
npm install -g express-generator -
通过express-generator工具完成项目的创建
express 项目名字 -
允许启动项目
cd 项目 npm install 将项目需要依赖的第三方包现在到本地 npm start完成项目的启动 http://127.0.0.1:3000 http://localhost:3000
更改好自己的app.js的代码,导入新的接口,创建api.js。
身份认证流程
1.用户输入登录信息,发送登录请求到后端;
2.服务端验证登录信息,如果登录成功,服务锛生成token (令牌,用于保存用户的相关信息) ;
3.将生成的token返回抬前端,前端通过localStorage将token存储在本地;
4.在后续所有的清求中,前螭都会将token携带上,-并发送至后台;
5.后端对token进行验证,验证是否有token,如果有,则需要验证token是否有效、是否过期;
6.验证失败,后端直按返回401报错给前端;
7.验证成功,对token进行解码,拿剄token中保存的用户信息返回给前端;
8.如果用户退出登录,将本地存储中token删除即可。
前端后端分离步骤
1.先安装
npm i jsonwebtoken
api.js就相当是在post设置用户名和密码,然后获取post里面解析的密钥签名,然后输入get在token里面进行判断。然后去add.js里面进行判断,进行跳转。
2.导入 var jwt =require("jsonwebtoken")
3.生成token值(密钥+账户+密码)
const token=jwt.sign({
data: '用户信息,密码账号'
}, '密钥签名', { expiresIn:过期时间,一般用h});
router.post('/1ogin', function (req, res, next) {
// 1.拿到前端传递过来的用户名+密码
const user = req.body;
//判断传来的数据是否正确
if (user.username != '小红' || user.password != 123456) {
// 如果不正确那就发送
res.send({
status: 0,
msg: "账户或者密码错误"
})
}
// 2.设置签名并且结合用户名+密码生成Token
const token = jwt.sign(user, 'kongbai', { expiresIn: '24h' });
//3.返回给客户端Token值
//如果登录成功
res.send({
status: 1,
msg: "登录成功",
data: {
token: token
}
})
});
设计登录成功接口,token判断
//登录完成以后,判断登录状态,是否有token值,是否正确,如果成功那么跳转页面
router.get('/menus', (req,res,next)=>{
// 登录后请求的接口,必须登录状态
res.send({
msg: "helloworld"
})
})
对于get这种接口必须是登录成功以后携带token值
1.先下载npm install express-jwt --save
var expressJwt = require("express-jwt");
// 中间件处理数据
//验证token是否过期并规定哪些路由不用验证
app.use(expressJwt({
secret: 'kuaixiang1991',
algorithms: ['HS256'] // 加密算法
}).unless({
path: ['/', '/api/login']//除了这个地址,其他的URL都需要验证
}))
app.use(function(err, req, res, next) {
if (err.name === 'UnauthorizedError') {
console.error(req.path + ',无效token');
res.json({
msg: 'token过期或者无效,请重新登录',
status: 401
})
res.redirect(302,"http://127.0.0.1:5500/index.html")
return
}
next()
})
然后在登录页面输入账户密码,得到token,如果过期重新登录,如果正确跳转到登陆成功页面。