我已经设置了一个API来访问我的后端,并实现了快速会话来验证用户。
当使用Postman登录,然后访问受保护的GET请求时,它工作正常。
但我正在构建的React SPA在登录后似乎无法使用会话进行自我身份验证。
我尝试了许多我在网上找到的建议(改变CORS头,在React中使用显式cookie设置,改变我存储会话的方式,...),但似乎都没有解决这个问题。
我将尝试包括相关的代码片段:
服务器端(REST API)
会话和CORS中间件:
//Session Middleware
api.use(session({
genid: (req) => {
console.log('Inside session middleware');
console.log(req.sessionID)
return uuid()
},
cookie: {
maxAge: 60000
},
secret:"123",
resave:false,
saveUninitialized:true,
store: new MongoStore({
mongooseConnection:db,
clear_interval: 3600
})
}));
// CORS
api.use(function(req,res,next){
res.header("Access-Control-Allow-Origin", "http://localhost:3000");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
res.header("Access-Control-Allow-Credentials", "true")
next();
})
登录功能与护照验证:
exports.login = (req,res,next) => {
passport.authenticate('local',(err,user,info) =>{
//... (login handling)
})(req,res,next);
}
// Passport Middleware
passport.use(new LocalStrategy(
(username, password, done) => {
Promotor.findOne({username:username,password:password}, (err,user) =>{
if (err) {
done(err,null);
}
if (!user){
done(null,false,{message:'Invalid Credentials!'})
} else {
done(null,user)
}
});
}
));
// Passport serializing
passport.serializeUser((user,done) => {
done(null,user._id);
});
passport.deserializeUser((id,done) => {
Promotor.findById(id,function(err,user){
if(err){
done(err,false);
} else {
done(null,user);
}
})
})
受保护的GET函数
(isAuthenticated()在使用SPA中的axios时返回false)
exports.getNameById = (req,res) => {
console.log(req.session)
console.log(req._passport)
if(!req.isAuthenticated()){ //RETURNS FALSE IN REACT & TRUE IN POSTMAN
return res.status(401).send();
}
return controller.getDocumentById(Promotor,'firstname lastname',req,res);
}
客户端(React SPA)
Axios请求登录
(在Postman和应用程序中均可工作,并正确创建会话)
handleSubmit(e){
console.log("Trying To log in");
axios
.post(`${api_url}/promotor/login`,{username: this.state.username, password:this.state.password})
.then( (res) => {
if (res.status === 200) {
console.log(res);
this.setState(() => ({toClientHome: true, id:res.data.id}));
}
});
e.preventDefault();
}
Axios请求访问受保护的GET请求
(GET当设置会话cookie时,request在postman中工作,但在axios中不工作)
getFullName(id) {
axios
.get(`${api_url}/promotor/name/${id}`,{
withCredentials: true
})
.then((res) => {
//... rest of the code
});
}
2条答案
按热度按时间uplii1fm1#
你能不能把你的cors中间件代码放在你的文件的顶部(在所有导入之后)!!
那就再试一次。
sr4lhrrt2#