Using Azure B2C and Sign in with Apple / MSAL.JS / Implicit Flow - Acquiring token silent failing with X-Frame Deny error

Question

I am currently using a React app which uses MSAL.js to authenticate with an Apple Identity Provider I have registered in Azure B2C. I have based my implementation on a guide: Post-GA Revisit of “Sign In with Apple” for Azure AD B2C

Everything is working with the exception of the access token request, which I try to acquire silently after sign in. I am currently getting an X-Frame Deny error that is occurring in the iFrame msal.js uses and it falls back to a acquireTokenRedirect which asks the user to login again (not a great user experience) and then it works.

Error from the browser console:

Refused to display 'https://appleid.apple.com/auth/authorize?client_id=com.my.clientid&redirect_uri=https://myb2ctenant.b2clogin.com%2foauth2%2fauthresp&response_type=code&scope=email&response_mode=form_post&nonce=nonce&state=StateProperties%3drandomCharshere' in a frame because it set 'X-Frame-Options' to 'deny'.

Unfortunately, Apple's documentation around the implicit flow with their endpoint is limited.

My two questions are:

1. I'm wondering if the hidden iFrame technique to acquire the token silently just may not be possible with Sign in with Apple. Has anyone had success implementing this?

2. I know when facing this exact X-Frame deny issue with other identity providers such as Google you can pass a login_hint into the acquireTokenSilent request which allows interaction to be skipped (for example if the user has multiple accounts and gets to the account selection screen in the iFrame). I haven't had any success passing in various claims as a login_hint to the Apple Provider though (and documentation on it seems to be non-existent).

Answer 1

This is a known issue in msal.js occurs due to browser extension cookie blockers / third party cookies disabled in browsers.

To fix this, MSAL.js v2 mitigates this in most scenarios by using the auth code flow instead of the implicit flow. Please refer this document

Answer 2

RENEWAL REQUEST

You should send prompt=none on the renewal request, to prevent the login page from trying to render on an iframe, as in my Token Renewal blog post.

APPLE COOKIE RESTRICTIONS

You may also be running into Safari cross site cookie restrictions, as described at the top of my Token Renewal Problems post. If so, see if changing the browser default setting influences behaviour.

POSSIBLE SOLUTIONS

Using refresh tokens in some form (either in the browser or wrapped in cookies) may be the way to go, rather than iframe based renewal.