Google-OAuth REST Api реагирует

Я успешно создал API, который использует паспорт-google-oauth для возврата JWT. В настоящее время, когда я прохожу через процесс, используя свои маршруты API, он возвращает объект json с токеном JWT Bearer.

Я пытаюсь использовать Reactjs в интерфейсе, но столкнулся с парой проблем.

В моем компоненте кнопки входа я просто пытаюсь получить результат с токеном носителя, чтобы передать его редуктору

1. При использовании Axios -> я сталкиваюсь с проблемой CORS при использовании exios и не могу вернуть результат, при добавлении CORS в мою сборку и прокси в мой проект реакции я получаю следующую ошибку No 'Access-Control-Allow-Origin' header is present on the requested resource.

2. Когда я использую тег привязки со ссылкой href, аутентификация успешно работает, однако она перенаправляет на саму ссылку / api / auth / google / callback вместо того, чтобы позволить мне поймать токен-носитель, а затем запустить его через мои редукторы, чтобы сохранить его в локальном хранилище. и обновите мое состояние.

Я пропустил шаг? Я поискал несколько часов в различных онлайн-ресурсах и, похоже, не смог найти решение, которое ищу.

Реагировать

(для простоты на данный момент я просто пытаюсь поймать ответ, который должен быть возвращен токеном-носителем, однако я не могу этого сделать)

googleAuth = (e) => {
    e.preventDefault()

    axios.get('/api/auth/google')
        .then(res => console.info(res))
        .catch(err => console.info(err))
}

render() {
    return (
        <button onClick = {this.googleAuth}>Signin With Google</button>
    )
}

API

Маршруты

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

router.get('/google/callback', passport.authenticate('google', { session: false }), generateUserToken)

Стратегия

passport.use(new passportGoogle.OAuth2Strategy(googleConfig, async (request, accessToken, refreshToken, profile, done) => {
        // Check for existing user
        const existingUser = await User.findOne({
            providers: {
                $elemMatch: {
                    provider: 'Google',
                    providerId: profile.id
                }
            }
        })

        // If user exists return done
        if (existingUser) return done(null, existingUser)

        // If user does not exist create a new user
        const newUser = await new User({
            name: profile.displayName,
            providers: [
                {
                    provider: 'Google',
                    providerId: profile.id
                }
            ]
        }).save()

        // Create profile with new user information
        const newProfile = await new Profile({
            userId: newUser.id
        }).save()

        return done(null, newUser)
    }))