How to correctly integrate MSAL app roles in Angular

This page summarizes the projects mentioned and recommended in the original post on /r/angular

InfluxDB - Power Real-Time Data Analytics at Scale
Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
www.influxdata.com
featured
SaaSHub - Software Alternatives and Reviews
SaaSHub helps you find the best software and product alternatives
www.saashub.com
featured
  • ms-identity-javascript-angular-spa-dotnetcore-webapi-roles-groups

    Discontinued Angular single-page application (SPA) calling .NET Core web API using App Roles and Security Groups for Implementing Role-Based Access Control (RBAC) using MSAL Angular

  • import { Injectable } from '@angular/core'; import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree } from '@angular/router'; import { MsalService } from '@azure/msal-angular'; import { AccountInfo } from '@azure/msal-common'; import { Observable } from 'rxjs'; interface Account extends AccountInfo { idTokenClaims?: { roles?: string[] } } @Injectable({ providedIn: 'root' }) export class RoleGuard implements CanActivate { constructor(private authService: MsalService) {} //from the msal tutorial https://github.com/Azure-Samples/ms-identity-javascript-angular-spa-dotnetcore-webapi-roles-groups canActivate(route: ActivatedRouteSnapshot): boolean { const expectedRole = route.data.expectedRole; let account: Account = this.authService.instance.getAllAccounts()[0]; if (!account.idTokenClaims?.roles) { window.alert('Token does not have roles claim. Please ensure that your account is assigned to an app role and then sign-out and sign-in again.'); return false; } else if (!account.idTokenClaims?.roles?.includes(expectedRole)) { window.alert('You do not have access as expected role is missing. Please ensure that your account is assigned to an app role and then sign-out and sign-in again.'); return false; } return true; } //from this tutorial https://medium.com/medialesson/group-authorization-in-angular-with-azure-ad-and-app-roles-1120c4b91163 // canActivate( // next: ActivatedRouteSnapshot, // state: RouterStateSnapshot): Observable | Promise | boolean | UrlTree { // const userRoles = (this.authService.instance.getAllAccounts().idToken as any).roles; // const allowedRoles = next.data["roles"]; // const matchingRoles = userRoles.filter(x => allowedRoles.includes(x)); // return matchingRoles.length > 0; // } }

  • InfluxDB

    Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

    InfluxDB logo
NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts

  • Trying to get an Angular Sample on Azure AD app roles to work locally

    1 project | /r/angular | 21 Apr 2021
  • Policy-Based Access Control (PBAC): A Comprehensive Overview

    1 project | dev.to | 16 Apr 2024
  • Show HN: AI assistant powered by Groq to generate authorization models

    1 project | news.ycombinator.com | 11 Apr 2024
  • Relationship Based Access Control (ReBAC): When To Use It

    1 project | dev.to | 18 Jan 2024
  • How Open ID Connect Works

    1 project | news.ycombinator.com | 4 Jan 2024