Passing JWT to UI application after Google Oauth2 login

Question

I have created a MERN application with a separate backend and frontend. I have added support for Google Oauth2 login using passport-google-oauth20 npm package.

So I have exposed an end point in the backend as follows:

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]
                        }
                    }
                }
            }
        };
    }
}

Here is the passport setup for reference:

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);

In the UI application, on button click I am opening a new window which opens the '/api/auth/google' backend API. After authenticating with a google account, the window redirects to the '/api/auth/google/callback' backend API where I am able to generate a JWT. I am unsure about how to transfer this JWT to the frontend application since this is being opened in a separate window.

I know that res.cookie('jwt', jwt) is one way to do it. Please suggest the best practices here..

Answer 1

There are two ways to pass the token to the client :

1- you put the token into a cookie as you have mentioned

2-you pass the token in the redirect URL to the client as a parameter "CLIENT_URL/login/token", that you can extract the token in your front-end client