title: How can I share Azure Active Directory authentication between server side and client script?
body: <p>I currently have an MVC app that's using the <em>Microsoft.Owin.Security.WSFederation</em> package for authentication with Azure's Active Directory. This lets me use the <em>Authorize</em> attribute on my controllers to redirect users to the Microsoft login site.</p>
  
  <p>I now have the requirement to add access to a WebAPI project that will be hosted on a different domain but will use the same AD store.</p>
  
  <p>I've managed to pull together something using the <a href="https://github.com/AzureADSamples/SinglePageApp-AngularJS-DotNet" rel="nofollow">ADAL JS library</a> provided by Azure but this gives the following process:</p>
  
  <ul>
  <li>user visits site and is redirected to Azure login</li>
  <li>user logs in and is returned to site</li>
  <li>JS code checks for login and redirects to Azure</li>
  <li>user is already authenticated so redirects back to site with token</li>
  <li>JS picks up token, stores it, and redirects to the original page</li>
  </ul>
  
  <p>So it works, but involves 4 redirects, which seems like a huge overhead.</p>
  
  <p>I thought that there might be some way of pulling a bearer token out of the authorisation credentials returned when the WSFederation succeeds but I can't see anything like that in the data. And, even if I could, I don't know how I'd be able to then refresh the token from the client script. So I strongly suspect I'm doing something fundamentally wrong.</p>
  
  <p>What would be the best process for sharing authentication between the two sites?</p>