Microsoft-authentication-library-for-js: Unatuhorized client error - AzureAD B2C + custom policies

[kiranbhadani]

Library

• [ ] [email protected] or @azure/[email protected]
• [x] @azure/[email protected]
• [ ] @azure/[email protected]
• [ ] @azure/[email protected]
• [ ] @azure/[email protected]

Important: Please fill in your exact version number above, e.g. [email protected].

Framework

Pure JS

Description

Trying to setup SPA authentication with msal-browser, with Azure AD B2C custom policies, I am getting following error

Error Message

ServerError: unauthorized_client: AADB2C90058: The provided application is not configured to allow public clients.

at ServerError.AuthError [as constructor] (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:201:28)
at new ServerError (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:3077:32)
at ResponseHandler.validateServerAuthorizationCodeResponse (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:3513:23)
at AuthorizationCodeClient.handleFragmentResponse (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:3741:29)
at RedirectHandler.<anonymous> (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:6430:56)
at step (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:80:27)
at Object.next (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:61:57)
at https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:54:75
at new Promise (<anonymous>)
at __awaiter (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:50:16)

Security

• [ ] Is this issue security related?

Regression

• [ ] Did this behavior work before?
  Version:

MSAL Configuration

auth: {
        clientId: "xxxxx-xxxxxxx,
        authority: "https://sicdpstage.b2clogin.com/sicdpstage.onmicrosoft.com/b2c_1a_accountlink_signup_signin",
        knownAuthorities: ["sicdpstage.b2clogin.com"],
        //validateAuthority: false,
        redirectUri: 'http://localhost:6420'
    }

Reproduction steps

// Provide relevant code snippets here.
// For Azure B2C issues, please include your policies.
I am using this sample and migrating it to msal 2.0, followed the migration guide and documentation for msal-browser 
https://docs.microsoft.com/en-us/azure/active-directory/develop/msal-b2c-overview#javascript-spa

Expected behavior

Browsers/Environment

• [ X] Chrome
• [ ] Firefox
• [ X] Edge
• [ ] Safari
• [ ] IE
• [ ] Other (Please add browser name here)

[kiranbhadani]

I am able to resolve it, it was issue with app registration it requires to enable 'public client', now I am facing issue with aquireTokenSlient, it works with local account and google account, but fails with azure account, the same issue was in msal 1.0, so we trying to upgrade it to msal 2.0, but didn't work

ClientAuthError: no_account_in_silent_request: Please pass an account object, silent flow is not supported without account information
at ClientAuthError.AuthError [as constructor] (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:201:28)
at new ClientAuthError (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:490:32)
at Function.ClientAuthError.createNoAccountInSilentRequestError (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:657:20)
at SilentFlowClient. (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:4246:47)
at step (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:166:27)
at Object.next (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:147:57)
at https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:140:75
at new Promise ()
at __awaiter$1 (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:136:16)
at SilentFlowClient.acquireToken (https://alcdn.msauth.net/browser/2.1.0/js/msal-browser.js:4237:20)

[jmckennon]

Can you post your msal usage and any related account/acquireTokenSilent code?

[kiranbhadani]

@jmckennon here is the code from sample application, configuration as above let me know if you need further details

const myMSALObj = new msal.PublicClientApplication(msalConfig);

let accessToken;

// Register Callbacks for Redirect flow
myMSALObj.handleRedirectPromise().then((response) => {
  if (response){
    if (response.accessToken) {
      console.log("access_token acquired at: " + new Date().toString());
      accessToken = response.accessToken;
      logMessage("Request made to Web API:");
      if (accessToken) {
        try {
          callApiWithAccessToken(apiConfig.webApi, accessToken);
        } catch (err) {
          console.log(err);
        }
      }
    }
    else if (response.account && response.idToken) {
        console.log("id_token acquired at: " + new Date().toString());
        console.log(response);
        updateUI();
    }else {
        console.log("Token type is: " + response.tokenType);
    }
  }
}).catch((error) => {
  // handle error, either in the library or coming back from the server
  console.error(error);
});

function getTokenRedirect(request) {
return myMSALObj.acquireTokenSilent(request)
  .then((response) => {
    if (response.accessToken) {
      accessToken = response.accessToken;
      logMessage("Request made to Web API:");

      if (accessToken) {
        try {
          callApiWithAccessToken(apiConfig.webApi, accessToken);
        } catch (err) {
          console.log(err);
        }
      }
    }
  }).catch(error => {
    console.log("Silent token acquisition fails. Acquiring token using redirect");
    console.log(error);
    // fallback to interaction when silent call fails
    return myMSALObj.acquireTokenRedirect(request);
  });
}

[kiranbhadani]

I am able to solve it by passing account and scopes with acquireTokenRedirect()

getTokenRedirect({
      account: myMSALObj.getAllAccounts()[0],
      scopes: apiConfig.b2cScopes
    });