【发布时间】:2022-01-09 17:28:20
【问题描述】:
您好,我正在使用 react js 和 node js 练习 jwt 身份验证
每当用户登录时,都会在 cookie 中设置 jwt 令牌,如下所示
我只是匹配电子邮件,而不是当前专注于维护会话的密码
exports.login = async(req,res)=>{
const u = await User.findOne({
where:{
email:{
[Op.eq]:req.body.email
}
}
})
if(u!=null)
{
const token = jwt.sign({_id: u.id}, process.env.JWT_SECRET)
const cookie = req.cookies.token;
console.log("I am cookies",cookie) //shows token in postman but null when logged in from react frontend
if (cookie == undefined){
res.cookie('token', token, {httpOnly: true});
}
return res.status(200).json({"status":200,message:"login success"});
}else
{
res.json({"status":400,"message":"Login Failed"})
}
}
我的检查令牌方法
exports.checkToken =async(req,res)=>
{
console.log("DATA ONE: ", req.cookies.token)
const req_token = req.cookies.token
let auth = false;
if(!req_token)
{
return res.json({"message":"Login Again"})
}
try{
if(!jwt.verify(req_token,process.env.JWT_SECRET))throw 'token not valid';
else{
auth =true;
}
}catch(err)
{
console.log("Invalid TOken")
}
if(!auth)
{
return res.json(400).json({"message":"token verification failed"})
}else
{
const data = jwt.verify(req_token,process.env.JWT_SECRET)
console.log(data)
User.findOne({
where:{
id:{
[Op.eq]:data._id}}}).then((user)=>{
if(!user)
{
return res.status(400).json({"error":"user not found"})
}
const {id,email}=user
return res.status(200).json({user:{id,email}})
})
}
}
我正在使用 cookie-parser 并将其定位在我的路线之前,这样就不会发生顺序冲突
我的 server.js 文件
const express = require('express');
const sequelize = require('./config/connection');
const bodyParser = require('body-parser')
var cors = require("cors");
var cookieParser = require("cookie-parser");
var app = express();
app.use(cookieParser())
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({ extended: true }))
app.use(cors())
app.use('/students',students)
sequelize.sync();
app.listen(port,(err,res)=>{
console.log(`connected on port number:${port}`)
})
在我的路线文件中,我按如下方式使用我的方法
const express = require('express');
const app = express();
const router = express.Router();
const Authcontroller = require('../controllers/Authcontroller')
router.get("/verifyToken",Authcontroller.checkToken)
router.post("/login",Authcontroller.login)
所以当我点击路由以检查我的登录功能并验证身份验证令牌时进行测试,这两个东西都可以正常工作并返回 cookie,如图所示
最后,这是我的前端登录功能,在 useEffect 上,我正在检查令牌是否有效
const isAuthenticated = ()=>
{
axios.get("http://localhost:3855/students/verifyToken").then((res)=>{
console.log(res)
setUser(res.data.user)
})
}
React.useEffect(()=>{
isAuthenticated()
},[])
还有我的登录功能
const login = () =>
{
var options = {
email:userEmail
}
axios.post("http://localhost:3855/students/login",options).then((res)=>{
if(res.data.status == 200)
{
console.log("redirect to home ")
}else
{
console.log("redirect to login ")
}
}).catch((err)=>{
console.log(err)
})
}
我在从邮递员和反应前端尝试时正确设置了令牌,但是当我检索它时,我只在邮递员中得到它,而不是在反应前端。
我尝试在隐身模式和其他浏览器中进行操作,但在那里没有成功
我在 react 应用中得到的响应是
{ message: "Login Again" }
【问题讨论】: