Google-OAuth REST Api отреагирует - PullRequest
0 голосов
/ 23 мая 2018

Я успешно создал API, который использует passport-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 link аутентификация успешно работает, однако она перенаправляет на саму ссылку / api / auth / google / callback вместо того, чтобы позволить мне перехватить токен-носитель и затем запустить его через редукторы, чтобы сохранить его в локальном хранилище и обновить мое состояние.

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

React

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

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

    axios.get('/api/auth/google')
        .then(res => console.log(res))
        .catch(err => console.log(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)
    }))

1 Ответ

0 голосов
/ 07 сентября 2018

Я немного посмотрел на ваш код и не видел, чтобы происходила сериализация / десериализация.Обычно вам нужно пройти через этот процесс, чтобы иметь возможность подключиться к любой используемой вами стратегии аутентификации.

Вот фрагмент кода, который вы можете использовать в файле, который храните ваши стратегии:

passport.serializeUser((user, done) => {
  done(null, user.id);
});

passport.deserializeUser((id, done) => {
  User.findById(id).then(user => {
    done(null, user);
  });
});

Может быть, вы могли бы найти это более подробно в документации.Вот ссылка http://www.passportjs.org/docs/ перейти к части сессий.Кроме того, обязательно посмотрите, как app.use соединяется с функцией .session ().

...