Combine Authentication Scenarios with Azure AD

Question

Azure AD is used as the authentication provider for a web application we've built.

We followed the Web Browser to Web Application Scenario listed here .
It's an application with several main sections. We'd like to add on new parts and use client-rendering technologies, like React or Angular.

For those technologies, we'd like to use a Single Page Application scenario as outlined here . Since we're using React, we couldn't use the SPA scenario above exactly, as it was outlined. With this example , we added the code to have authentication for the API calls in our addition. The authentication happens with JavaScript side, but actually causes a page reload.

Is there some way to unify the authentication approaches of the Web Browser to Web Application and JavaScript to Web API scenarios?

EDIT: I made a sample project that tries to combine both scenarios for authentication. In it, I suppose the question boils down to sharing logged-in information with the AuthenticationContext JS class. On the TodoAPP controller I include this code to login:

<script type="text/javascript">
    var authContext = new AuthenticationContext(config);
    var user = authContext.getCachedUser();
    if (!user) {
        authContext.login();
    }
</script>

The login step causes the browser to refresh, even though the user is already logged in, that's what I would like to avoid.

Answer 1

Please check the following web posts that outline how to use configure an ASP.NET project to protect both a Web App and Web APIs:

• Use OWIN & Azure AD to Secure Both MVC UX and Web API in The Same Project
• Authentication Protocols, Web UX and Web API
• Controlling a Web App's session duration

This will handle the scenario on the server side.