title: Linkedin OAuth authentification with React Frontend + Rails API
body: <p>So far my website has been using fullstack views generated directly by Rails, and for linkedin authentication I used a redirect_uri routed to a <code>Devise::OmniauthCallbacksController</code> to handle the logic.</p>
  
  <pre><code>GET https://www.linkedin.com/oauth/v2/authorization?redirect_uri=my_devise_omniauth_callback_url
  </code></pre>
  
  <p>I am wondering how to migrate this to a standalone React frontend + a standalone Rails server. The React app should "spawn" a linkedin popup for authorization, and wait until all the authorization process is done before closing itself and proceeding with registration on the main window.</p>
  
  <p>I have been through the <a href="https://developer.linkedin.com/docs/oauth2#" rel="nofollow noreferrer">Linkedin OAuth guide</a> and I see the way from approving the connection to getting user info is quite long. I am happy that Devise/Omniauth does most of the job for me server-side and I'd rather keep it this way, instead of coding that logic in the frontend.</p>
  
  <p>(By the way, is it safe to assume the Linkedin OAuth flow be similar to <a href="https://stackoverflow.com/a/39894843/2832282">the Google one mentionned in this answer</a> ?)</p>
  
  <p>I am unsure about whether this can be done the way I see it on the React app (especially the communication of data between the linkedin popup window and the main react view). Also from what I understand the <code>omniauth gem</code> in rails expects to receive the one-time token from the OAuth provider before it can query the provider twice more (first time to exchange the access token, second time to get user info). Would the following work ?</p>
  
  <ul>
  <li>Assume my React Client app is hosted on <code>client.example.com</code></li>
  <li>Assume my server api is hosted on <code>api.example.com</code></li>
  <li>The React app opens a popup windows, that is used to go to the Linkedin auth URI with 
  
  <ul>
  <li>(1) A redirect uri that would point directly to api.example.com</li>
  <li>(2) A redirect_uri on client.example.com, and my React client would then have to forward the token to api.example.com</li>
  </ul></li>
  <li>The authorization code somewhat reaches my server <code>api.example.com</code>, which gets an access code and retrieves user data from Linkedin. It returns to the browser an <code>identity_id</code> which can be used for the registration</li>
  <li>The <code>identity_id</code> is actually returned to the popup window, and transferred back to the main React app (how ?)</li>
  </ul>