CODEWITHSUNDEEP
azure-active-directoryazure-ad-msalmsal.js
tanmayghosh2507
tanmayghosh2507

Reputation: 773

Getting "Server response does not contain an authorization code to proceed" using MSAL when redirecting

I have a React app which is hosted at a location say "https://[email protected]" with redirect URL as "https://[email protected]/redirect.html", which sets up the reply_to URl as state of the Azure AD (Single Page application) config. This is to cover calls coming from other domains as well.

MSAL version: "@azure/msal-browser": "^2.33.0"

Now, I want to render this page within an Azure DevOps(ADO) extension's iFrame as well, for which I am sending and receiving some messages with token request and response to establish the auth between ADO's iFrame where the React app is being rendered and the standalone UI. So, whenever the UI is loaded from within the ADO extension, we take the ADO account info, and using MSAL library to get the token. This is what we are doing to perform this:

const msalConfig: Configuration = {
    auth: aadConfig,
    cache: {
        cacheLocation: "localStorage"
    }
}

const msal = new PublicClientApplication(msalConfig);

public async acquireToken(resourceId: string): Promise<string> {
    await this.msal.handleRedirectPromise(); // Getting the error here

    const loginRequest = {
        scopes: [resourceId  + "/.default"],
        redirectUri: "https://[email protected]/redirect.html", // This is what exactly mentioned in AAD App registration as well, and works for standalone
        authority: getAuthority(),
        state: config.getReplyToURL() // This is being set in the redirect.html and is the extension URL in ADO, and this is being passed on to ADO iframe
    };

    const account = this.msal.getActiveAccount();
    if (!account) {
        await this.msal.loginRedirect(loginRequest);
        this.msal.setActiveAccount(this.msal.getAllAccounts()[0]);
    }

    const accessTokenRequest = {
        scopes: [resourceId + "/.default"],
        account: account || this.msal.getActiveAccount(),
        authority: getAuthority()
    };

    try {
        return await this.msal.acquireTokenSilent(accessTokenRequest);
    } catch (error) {
        // Handle Error
    }
}

However, I am getting this below error in this line:

await this.msal.handleRedirectPromise()

   Uncaught (in promise) Error: Error: authorization_code_missing_from_server_response: Server response does not contain an authorization code to proceed.

Could someone please help me in right direction as to what exactly this issue is? Tried to find in MSAL error doc but couldn't specifically find anything. The error says that there was no code returned in response, however the same set of aad config worked fine for the standalone [email protected], then what's happening when I am trying to render it in an iFrame?

Upvotes: 0

Views: 489

Answers (1)

tanmayghosh2507
tanmayghosh2507

Reputation: 773

Had to change the login method to loginPopup instead of loginRedirect as redirect isn't seem to be allowed in apps running within an iframe.

Upvotes: 0

Related Questions