谷歌登录Express React应用后使用护照-google-oauth20重定向问题 [英] Problem Redirecting after google signin in express react app using passport-google-oauth20
问题描述
我将后端和create-react-app2表示为前端,我也正在使用setupProxy.现在,我已经为Google登录配置了该应用,但是登录后却无法正确重定向到索引页面.这是console.developer.google.com
I have express backend and create-react-app2 as frontend , I am using setupProxy also. Now I have configured the app for google sign in however I am not getting proper redirect to index page after signin. Here is google oauth setup in console.developer.google.com
我正在使用护照google oauth20进行身份验证:这是我的护照文件:
I am using passport google oauth20 for authentication: Here my passport file:
const GoogleStrategy = require('passport-google-oauth20').Strategy;
const keys = require('./../keys/secret');
const {User} = require('./../models/user');
module.exports = function(passport) {
passport.serializeUser(function(user, done) {
done(null, user.id);
});
passport.deserializeUser(function(id, done) {
User.findById(id, function(err, user) {
done(err, user);
});
});
passport.use(new GoogleStrategy({
clientID: keys.googleClientID,
clientSecret: keys.googleClientSecret,
callbackURL: '/auth/google/callback'
},
async (accessToken, refreshToken, profile, done) => {
const existingUser = await User.findOne({ 'google.id' : profile.id });
if(existingUser) {
done(null, existingUser);
}else {
const user = await new User({
'google.id' : profile.id,
isSocialAccountPresent: true })
.save();
done(null, user);
}
}
));
}
这是我的路线:
router.get('/google',
passport.authenticate('google', { scope: ['profile', 'email'] }));
router.get('/google/callback',
passport.authenticate('google'),
(req, res) => {
// Successful authentication, redirect home.
res.redirect('/');
});
这是我的setupProxy文件:
Here is my setupProxy file:
const proxy = require("http-proxy-middleware");
module.exports = function(app) {
app.use(proxy("/auth/*", { target: "http://localhost:5000/" }));
app.use(proxy("/api/*", { target: "http://localhost:5000/" }));
};
我将获取重定向到以下URL:
Im gettting redirected to following URL :
http://localhost:3000/auth/google/callback?code=4/0gBVQE1R0m7FWFlg_QtXE2n9lvwVHoG_lNNH_zCueOeQAJZc6-8FygiH9u_9BfnQQt8yl2ECmD1gW3Gq9by25D4&scope=email+profile+https://www.googleapis.com/auth/userinfo.profile+https://www.googleapis.com/auth/userinfo.email
代替 http://localhost:5000/auth/google/callback >
推荐答案
在您的setupProxy.js文件中,尝试此操作...
In your setupProxy.js file try this...
app.use(proxy("/auth/**", { target: "http://localhost:5000/" }));
app.use(proxy("/api/*", { target: "http://localhost:5000/" }));
您会看到我添加了另一个星号.这告诉节点对"/回调"进行更深的一层.
You'll see I added an additional asterisk. This tells node to go one level deeper for "/callback".
这篇关于谷歌登录Express React应用后使用护照-google-oauth20重定向问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!