Node.js 从onelogin进行身份验证并重定向到仪表板

我有一个带有react/redux前端和express后端的应用程序，我使用

create react app

创建了该应用程序。我想使用onelogin和passportjs进行身份验证。根据本指南（）我可以设置所有内容，问题是，我的express服务器在端口5000上运行，而react应用程序在端口3000上运行

如果我转到

localhost:3000/login

，什么都不会发生，如果我转到

localhost:5000/login

，我确实会通过onelogin进行身份验证，但没有返回任何内容，它只是卡住了

这是我的

/login

代码

app.get('/login', passport.authenticate('openidconnect', {
    successReturnToOrRedirect: "/",
    scope: 'profile',
}));

这是回调

app.get('/oauth/callback', passport.authenticate('openidconnect', {
    callback: true,
    successReturnToOrRedirect: '/',
    failureRedirect: '/login'
}));

这是完整的代码（）

---

我理解为什么会发生这种情况，因为我的express服务器没有呈现任何内容。但是我如何处理这个问题呢？

重定向到

localhost:3000/create

而不是

/create

修复了它。不确定是否有最佳实践

app.get('/login', passport.authenticate('openidconnect', {
    successReturnToOrRedirect: "localhost:3000/create",
    scope: 'profile',
}));

app.get('/oauth/callback', passport.authenticate('openidconnect', {
    callback: true,
    successReturnToOrRedirect: 'http://localhost:3000/create',
    failureRedirect: 'http://localhost:3000/login'
}));

---

重定向到

localhost:3000/create

而不是

/create

修复了它。不确定是否有最佳实践

app.get('/login', passport.authenticate('openidconnect', {
    successReturnToOrRedirect: "localhost:3000/create",
    scope: 'profile',
}));

app.get('/oauth/callback', passport.authenticate('openidconnect', {
    callback: true,
    successReturnToOrRedirect: 'http://localhost:3000/create',
    failureRedirect: 'http://localhost:3000/login'
}));

---

您必须将您的请求代理到后端。请将此行添加到您的packages.json

"proxy": "http://127.0.0.1:5000/"

您如何从前端发出身份验证请求？使用react进行身份验证时，我使用react路由器，然后使用

axios

进行身份验证

因此，当用户提交登录表单时，我向登录路径发出post请求，以返回JWT（我以前没有使用passport）。来自客户机I的所有未来请求都包括jwt，以验证用户是否经过身份验证

从“js cookie”导入cookie；
从“查询字符串”导入查询字符串；
从“axios”导入axios；
让myUrl=“login/”；
让myData=QueryString.stringify({
…这个.state.form，
});
axios.post（myUrl、myData、{
标题：{
“内容类型”：“application/x-www-form-urlencoded；charset=UTF-8”，
“缓存控制”：“无缓存”，
},
})
。然后（（响应）=>{
//在cookies中存储令牌
//重定向到经过身份验证的路由
Cookies.set（'token'，response.data.token，{expires:1/24}）
})
.catch（（错误）=>{
//在此处向用户处理显示错误
})

您必须将您的请求代理到后端。请将此行添加到您的packages.json

"proxy": "http://127.0.0.1:5000/"

您如何从前端发出身份验证请求？使用react进行身份验证时，我使用react路由器，然后使用

axios

进行身份验证

因此，当用户提交登录表单时，我向登录路径发出post请求，以返回JWT（我以前没有使用passport）。来自客户机I的所有未来请求都包括jwt，以验证用户是否经过身份验证

从“js cookie”导入cookie；
从“查询字符串”导入查询字符串；
从“axios”导入axios；
让myUrl=“login/”；
让myData=QueryString.stringify({
…这个.state.form，
});
axios.post（myUrl、myData、{
标题：{
“内容类型”：“application/x-www-form-urlencoded；charset=UTF-8”，
“缓存控制”：“无缓存”，
},
})
。然后（（响应）=>{
//在cookies中存储令牌
//重定向到经过身份验证的路由
Cookies.set（'token'，response.data.token，{expires:1/24}）
})
.catch（（错误）=>{
//在此处向用户处理显示错误
})

这是一个有趣的选择，我将来肯定会研究passport。我看到的这个身份验证方法的唯一问题是，如果客户端上没有存储令牌/cookie，如何确定用户是否经过身份验证。例如，如果用户刷新/创建，会发生什么情况？您如何知道这是新用户还是同一用户？这是一个有趣的选择，我将来肯定会研究passport。我看到的这个身份验证方法的唯一问题是，如果客户端上没有存储令牌/cookie，如何确定用户是否经过身份验证。例如，如果用户刷新/创建，会发生什么情况？您如何知道这是新用户还是同一用户？