access token through msal

Question

export const b2cPolicies = {
    names: {
        signUpSignIn: 'B2C_1_susi1',
        forgotPassword: 'B2C_1_reset',
        editProfile: 'B2C_1_edit_profile',
        
    },
    authorities: {
        signUpSignIn: {
            authority: 'https://*****.b2clogin.com/******.onmicrosoft.com/b2c_1_susi1',
        },
        forgotPassword: {
            authority: 'https://*****.b2clogin.com/*****.onmicrosoft.com/B2C_1_reset',
        },
        editProfile: {
            authority: 'https://*****.b2clogin.com/*****.onmicrosoft.com/b2c_1_edit_profile',
        },
    
    },
    authorityDomain: '*****.b2clogin.com',
};
export const msalConfig = {
    auth: {
        clientId: '***********', // This is the ONLY mandatory field that you need to supply.
        authority: b2cPolicies.authorities.signUpSignIn.authority, // Choose SUSI as your default authority.
        knownAuthorities: [b2cPolicies.authorityDomain], // Mark your B2C tenant's domain as trusted.
        redirectUri: '/', 
        postLogoutRedirectUri: '/home', 
        navigateToLoginRequestUrl: false , 
    },
    cache: {
        cacheLocation: 'sessionStorage', // Configures cache location. "sessionStorage" is more secure, but "localStorage" gives you SSO between tabs.
        storeAuthStateInCookie: false, // Set this to "true" if you are having issues on IE11 or Edge
    },
}
export const protectedResources = {
    apiSpeech: {
        endpoint: 'http://localhost:8080/api/speech',
        scopes: {
            read: ['https://******.onmicrosoft.com/**********/Speech.Read'],
            write: ['https://xgolorg.onmicrosoft.com/********/Speech.ReadWrite'],
            
        },
    },
};

this is my auth config file . 
this is my index.js :
const msalInstance = new PublicClientApplication(msalConfig);

<React.StrictMode> 
   <BrowserRouter>
   <PersistGate persistor={persistor}>      
  <App instance={msalInstance} />       
 </PersistGate>            
  </Provider>   
 </BrowserRouter>     
the problem that i am facing here is normally in event.payload i found my access token and the scopes , but in my case access token is empty ad scopes is an empty array 

Answer 1

Hello @Iheb jendoubi , for how to request and acquire an Azure AD B2C access token using MSAL take a look to Acquiring an Access Token. The protectedResources element is reminicent of the protectedResourceMap property found in the MSAL Angular library, however the latter element is not available for MSAL React.

Let us know if you need additional assistance. If the answer was helpful, please accept it and rate it so that others facing a similar issue can easily find a solution.