Aneesh Gopalakrishnan
Aneesh Gopalakrishnan

Reputation: 702

Mixing Azure AD and Azure AD B2C Authentication within same reactjs app and aspnet core web api

How do we mix Azure AD and Azure AD B2C in same app? I am building an app which should be accessible to employees and customers. My requirement is to authenticate internal users(like employees) with Azure AD and external users(customers) with Azure AD B2C.

What do I know so far. I can build two web apis(with just differing Startup.cs), the same can be done at reactjs as well - This is not ideal

Code in index.js of react app

import { PublicClientApplication } from "@azure/msal-browser";
import { MsalProvider } from "@azure/msal-react";
import { msalConfig } from './config';
const msalInstance = new PublicClientApplication(msalConfig);

ReactDOM.render(
  <Fragment>
    <StrictMode>
      <MsalProvider instance={msalInstance}>
        <Provider store={store}>
          <App />
        </Provider>
      </MsalProvider>
    </StrictMode>
  </Fragment>,
  document.getElementById('root')
);

Current Code in Startup.cs os aspnet core api

// 'AzureAd' and 'AzureAdB2C' is configured in appsettings.json
services.AddMicrosoftIdentityWebApiAuthentication(_configuration, "AzureAd");
// + services.AddMicrosoftIdentityWebApiAuthentication(_configuration, "AzureAdB2C"); <---- Would this work?
services.AddSingleton<IAuthorizationPolicyProvider, PermissionPolicyProvider>();
services.AddScoped<IAuthorizationHandler, PermissionAuthorizationHandler>();

Upvotes: 1

Views: 1354

Answers (1)

Jas Suri - MSFT
Jas Suri - MSFT

Reputation: 11325

Federate Azure AD to Azure AD B2C. Users can then click a button on AAD B2C login page to login with their AAD account. Your app just needs to understand AAD B2C as a login provider. Much simpler.

https://learn.microsoft.com/en-us/azure/active-directory-b2c/identity-provider-azure-ad-single-tenant?pivots=b2c-custom-policy

Upvotes: 1

Related Questions