title: What is the best practice to use Oauth2, React, Node.js and Passport.js to authenticate user with Google sign on button?
body: <p>I want to have a login button in my website so when a user clicks on it, the user can use their Google credentials. I'd like to ideally perform the authentication server side using Express.js and Passport.js.</p>
  
  <p>I implemented authentication server-side but the problem is that I can't make an AJAX request from the website to the server to start authentication because <a href="https://stackoverflow.com/questions/46818363/how-to-handle-cors-in-a-service-account-call-to-google-oauth/46818486">Google or Oauth don't support CORS</a>. So I need to use <code>a href</code> element in my website which would call the server authentication endpoint. However, I can't catch server response in this way. </p>
  
  <p>If I perform the authentication client-side (I'm using React) I could store login state in Redux and allow the user to access the website's resources. However, when the user logs out I need to make sure that server endpoints stop serving the same user which feels like implementing authentication twice: client-side and server-side.</p>
  
  <p>In addition when authenticating client-side, Google opens a popup for the user to authenticate which I think is worse user experience then just a redirect when authenticating server-side.</p>
  
  <p>I'm wondering what the best practice in terms of authenticating using Oauth2/Google. For example, stackoverflow.com also has Google button but just makes a redirect, without any popup, so I guess they figured out a way to perform server-side authentication and to bypass CORS issue.</p>