Передача JWT в приложение пользовательского интерфейса после входа в систему Google Oauth2

#node.js #reactjs #jwt #handshake #passport-google-oauth2

#node.js #reactjs #jwt #рукопожатие #паспорт-google-oauth2

Вопрос:

Я создал приложение MERN с отдельным бэкэндом и интерфейсом. Я добавил поддержку входа в систему Google Oauth2 с использованием passport-google-oauth20 пакета npm.

Итак, я указал конечную точку в серверной части следующим образом:

 class AccountAPIs {
    constructor() { }

    redirectToSuccess(req, res) {
        const accountServiceInst = AccountService.getInst();
        let account = req.session.passport.user;
        let filePath = path.join(__dirname   '../../../public/views/loginSuccess.html');
        let jwt = accountServiceInst.generateJWT(account);
        // how do I send this jwt to ui application
        res.sendFile(filePath);
    }

    loadMappings() {
        return {
            '/api/auth': {
                '/google': {
                    get: {
                        callbacks: [
                            passport.authenticate('google', { scope: ['profile', 'email'] })
                        ]
                    },
                    '/callback': {
                        get: {
                            callbacks: [
                                passport.authenticate('google', { failureRedirect: '/api/auth/google/failed' }),
                                this.redirectToSuccess
                            ]
                        }
                    },
                    '/success': {
                        get: {
                            callbacks: [this.successfulLogin]
                        }
                    }
                }
            }
        };
    }
}
 

Вот настройка паспорта для справки:

 let verifyCallback = (accessToken, refreshToken, profile, done) => {
    const accountServiceInst = AccountService.getInst();
    return accountServiceInst.findOrCreate(profile)
        .then(account => {
            return done(null, account);
        })
        .catch(err => {
            return done(err);
        });
};

let googleStrategyInst = new GoogleStrategy({
    clientID: serverConfig.auth.google.clientId,
    clientSecret: serverConfig.auth.google.clientSecret,
    callbackURL: 'http://localhost/api/auth/google/callback'
}, verifyCallback);

passport.use(googleStrategyInst);
 

В приложении пользовательского интерфейса при нажатии кнопки я открываю новое окно, которое открывает внутренний API ‘/ api / auth / google’. После аутентификации с помощью учетной записи Google окно перенаправляется на серверный API ‘/ api / auth / google / callback’, где я могу сгенерировать JWT. Я не уверен, как перенести этот JWT во внешнее приложение, поскольку оно открывается в отдельном окне.

Я знаю, что res.cookie('jwt', jwt) это один из способов сделать это. Пожалуйста, предложите лучшие практики здесь..

Ответ №1:

Существует два способа передачи токена клиенту :

1- вы помещаете токен в файл cookie, как вы уже упоминали

2-вы передаете токен в URL перенаправления клиенту в качестве параметра «CLIENT_URL / login / token», чтобы вы могли извлечь токен в своем интерфейсном клиенте