Comments (9)
@pjr1ga possibly a race condition is occurring here, let me try to reproduce this and get back to you. In the meantime, you can perhaps make use of the Events API to do the navigation after the LOGIN_SUCCESS or the ACQUIRE_TOKEN_SUCCESS events fire here.
from ms-identity-javascript-angular-tutorial.
@derisen Here is the content of my package.json, I´m forcing the install of some dependencies, and today I´ll check if it could be the reason. Thanks for your help.
{
"name": "portal",
"version": "0.1.0",
"scripts": {
"ng": "ng",
"start": "node serve --host 0.0.0.0 --poll 500",
"build": "ng build --prod",
"build-develop": "ng build --prod --configuration develop --base-href=/portal/",
"build-quality": "ng build --prod --configuration quality --base-href=/portal/",
"local-deployment-dev": "ng build --prod --configuration develop && node prod-server/app.js",
"local-deployment-qa": "ng build --prod --configuration quality && node prod-server/app.js",
"local-deployment-prod": "npm run build && node prod-server/app.js",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular-material-components/color-picker": "^4.0.1",
"@angular/animations": "~10.1.0",
"@angular/cdk": "^8.2.3",
"@angular/common": "~10.1.0",
"@angular/compiler": "~10.1.0",
"@angular/core": "~10.1.0",
"@angular/forms": "~10.1.0",
"@angular/material": "^8.2.3",
"@angular/material-moment-adapter": "^8.2.3",
"@angular/platform-browser": "~10.1.0",
"@angular/platform-browser-dynamic": "~10.1.0",
"@angular/router": "~10.1.0",
"@azure/msal-angular": "^2.0.2",
"@azure/msal-browser": "^2.16.0",
"@fortawesome/angular-fontawesome": "^0.7.0",
"@fortawesome/fontawesome-svg-core": "^1.2.27",
"@fortawesome/free-regular-svg-icons": "^5.12.1",
"@fortawesome/free-solid-svg-icons": "^5.12.1",
"@ng-select/ng-select": "^5.0.6",
"@ngx-translate/core": "^13.0.0",
"@ngx-translate/http-loader": "^4.0.0",
"angular-file-uploader": "^7.1.1",
"angular-oauth2-oidc": "^10.0.3",
"chart.js": "^2.9.4",
"chartjs-plugin-datalabels": "^0.7.0",
"crypto-js": "^3.1.9-1",
"express": "^4.17.1",
"hammerjs": "^2.0.8",
"idle-user": "file:./custom_modules/user-idle",
"ng2-charts": "^2.4.2",
"ngx-material-file-input": "^2.0.0",
"permission-directive": "file:./custom_modules/permission-directive",
"rxjs": "~6.6.3",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1001.0",
"@angular/cli": "~10.1.0",
"@angular/compiler-cli": "~10.1.0",
"@angular/language-service": "~10.1.0",
"@types/jasmine": "~3.3.8",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"codelyzer": "^5.1.2",
"idle-user": "file:./custom_modules/user-idle",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"permission-directive": "file:./custom_modules/permission-directive",
"protractor": "~7.0.0",
"ts-node": "~7.0.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2"
}
}
from ms-identity-javascript-angular-tutorial.
Hello. I tried by using the msalBroadcastService in the appComponent , however the result was the same. The router does not navigate to the desired route.
On the other hand I started a project from scratch and the router successfully moved to the desired route, once the token was acquired silently, so I´m suspecting it could be something related with the dependencies of the project.
The test project has the below dependencies
"dependencies": {
"@angular/animations": "~10.1.6",
"@angular/common": "~10.1.6",
"@angular/compiler": "~10.1.6",
"@angular/forms": "~10.1.6",
"@angular/core": "~10.1.6",
"@angular/platform-browser": "~10.1.6",
"@angular/platform-browser-dynamic": "~10.1.6",
"@angular/router": "~10.1.6",
"@azure/msal-angular": "^2.0.2",
"@azure/msal-browser": "^2.16.0",
"rxjs": "~6.6.0",
"tslib": "^2.0.0",
"zone.js": "~0.10.2"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.1001.7",
"@angular/cli": "~10.1.7",
"@angular/compiler-cli": "~10.1.6",
"@types/node": "^12.11.1",
"@types/jasmine": "~3.5.0",
"@types/jasminewd2": "~2.0.3",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~8.3.0",
"tslint": "~6.1.0",
"typescript": "~4.0.2"
}
from ms-identity-javascript-angular-tutorial.
Hello.
I analyzed the code, and debugged to search another call to navigate or navigateByUrl at the same time, and only one call to those methods is triggered when the token was acquired.
I´ll keep digging.
from ms-identity-javascript-angular-tutorial.
@pjr1ga I can reproduce this. As I mention this is most likely a race condition as msal tries to process the hash in url while the router tries to navigate. You might have to wait for inProgress observable to become none
before trying to navigate to another route.
Did you had a chance to try using the events API yet? Something like this would be a better alternative for what you are aiming to do:
ngOnInit(): void {
this.msalBroadcastService.msalSubject$
.pipe(
filter((msg: EventMessage) => msg.eventType === EventType.LOGIN_SUCCESS),
takeUntil(this._destroying$)
)
.subscribe((result: EventMessage) => {
const payload = result.payload as AuthenticationResult;
this.authService.instance.setActiveAccount(payload.account);
this.router.navigate(['/theRouteIWantToOpen']);
});
}
from ms-identity-javascript-angular-tutorial.
Hello.
Yes, I already tried to use the msalBroadcastService and the result was the same, the router did't navigate to other route.
from ms-identity-javascript-angular-tutorial.
@pjr1ga ok, are you using a hash or path location strategy? what does your msal configuration looks like?
from ms-identity-javascript-angular-tutorial.
Hello.
The msal config is shown below:
export const msalConfig: Configuration = {
auth: {
clientId: environment.azureConfigData.cliendId,
authority: environment.azureConfigData.authority,
redirectUri: environment.azureConfigData.redirectUri,
postLogoutRedirectUri:environment.azureConfigData.postLogoutRedirectUri,
navigateToLoginRequestUrl: true
},
cache:{
cacheLocation: BrowserCacheLocation.LocalStorage,// Configures cache location. "sessionStorage" is more secure, but "localStorage" gives you SSO between tabs.
storeAuthStateInCookie: isIE // Set this to "true" if you are having issues on IE11 or Edge
},
system:{
loggerOptions: {
loggerCallback(LogLevel: LogLevel, message: string){
console.log(message);
},
logLevel: LogLevel.Verbose,
piiLoggingEnabled: false
}
}
}
We´re using path as location strategy.
from ms-identity-javascript-angular-tutorial.
I´m closing this issue, as the root cause was a nested call to the backend that was not documented and prevented to get user details from the backend server. Therefore, because of the missing data the guard prevented the navigation.
from ms-identity-javascript-angular-tutorial.
Related Issues (20)
- When using the MSALGuard and RoleGuard on a route, the Role guard will allow access even if the user does not have the correct role HOT 22
- MSAL redirect Login When click public action Controller
- Forget passeword returns with AADB2C error code HOT 5
- Document recommend approach for calling web API using PoP tokens HOT 2
- API Issue - 500 Error HOT 4
- Group claims not added HOT 5
- Use Angular's own router when handling redirect response HOT 16
- Refactor component to handle claims challenge HOT 15
- Documentation is outdated HOT 5
- How to maintain multiple ClientID's in Multitenant scenario with Vendor, Customers and a Microsft Tenant HOT 8
- How to handle access_denied: AADB2C90091: The user has cancelled entering self-asserted information. HOT 4
- "Call a web API using App Roles" does not use separate App Registrations for API and SPA HOT 2
- Need different scopes based on which page is being accessed HOT 2
- After login, need another layer of Admin approval when trying to access API HOT 2
- Can't call MS Graph using Azure B2C app id HOT 1
- Help with Error : IDX10503: Signature validation failed. The token's kid is: 'MYKEYID', but did not match any keys in TokenValidationParameters or Configuration. Keys tried
- how to enables CAE in Azure
- I want to add Check for User login whether B2C user is present I my DB then only want to do successful login ?
- Error when starting application: Unsupported digital envelope routines: [DEP0111] DeprecationWarning: Access to process.binding('http_parser') is deprecated. HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ms-identity-javascript-angular-tutorial.