2017-02-16 14 views
0

У меня возникли сомнения в архитектуре для простого приложения, которое я задаю.Реализация Google Oauth с использованием стека MEAN

покой Моего сервер на основе апи находится в узле, который находится на http://localhost:3000 Моего клиента записывается в угловых 2 в http://localhost:4200

При разработке моего отдыха узла апи сервер я был успешным в реализации паспортного Google аутентификации, которые я проверить с помощью http://localhost:3000/auth/google и Я перенаправляюсь на страницу входа в google, а затем после входа в систему я перенаправляюсь в мой/профиль, обслуживаемый моим узлом отдыха api

Теперь я пытаюсь сделать то же самое, но отправной точкой является мой угловой клиент, который вызывает сервер узла api для вызова google auth. поэтому мой первоначальный запрос начинается с http://localhost:4200, который делает http.get до http://localhost:3000/auth/google. в надежде, что страница аутентификации Google показывает для меня, чтобы проверить подлинность, но я получаю ошибку ниже

XMLHttpRequest cannot load https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur …=1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com. Redirect from ' https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur …=1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com' to ' https://accounts.google.com/ServiceLogin?passive=1209600&continue=https://a …sercontent.com%26from_login%3D1%26as%3D60339aeceb428c&oauth=1&sarp=1&scc=1' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

Я включил URL, как с портами в странице Идента Google под Уставного происхождением JavaScript http://localhost:3000 http://localhost:4200 и в Авторизованный редирект URIs я включил http://localhost:3000/auth/google/callback

Ниже кода на сервере узла апи

app.get ('/ аВТ h/google ', passport.authenticate (' google ', {scope: [' profile ',' email ']})); app.get ('/ авт/Google/обратного вызова', passport.authenticate ('Google', { successRedirect: '/', профиль failureRedirect: '/' пользователи}), );

Любая помощь оценили

ответ

0

Две вещи: потому бэкенд и интерфейс находятся на разных портах, которые вы должны будете иметь свой бэкенд включают CORS header 'Access-Control-Allow-Origin' на ваши ответы. Что-то вроде этого, если вы используете экспресс:

res.header('Access-Control-Allow-Origin', '*'); 

Кроме того, просто убедитесь, что адрес в браузере постоянно HTTP: // локальный и не файл: // локальный

+0

привет, Рой, я не хотел, чтобы сервер api мог быть вызван любым другим приложением, кроме front-end, поэтому у меня есть внизу на сервере api, позволяя только моему клиентскому приложению работать на port4200 res.header («Access- Control-Allow-Origin ',' http: // localhost: 4200 '); res.header ('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE'); res.header ('Access-Control-Allow-Headers', 'Content-Type'); –

+0

Эй, Vinay, вы также должны добавить протокол, если вы указываете домен. Поэтому добавьте http: // перед localhost: 4200. –

+0

не работает, тогда я добавил *, но все еще проблема с перенаправлением. XMLHttpRequest не может загрузить http: // localhost: 3000/auth/google. Перенаправить из «http: // localhost: 3000/auth/google» на «https://accounts.google.com/o/oauth2/v2/auth?response_type=code&redirect_ur...=1000090953925-p7jof0qa284ihknb5sor3i4iatnqarvo.apps.googleusercontent.com ' был заблокирован политикой CORS: для запроса требуется предварительный предлог, который запрещен для переадресации перекрестного происхождения. –

0

Все, что вам нужно сделать, это отправить $window.location.href="URL"

Надеются, что это помогает