0

我有 express backend 和 create-react-app2 作为 frontend ，我也在使用 setupProxy 。现在我已经为谷歌登录配置了应用程序，但是登录后我没有正确重定向到索引页面。这是 console.developer.google.com 中的 google oauth 设置

在此处输入图像描述

我正在使用护照谷歌 oauth20 进行身份验证：这是我的护照文件：

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 文件：

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：

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

4

4 回答 4

1

在你的 setupProxy.js 文件中试试这个......

app.use(proxy("/auth/**", { target: "http://localhost:5000/" }));
app.use(proxy("/api/*", { target: "http://localhost:5000/" }));

你会看到我添加了一个额外的星号。这告诉节点为“/回调”更深一层。

于 2019-02-10T05:33:21.420 回答
0

这里没有一个答案对我有用。我相信您已经setupProxy.js在src/React 客户端的文件夹中拥有该文件。然后，在该文件中，如果您正在changeOrigin: true为函数中传递的对象进行设置createProxyMiddleware，您应该删除它，这应该可以解决问题。至少，这对我有用。

于 2020-10-24T18:36:32.793 回答
0

使用 res.redirect('/') 您必须使用完整路径（http://localhost:5000... .）。

于 2019-08-03T09:34:48.043 回答
0

这在 setupProxy.js上对我有用

const { createProxyMiddleware } = require("http-proxy-middleware");

module.exports = (app) => {
  app.use(
    ["/api", "/auth/google/callback"],
    createProxyMiddleware({
      target: "http://localhost:5000",
    })
  );
};
于 2020-12-30T15:11:22.353 回答