I am having doubts on the architecture for a simple app i am desiging.
My rest based api server is in Node which is at http://localhost:3000 My client is written in Angular 2 at http://localhost:4200
While developing my rest node api server I was successful in implementing passport google authentication which i tested using http://localhost:3000/auth/google and I get redirected to the google login page and then further after logging in i get redirected to my /profile served by my rest node api
Now i am trying to do the same but starting point is my angular client which calls the node api server to call google auth. so my initial request starts from http://localhost:4200 which does a http.get to http://localhost:3000/auth/google. hoping that the google auth page shows up for me to authenticate but i get the below error
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.
I have included the url's with both the ports in google auth page under Authorised JavaScript origins http://localhost:3000 http://localhost:4200 and in the Authorised redirect URIs i have included http://localhost:3000/auth/google/callback
Below code in the node api server
app.get('/auth/google', passport.authenticate('google', { scope : ['profile', 'email'] })); app.get('/auth/google/callback', passport.authenticate('google', { successRedirect : '/profile', failureRedirect : '/users' }), );
Any help appreciated
