AzureAD / microsoft-authentication-library-for-js

Microsoft Authentication Library (MSAL) for JS
http://aka.ms/aadv2
MIT License
3.64k stars 2.65k forks source link

MacOS Big Sur v11.2.3 #3415

Closed kimhegg closed 3 years ago

kimhegg commented 3 years ago

Core Library

@azure/msal or msal

Core Library Version

2.9.0

Wrapper Library

@azure/msal-angular

Wrapper Library Version

1.1.1

Description

Users on Macs that are updated to the new version of MacOS is not able to log in. Seems that they are not able to aquire any token.

Error Message

main.c0151afc310d72671d09.js:1 ERROR Error: Uncaught (in promise): RangeError: Maximum call stack size exceeded RangeError: Maximum call stack size exceeded at main.c0151afc310d72671d09.js:1 at l.invoke (polyfills.f586ddce03f534407210.js:1) at Object.onInvoke (main.c0151afc310d72671d09.js:1) at l.invoke (polyfills.f586ddce03f534407210.js:1) at a.run (polyfills.f586ddce03f534407210.js:1) at polyfills.f586ddce03f534407210.js:1 at l.invokeTask (polyfills.f586ddce03f534407210.js:1) at Object.onInvokeTask (main.c0151afc310d72671d09.js:1) at l.invokeTask (polyfills.f586ddce03f534407210.js:1) at a.runTask (polyfills.f586ddce03f534407210.js:1) at Z (polyfills.f586ddce03f534407210.js:1) at polyfills.f586ddce03f534407210.js:1 at o (main.c0151afc310d72671d09.js:1) at l.invoke (polyfills.f586ddce03f534407210.js:1) at Object.onInvoke (main.c0151afc310d72671d09.js:1) at l.invoke (polyfills.f586ddce03f534407210.js:1) at a.run (polyfills.f586ddce03f534407210.js:1) at polyfills.f586ddce03f534407210.js:1 at l.invokeTask (polyfills.f586ddce03f534407210.js:1) at Object.onInvokeTask (main.c0151afc310d72671d09.js:1)

Msal Logs

No response

MSAL Configuration

export const OAuthSettings = {
  appId: '************', 
  redirectUri:'http://localhost:4200',
  authority : "https://login.microsoftonline.com/******/",
  scopes: [
    "*****/user.read",
  ]
};

Relevant Code Snippets

async signIn(): Promise<void> {
    await this.msalService.loginRedirect(OAuthSettings)

    let loggedIn = this.isLoggedIn();
    if(loggedIn) {
      this.signInComplete.next(true);
    }

  }

  async isLoggedIn(){
    let result = await this.msalService.getAccount();
    if(result){
      this.user = await this.getUser();
      this.Store.init();
      this.authenticated.next(true);
    }else{
      this.authenticated.next(false);
    }
  }

Reproduction Steps

  1. On signin - users are prompted to provide username, pw and 2FA as normal.
  2. Click login and nothing happens. Users are not logged in.

Expected Behavior

Works as expected on MS-windows and linux.

Identity Provider

Azure AD / MSA

Browsers Affected (Select all that apply)

Chrome, Safari, Other

Regression

No response

Source

External (Customer)

sameerag commented 3 years ago

@kimrunar Is it possible to share fiddler and the browser logs here? This looks like a polyfill related issue and not a MSAL related one.

One more thing that confused me is that the wrapper library used for angular should be v2 instead of v1 if you are based on the core library msal v2; can you please check our angular docs here and let us know the exact MSAL browser and angular versions in use?

kimhegg commented 3 years ago

Ok, so i guess i use an outdated version? So i follow the docs you provided and try to upgrade to v2. my current versions are : "@azure/msal-angular": "^2.0.0-beta.3", "@azure/msal-browser": "^2.13.1",

What i struggle with at the moment is - all your samples are with a PublicClientApplication. I have a web-application..

My appmodule is as following, before i tried to upgrade.

MsalModule.forRoot({
      auth: {
        authority: OAuthSettings.authority,
        clientId: OAuthSettings.appId,
        redirectUri: OAuthSettings.redirectUri
      },
      cache: {
        cacheLocation: 'localStorage',
      },
    },
    {
      consentScopes: [
        'user.read',
        'openid',
        'profile',
        'photo'
      ],
      unprotectedResources: [],
      protectedResourceMap: [
        ['https://graph.microsoft.com/v1.0/me', ['user.read']],
        ['https://graph.microsoft.com/v1.0/me/photo/$value', ['user.read']],
        ['https://***********'/v1.0/',['user.read']],
        ['https://***********/api/v1/',['**************/user.read']]
      ],
      extraQueryParameters: {}
    }),

code-snippet

import { MsalService } from '@azure/msal-angular';
constructor(
    private msalService: MsalService,
    private http  : HttpClient) {
  }

async isLoggedIn(){
    let result = await this.msalService.getAccountByHomeId();   //Property 'getAccountByHomeId' does not exist on type 'MsalService'.
    if(result){
      this.authenticated.next(true);
    }else{
      this.authenticated.next(false);
    }
  }

package.json:

 "@agm/core": "^1.1.0",
    "@angular/animations": "~11.2.9",
    "@angular/cdk": "^11.2.8",
    "@angular/common": "^11.2.9",
    "@angular/compiler": "~11.2.9",
    "@angular/core": "~11.2.9",
    "@angular/forms": "~11.2.9",
    "@angular/material": "^11.2.8",
    "@angular/material-moment-adapter": "^11.2.8",
    "@angular/platform-browser": "~11.2.9",
    "@angular/platform-browser-dynamic": "~11.2.9",
    "@angular/router": "~11.2.9",
    "@angular/service-worker": "~11.2.9",
    "@azure/msal-angular": "^1.1.2",
    "@azure/msal-browser": "^2.13.1",
    "@fortawesome/angular-fontawesome": "^0.8.2",
    "@fortawesome/fontawesome-svg-core": "^1.2.35",
    "@fortawesome/free-solid-svg-icons": "^5.15.3",
    "@mat-datetimepicker/core": "^6.0.0",
    "@mat-datetimepicker/moment": "^6.0.0",
    "@microsoft/microsoft-graph-client": "^2.2.1",
    "@microsoft/microsoft-graph-types": "^1.35.0",
    "@ng-bootstrap/ng-bootstrap": "^9.1.0",
    "@ngx-translate/core": "^13.0.0",
    "@ngx-translate/http-loader": "^6.0.0",
    "@types/googlemaps": "3.43.3",
    "angular-calendar": "^0.28.22",
    "bootstrap": "^4.6.0",
    "date-fns": "^2.20.0",
    "font-awesome": "^4.7.0",
    "jwt-decode": "^3.1.2",
    "leader-line": "^1.0.5",
    "moment": "^2.29.1",
    "moment-timezone": "^0.5.33",
    "ngx-time-scheduler": "^1.7.1",
    "rxjs": "~6.6.7",
    "tslib": "^2.2.0",
    "windows-iana": "^5.0.1",
    "zone.js": "~0.11.4"

The question might be a bit off-topic from the issue perhaps, but i hope you can help. Thanks

kimhegg commented 3 years ago

Now i have set it up just like in the example but i get.

[Mon, 12 Apr 2021 12:55:30 GMT] : : @azure/msal-browser@2.13.1 : Info - Emitting event: msal:loginStart app.module.ts:82:10 ERROR Error: Uncaught (in promise): BrowserAuthError: interaction_in_progress: Interaction is currently in progress. Please ensure that this interaction has been completed before calling an interactive API.

and my url looks like this http://localhost:4200/#code=0.AY"......."

jasonnutter commented 3 years ago

@kimrunar Please provide complete verbose logs. interaction_in_progress means your app is attempting to make an interactive request while another request is still in progress.

What i struggle with at the moment is - all your samples are with a PublicClientApplication. I have a web-application..

Are you saying you have a confidential client application?

kimhegg commented 3 years ago

Hey, this is solved. The original issue with "Mac OS big sur 11.2.3" was solved with an msal upgrade from v1 to v2. Any additional problems i had was just bad implementation by me. Thanks.