Я успешно создал API, который использует passport-google-oauth для возврата JWT.В настоящее время, когда я прохожу этот процесс, используя мои маршруты API, он возвращает объект json с токеном JWT Bearer.
Я пытаюсь использовать Reactjs на внешнем интерфейсе, однако сталкиваюсь с парой проблем.
В моем компоненте кнопки входа я просто пытаюсь получить результат с токеном-носителем, чтобы передать его в редуктор
При использовании Axios -> я сталкиваюсь спроблема CORS при использовании exios и не может вернуть результат, при добавлении CORS в мою сборку и прокси для моего реактивного проекта я получаю следующую ошибку No 'Access-Control-Allow-Origin' header is present on the requested resource.
Когда я использую якорьПри использовании тега 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)
}))