在 Vue 應用程序中管理passportjs Google-Strategy

Question

我想在我的 Vue 應用程序中集成 Passportjs 的 Google 策略（Node 在后端運行）。

Vue 應用程序在localhost:8080上運行，Node 在localhost:5000上運行

我設置了一個本地策略（正在運行），如下所示：

• axios.post 從 Vue App 到認證路由
• 檢查並驗證我的路線中的用戶/護照，並向 Vue 應用程序發送 JWT 令牌
• 將令牌存儲在本地存儲中

我想為 Google 策略做同樣的事情，但由於重定向，我無法發送令牌。

這是我的代碼：

google-strategy-route.js

router.get(
    '/google',
    passport.authenticate('google', {
        scope: ['profile', 'email'],
    })
);

router.get(
    '/google/callback',
    passport.authenticate('google', {
        failureRedirect: '/',
        session: false,
    }),
    (req, res) => {
        const payload = {
            user: {
                id: req.user._id,
            },
        };
        jwt.sign(payload, process.env.jwtSecret, (err, token) => {
            if (err) throw err;
            res.json({ token });
        });
    }
);

谷歌策略auth.js

passport.use(
        new GoogleStrategy(
            {
                clientID: process.env.GOOGLE_CLIENT_ID,
                clientSecret: process.env.GOOGLE_CLIENT_SECRET,
                callbackURL: 'http://localhost:5000/api/auth/google/callback',
                passReqToCallback: true,
                proxy: true,
            },
            async function (request, accessToken, refreshToken, profile, done) {
                try {
                    const existingUser = await User.findOne({ email: profile.email });
                    if (existingUser) {
                        return done(null, existingUser);
                    }
                } catch (err) {
                    console.log(err);
                }
                try {
                    done(null, newUser);
                } catch (err) {
                    console.log(err);
                }
            }
        )
    );

在 Vue 應用程序中，我有一個指向 /api/auth/google 的 href

<a href="/api/auth/google">Connexion Google</a>

有沒有人有想法？

謝謝 ！

Answer 1

最后，我決定不使用passportjs。 由於它是一個 Node 中間件，因此使用令牌重定向非常復雜。 我使用Javascript SDK來集成連接彈出窗口，當用戶登錄時，我在后面檢查前端發送的令牌值並獲取用戶信息。 后面的check由Google的Auth Library管理： https : //github.com/googleapis/google-auth-library-nodejs

希望這個答案對某人有所幫助！