I'm trying to use Azure Active Directory B2C for my authentication flow for an SPA with a Node JS API. I'm using the code samples provided in the official tutorials (https://github.com/Azure-Samples/active-directory-b2c-javascript-msal-singlepageapp and https://github.com/Azure-Samples/active-directory-b2c-javascript-nodejs-webapi). I've set up everything correctly as far as I know, and I've created Facebook and Google IDP registrations according to the documentation provided. I've set up the b2cPolicies using the default SignUpSignIn User Flow, so there's really nothing to configure there except to specify that I'm using email, Google and Facebook. I'm able to authenticate into Azure's sample SPA with both Google and Facebook without issue, the id_tokens are fine. When I click the button to access the /hello endpoint from the sample API, only the email and Facebook flows produce the correct access_token from the myMSALObj.aquireTokenSilent call, however, when using Google, the "Choose an Account" popup appears a second time. When I'm only logged into a single account, it appears briefly and vanishes again, but when logged into multiple accounts, I have to select one again. This is kind of a terrible user experience, is there some way around this?
In the acquireTokenSilent() call, pass in a parameter within the MSAL config object: login_hint=emailaddress. Then use Custom Policy to pass this value back to the Google IdP, such that Google skips its account selection page.
You can do that by adding an input claim to the Google technical profile:
<InputClaims>
<InputClaim ClaimTypeReferenceId="login_hint" DefaultValue="{OIDC:LoginHint}" />
</InputClaims>
The above will use the OIDC claims resolver to pull in the value from the login_hint query parameter, and send that value as a query parameter called login_hint to Google.
https://developers.google.com/identity/protocols/oauth2/openid-connect