The redirect URI in the configuration file doesn't match with the one generated with package name and signature hash.

[bradical1379]

I've installed this package via npm and do not have the option to pass a --variable flag for the KEY_HASH when trying to install.

When I attempt to run this project in my Android emulator, I am receiving the following error:

com.microsoft.identity.client.exception.MsalClientException: The redirect URI in the configuration file doesn't match with the one generated with package name and signature hash. Please verify the uri in the config file and your app registration in Azure portal. We expected 'msauth://my.app.id/V9TNgm3ss7ySoUoh9dePAbZqQSA%3D' and we received 'msauth://my.app.id/mYaCtUaLkEyHaSh%3D'.

I am uncertain where the V9TNgm3ss7ySoUoh9dePAbZqQSA= KEY_HASH came from and I believe that I changed the variable each place I can in my project to my actual key hash value.

Here is what I have updated in my Capacitor 5 project:

capacitor.config.ts:

import { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'my.app.id',
  appName: 'TestMSALApp',
  webDir: 'build',
  server: {
    androidScheme: 'https'
  },
  cordova: {
		preferences: {
			tenantId: "my-tenant-id",
			clientId: "my-client-id",
			keyHash: "mYaCtUaLkEyHaSh="
		}
	}
};

export default config;

AndroidManifest.xml:

<activity 
            tools:node="replace"
            android:name="com.microsoft.identity.client.BrowserTabActivity" 
            android:exported="true">
            
            <intent-filter>
                <action android:name="android.intent.action.VIEW" />
                <category android:name="android.intent.category.DEFAULT" />
                <category android:name="android.intent.category.BROWSABLE" />
                <data android:host="my.app.id" android:path="/mYaCtUaLkEyHaSh=" android:scheme="msauth" />
            </intent-filter>
        </activity>

Each time I try and rebuild the app and run it in the emulator, I receive the same error message above.

Here is how I am attempting to call msalInit:

    useEffect(() => {
        const initLogin = () => {
            const options = {
                authorities: [
                    {
                        type: 'AAD',
                        audience: 'AzureADMyOrg',
                        authorityUrl: '',
                        cloudInstance: 'MSALAzurePublicCloudInstance',
                        default: true
                    }
                ],
                authorizationUserAgent: 'WEBVIEW',
                multipleCloudsSupported: false,
                brokerRedirectUri: true,
                accountMode: 'SINGLE',
                scopes: ['User.Read'],
                clientId: 'my-client-id',
                tenantId: 'my-tenant-id',
            };

            (window as any).cordova.plugins.msalPlugin.startLogger((entry:any) => {
                console.log(entry.logLevel + ' ' + entry.message); 
            }, (error:any) => {
                console.log(error.logLevel + ' ' + error.message);
            }, false, 'VERBOSE');

            (window as any).cordova.plugins.msalPlugin.msalInit(
                (resp:any) => {
                    console.log('MSAL Initialization succesful.');
                    console.log(resp)
                },
                (err:any) => {
                    // err has your exception message
                    console.log('MSAL Initialization failed');
                    console.log(err)
                },
                options
            );
        }

        initLogin();
    }, []);

Any thoughts as to what I may doing wrong?

[peitschie]

@bradical1379 is it possible that V9TNgm3ss7ySoUoh9dePAbZqQSA= is the key you've assigned to the app in the Azure B2C web portal? I.e., it's not that your app has the wrong key, but rather that you've put the wrong key hash into Azure B2C instead?