Google oAuth с паспортом js + Vue - PullRequest
Новая
       47

Google oAuth с паспортом js + Vue

1 голос
/ 23 февраля 2020

В настоящее время я застрял для обработки входа в Google oAuth в приложении vue, которое подключается к моему собственному узлу express серверу API.

На сервере express API я использую паспорт в качестве промежуточное программное обеспечение для обработки Google OAUT и после успешного входа в систему через Google я генерирую JWT в обратном вызове на моем бэкэнде. 

passport.use(new GoogleStrategy({
    clientID: config.get('google.clientID'),
    clientSecret: config.get('google.clientSecret'),
    callbackURL: config.get('google.callbackUrl'),
  },
  function(accessToken, refreshToken, profile, done) {
    User.findOne(
      { socialID: profile.id },
      function (err, user) {
        if (err) {
            return done(err);
        }
        //No user was found... so create a new user with values from Facebook (all the profile. stuff)
        if (!user) {
          user = new User({
            name: profile.displayName,
            email: profile.emails[0].value,
            provider: profile.provider,
            socialID: profile.id,
          });
          user.save(function(err) {
            if (err) console.log(err);
          });
        }

        // the information which shall be inside the jsonwebtoken
        const payload = {
          user: {
            id: user.id
          }
        };

        // create jsonwebtoken and return it
        jwt.sign(
          payload,
          config.get('jwt.secret'), // get the secret from default.json to hash jsonwebtoken
          { expiresIn: config.get('jwt.lifetime') },
          (err, token) => {
            if(err) throw err; // if there is error, throw it and exit
            return done(JSON.stringify(token)); // return jwt token
          }
        );
      }
    );
  }
));

У меня есть эти маршруты на моем сервере API 

// @route   GET api/auth/google
// @desc    Google auth route - get User From Google, store it if not exists yet
// @access  Public
router.get('/google',
  passport.authenticate('google', { scope: ['profile', 'email'], session: false })
);

// @route   GET api/auth/google/callback
// @desc    Google callback route
// @access  Public
router.get('/google/callback',
  passport.authenticate('google', { failureRedirect: '/', session: false }),
  function (req, res) {
    res.redirect('http://localhost:8080/?token=' + res);
  }
);

Когда я вызываю свой API-интерфейс для бэкэнда по адресу / auth / google, я успешно перенаправляюсь на страницу входа в Google. Но с моим подходом я пытаюсь перенаправить URL-адрес обратного вызова обратно в мое приложение vue с параметром get "token", чтобы получить токен во внешнем интерфейсе. Перенаправление в моем обратном маршруте обратного вызова не работает. Как передать токен, сгенерированный в бэкэнде, моему веб-интерфейсу?

1 Ответ

0 голосов
/ 23 февраля 2020

Я обнаружил, что перенаправление не работает, потому что функция return done () ожидает, что два параметра будут работать правильно.

Я изменил в промежуточном программном обеспечении для паспорта Google функцию done, как эта 

jwt.sign(
 payload,
 config.get('jwt.secret'), // get the secret from default.json to hash jsonwebtoken
 { expiresIn: config.get('jwt.lifetime') },
  (err, token) => {
    if(err) throw err; // if there is error, throw it and exit
    return done(null, token); // return jwt token
  }
);

Теперь внутри моего маршрута я могу успешно перенаправить + добавить токен в качестве параметра get - так что с помощью этого обходного пути я получаю свой jwt, который генерируется в моем бэкэнде в моем веб-интерфейсе. 

// @route   GET api/auth/google/callback
// @desc    Google callback route
// @access  Public
router.get('/google/callback',
  passport.authenticate('google', { failureRedirect: '/', session: false }),
  function (req, res) {
    let token = res.req.user;
    res.redirect('//localhost:8080/?token=' + token);
  }
);
...