I'm working on implementing Single Sign-On (SSO) with MSAL in an Ionic + React application. I am using the following dependencies:

@azure/msal-browser: ^3.26.1
@azure/msal-react: ^3.0.5

MSAL Config:

const msalConfig: Configuration = {
  auth: {
    clientId: '328xxxa-3x44-43x5-8x9d-6ec67xxxx',
    authority: '',
    redirectUri: 'msauth.myApp.pckgApp://auth'
  },
  cache: {
    cacheLocation: 'localStorage',
    storeAuthStateInCookie: false
  },
  loggerOptions: {
    loggerCallback: (level: LogLevel, message: string, containsPii: boolean) => {
      if (!containsPii) {
        console.log(`[${LogLevel[level]}]: ${message}`);
      }
    },
    piiLoggingEnabled: false,
    logLevel: LogLevel.Verbose
  }
};

const msalInstance = new PublicClientApplication(msalConfig);

Login Funtion:

public async login() {
  console.log('Using codeChallenge:', codeChallange.codeChallenge);

  const loginRequest = {
    scopes: ['user.read', 'openid', 'profile'],
    prompt: 'select_account',
    redirectUri: 'msauth.myApp.pckgApp://auth',
    extraQueryParameters: {
      code_challenge: codeChallange.codeChallenge,
      code_challenge_method: 'S256'
    }
  };

  try {
    msalInstance.addEventCallback(event => {
      console.log(event, 'msalInstance.addEventCallback');
      if (event.eventType === EventType.HANDLE_REDIRECT_START) {
        console.log("Redirect handling started");
      }
      if (event.eventType === EventType.HANDLE_REDIRECT_END) {
        console.log("Redirect handling complete");
      }
    });
    await msalInstance.loginRedirect(loginRequest).catch((error) => {
      console.error('Login error:', error);
    });

  } catch (error) {
    console.error('Login error:', error);
    throw error;
  }
}

I am generating the code_challenge locally, and the login process seems to work fine. However, when I try to handle the redirect and acquire the token after the user is redirected, I am facing the following error:

AADSTS700009: Reply address must be provided when presenting an authorization code requested with an explicit reply address.

Code for Handling Redirect and Acquiring Token:

useEffect(() => {
  const handleDeepLink = async (event: any) => {
    console.log(handleRedirect, "Redirect URL received:", event.url);
    const urlObj = new URL(event.url);
    const fragment = urlObj.hash.substring(1); // Remove the # symbol
    const params = new URLSearchParams(fragment);
    const authCode = params.get("code");
    console.log(authCode, 'authCode got');

    const result = await msalInstance.acquireTokenByCode({
      code: authCode as string,
      scopes: ['user.read', 'openid', 'profile'],
      redirectUri: 'msauth.myApp.pckgApp://auth',
      codeVerifier: localStorage.getItem('codeVerifier') as string,
    }).catch((error) => {
      console.error(error, 'acquireTokenByCode error');
    });
    console.log(result, 'result of token');
    
    // Call handleRedirectPromise after getting the URL
    const response = await msalInstance.handleRedirectPromise();
    console.log(response, 'response');
    if (response) {
      console.log("✅ Login successful! Token response:", response);
    } else {
      console.error("⚠️ No authentication response found.");
    }
  };

  App.addListener("appUrlOpen", handleDeepLink);

  return () => {
    App.removeAllListeners();
  };
}, []);

I have also updated my info.plist file with the correct redirect scheme:

<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleTypeRole</key>
    <string>Editor</string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>msauth.dnaofsafetydev.blueprintapp</string>
    </array>
  </dict>
</array>

I get the authorization code correctly, but when I try to acquire the token using acquireTokenByCode, I receive the error:

AADSTS700009: Reply address must be provided when presenting an authorization code requested with an explicit reply address.

I’ve verified that

1. The redirectUri in both the MSAL config and the login request matches the URL scheme in the info.plist.

2. Ensured that the code_challenge and code_verifier are generated and stored properly.

3. Confirmed that the redirect URL scheme is correctly registered in both the MSAL configuration and the app.

Can anyone help me understand why I am getting this error, and how to resolve it? Do I need to modify the MSAL config or something else to ensure that the authorization code can be correctly exchanged for a token?