MS Identity Azure app registered but sends unauthorized_client in implicit flow

Question

I have registered an app in Azure for Microsoft Identity platform. I configured it to allow MS Accounts (e.g. outlook.com) and have basically done everything in a few of the quickstarts online here and here (except for "add credentials to your web app"). I have also checked the boxes that enable implicit flow.

I redirect my React application to the URL to sign in (using implicit flow), I get to enter my username but then I see

unauthorized_client: The client does not exist or is not enabled for consumers. If you are the application developer, configure a new application through the App Registrations in the Azure Portal at https://go.microsoft.com/fwlink/?linkid=2083908

Like I mentioned above, I've gone through several quick starts and read about implicit flow here and followed their examples for my code.

I also tried just deleting the app registration and starting over. No luck.

JS Code attempting to implement Implicit Flow

JS code that redirects the browser to a Url that looks like Microsoft's first example on their implicit flow page

goSignIn() {
    const tenant = 'common'; // (for us with MS accounts)
    const clientId = '*****';
    const redir = encodeURIComponent('http://localhost:3000/signin');
    const nonce = Math.round(Math.random() * 10000, 0);
    const uriTemplate = 'https://login.microsoftonline.com/{tenant}/oauth2/v2.0/authorize?client_id={clientId}&response_type=id_token+token&redirect_uri={redirect}&scope=openid&response_mode=fragment&state={state}&nonce={nonce}';
    const filledTemplate = uriTemplate
      .replace('{tenant}', tenant)
      .replace('{clientId', clientId)
      .replace('{redirect}', redir)
      .replace('{nonce}', nonce)
      .replace('{state}', nonce);
    console.log(filledTemplate);
    window.location = filledTemplate;
  }

App Configuration in Azure:

Azure -> Identity -> App Registrations -> MyApp -> Authentication

• Redirect Uri: http://localhost:3000/signin (React app runs on 3000 and I have a route configured for /signin)
• Not using any suggested Redirects.
• Checked Implicit checkboxes for ID Token and Access Token
• Live SDK support enabled
• Supported account types is set to "Accounts in any organizational directory and personal Microsoft accounts (e.g. Skype, Xbox, Outlook.com)"

Azure -> Identity -> App Registrations -> MyApp -> API Permissions

• MS Graph
  • User.Read
  • Email
  • Profile
  • openid

From the docs I read, I thought I had done enough to the id token. I'm not sure what tweak must be made in order to get it to work.

Answer 1

It seems that you have done enough to get the token. I have tested this on my side, it works well. Here I provide you with my screenshot for you to check again.

Also, here is my working request url, you can login with your msa to have a test.

https://login.microsoftonline.com/common/oauth2/v2.0/authorize?
client_id=5fd66168-7ba3-4bbc-a155-bff662eed9f7
&response_type=id_token+token
&redirect_uri=http://localhost:3000/signin
&scope=openid
&response_mode=fragment
&state=12345
&nonce=678910