I have a SPA which is run either as standalone web app or as Outlook add-in. I want the user to be able to login using their Microsoft account. However when using the Outlook add-in I want to let Outlook provide us the user's identity (and not show a popup) and an access token as the user is already logged in.
I am trying to use features (MsalAuthenticationTemplate) of msal-react together with office.js but MSAL has no support for Outlook authentication.
I've tried to inject the Outlook access token into the MSAL cache to mimick a login but MSAL can't use the tokens.
msalInstance.initialize()
.then(() => {
// Account selection logic is app dependent. Adjust as needed for different use cases.
const accounts = msalInstance.getAllAccounts()
if (accounts.length >= 0 && msalInstance.getActiveAccount() === undefined) {
msalInstance.setActiveAccount(accounts[0])
} else if (isOfficeInitialized()) {
Office.auth.getAccessToken({ allowConsentPrompt: false, allowSignInPrompt: false })
.then(result => {
const token = result && jwtDecode<AzureTokenPayload>(result)
msalInstance.hydrateCache(payload, {}).then(() => msalInstance.setActiveAccount(account))
})
}
})
I know it is possible to show an inline popup, but the user is already logged in to Outlook so that's not the solution I'm looking for.
I also tried looking for any other library but to no avail. Is there any other library capable of doing what I want?
Note that: MSAL.js does not directly support Outlook authentication.
acquireTokenSilent
method to attempt to obtain a token silently.Check if NAA is supported in the user's Office environment using the following code:
Office.context.requirements.isSetSupported("NestedAppAuth", "1.1");
If NAA is available, you can use it to obtain the access token directly from the user's Outlook session.
Additionally, it's crucial not to try injecting tokens into the MSAL cache, as MSAL.js is built to handle its own token lifecycle. Instead, prioritize the NAA method for a smooth authentication experience.