Skip to content

Commit bdab777

Browse files
committed
add role guard, update config
1 parent 88b0b70 commit bdab777

File tree

6 files changed

+370
-120
lines changed

6 files changed

+370
-120
lines changed

5-AccessControl/1-call-api-roles/API/TodoListAPI/appsettings.json

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
{
22
"AzureAd": {
33
"Instance": "https://login.microsoftonline.com/",
4-
"Domain": "Enter the domain of your Azure AD tenant, e.g. 'contoso.onmicrosoft.com'",
5-
"TenantId": "Enter the tenant ID",
6-
"ClientId": "Enter the Client ID (aka 'Application ID')",
4+
"Domain": "Enter the domain of your Azure AD tenant, e.g. contoso.onmicrosoft.com",
5+
"TenantId": "Enter the ID of your Azure AD tenant copied from the Azure portal",
6+
"ClientId": "Enter the application ID (clientId) of the 'TodoListAPI' application copied from the Azure portal",
77
"Scopes": ["access_as_user"],
88
"Roles": {
99
"TaskAdmin": "TaskAdmin",
Lines changed: 107 additions & 90 deletions
Original file line numberDiff line numberDiff line change
@@ -1,98 +1,115 @@
11
{
2-
"Sample": {
3-
"Title": "Angular single-page application calling a protected web API and using App Roles to implement Role-Based Access Control",
4-
"Level": 300,
5-
"Client": "Angular SPA",
6-
"Service": ".NET Core web API",
7-
"RepositoryUrl": "ms-identity-javascript-angular-tutorial",
8-
"Endpoint": "AAD v2.0",
9-
"Languages": ["typescript", "csharp"],
10-
"Description": "Angular single-page application calling a protected web API using App Roles to implement Role-Based Access Control",
11-
"products": ["azure-active-directory", "msal-js", "msal-angular", "microsoft-identity-web"]
12-
},
13-
"AADApps": [
14-
{
15-
"Id": "client",
16-
"Name": "msal-angular-app",
17-
"Kind": "SinglePageApplication",
18-
"Audience": "AzureADMyOrg",
19-
"HomePage": "http://localhost:4200/",
20-
"ReplyUrls": "http://localhost:4200/, http://localhost:4200/auth",
21-
"Scopes": ["access_as_user"],
22-
"Sample": {
23-
"SampleSubPath": "5-AccessControl\\1-call-api-roles\\SPA",
24-
"ProjectDirectory": "\\1-call-api-roles\\SPA"
25-
},
26-
"RequiredResourcesAccess": [
27-
{
28-
"Resource": "client",
29-
"DelegatedPermissions": ["access_as_user"]
30-
}
31-
],
32-
"AppRoles": [
33-
{
34-
"AllowedMemberTypes": [
35-
"User"
36-
],
37-
"Name": "TaskAdmin",
38-
"Description": "Admins can read any user's todo list"
39-
},
40-
{
41-
"AllowedMemberTypes": [
42-
"User"
43-
],
44-
"Name": "TaskUser",
45-
"Description": "Users can read and modify their todo lists"
46-
}
47-
],
48-
"ManualSteps": [
49-
{
50-
"Comment": "To receive the 'roles' claim with the name of the app roles this user is assigned to, make sure that the user accounts you plan to sign-in to this app is assigned to the app roles of this SPA app. The guide, https://aka.ms/userassignmentrequired provides step by step instructions."
51-
},
52-
{
53-
"Comment": "Or you can run the .\\CreateUsersAndAssignRoles.ps1 command to automatically create a number of users, and assign these users to the app roles of this app."
54-
}
55-
]
56-
}
57-
],
58-
"CodeConfiguration": [
59-
{
60-
"App": "client",
61-
"SettingKind": "Replace",
62-
"SettingFile": "\\..\\API\\TodoListAPI\\appsettings.json",
63-
"Mappings": [
64-
{
65-
"key": "Enter the domain of your Azure AD tenant, e.g. contoso.onmicrosoft.com",
66-
"value": "$tenantName"
67-
},
68-
{
69-
"key": "Enter the ID of your Azure AD tenant copied from the Azure portal",
70-
"value": "$tenantId"
71-
},
72-
{
73-
"key": "Enter the application ID (clientId) of the 'TodoListAPI' application copied from the Azure portal",
74-
"value": "client.AppId"
75-
}
76-
]
2+
"Sample": {
3+
"Title": "Angular single-page application calling a protected web API and using App Roles to implement Role-Based Access Control",
4+
"Level": 300,
5+
"Client": "Angular SPA",
6+
"Service": ".NET Core web API",
7+
"RepositoryUrl": "ms-identity-javascript-angular-tutorial",
8+
"Endpoint": "AAD v2.0",
9+
"Languages": [
10+
"typescript",
11+
"csharp"
12+
],
13+
"Description": "Angular single-page application calling a protected web API using App Roles to implement Role-Based Access Control",
14+
"products": [
15+
"azure-active-directory",
16+
"msal-js",
17+
"msal-angular",
18+
"microsoft-identity-web"
19+
]
7720
},
78-
{
79-
"App": "client",
80-
"SettingKind": "Replace",
81-
"SettingFile": "\\..\\SPA\\src\\app\\auth-config.ts",
82-
"Mappings": [
21+
"AADApps": [
8322
{
84-
"key": "Enter_the_Application_Id_Here",
85-
"value": "client.AppId"
86-
},
23+
"Id": "client",
24+
"Name": "msal-angular-app",
25+
"Kind": "SinglePageApplication",
26+
"Audience": "AzureADMyOrg",
27+
"HomePage": "http://localhost:4200/",
28+
"ReplyUrls": "http://localhost:4200/, http://localhost:4200/auth",
29+
"Scopes": [
30+
"access_as_user"
31+
],
32+
"Sample": {
33+
"SampleSubPath": "5-AccessControl\\1-call-api-roles\\SPA",
34+
"ProjectDirectory": "\\1-call-api-roles\\SPA"
35+
},
36+
"RequiredResourcesAccess": [
37+
{
38+
"Resource": "client",
39+
"DelegatedPermissions": [
40+
"access_as_user"
41+
]
42+
}
43+
],
44+
"AppRoles": [
45+
{
46+
"AllowedMemberTypes": [
47+
"User"
48+
],
49+
"Name": "TaskAdmin",
50+
"Description": "Admins can read any user's todo list"
51+
},
52+
{
53+
"AllowedMemberTypes": [
54+
"User"
55+
],
56+
"Name": "TaskUser",
57+
"Description": "Users can read and modify their todo lists"
58+
}
59+
],
60+
"OptionalClaims": {
61+
"IdTokenClaims": [
62+
"acct"
63+
]
64+
},
65+
"ManualSteps": [
66+
{
67+
"Comment": "To receive the 'roles' claim with the name of the app roles this user is assigned to, make sure that the user accounts you plan to sign-in to this app is assigned to the app roles of this SPA app. The guide, https://aka.ms/userassignmentrequired provides step by step instructions."
68+
},
69+
{
70+
"Comment": "Or you can run the .\\CreateUsersAndAssignRoles.ps1 command to automatically create a number of users, and assign these users to the app roles of this app."
71+
}
72+
]
73+
}
74+
],
75+
"CodeConfiguration": [
8776
{
88-
"key": "Enter_the_Tenant_Info_Here",
89-
"value": "$tenantId"
77+
"App": "client",
78+
"SettingKind": "Replace",
79+
"SettingFile": "\\..\\API\\TodoListAPI\\appsettings.json",
80+
"Mappings": [
81+
{
82+
"key": "Enter the domain of your Azure AD tenant, e.g. contoso.onmicrosoft.com",
83+
"value": "$tenantName"
84+
},
85+
{
86+
"key": "Enter the ID of your Azure AD tenant copied from the Azure portal",
87+
"value": "$tenantId"
88+
},
89+
{
90+
"key": "Enter the application ID (clientId) of the 'TodoListAPI' application copied from the Azure portal",
91+
"value": "client.AppId"
92+
}
93+
]
9094
},
9195
{
92-
"key": "Enter_the_Web_Api_Application_Id_Here",
93-
"value": "client.AppId"
96+
"App": "client",
97+
"SettingKind": "Replace",
98+
"SettingFile": "\\..\\SPA\\src\\app\\auth-config.ts",
99+
"Mappings": [
100+
{
101+
"key": "Enter_the_Application_Id_Here",
102+
"value": "client.AppId"
103+
},
104+
{
105+
"key": "Enter_the_Tenant_Info_Here",
106+
"value": "$tenantId"
107+
},
108+
{
109+
"key": "Enter_the_Web_Api_Application_Id_Here",
110+
"value": "client.AppId"
111+
}
112+
]
94113
}
95-
]
96-
}
97-
]
114+
]
98115
}

5-AccessControl/1-call-api-roles/SPA/src/app/app-routing.module.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ const routes: Routes = [
2020
path: 'todo-edit/:id',
2121
component: TodoEditComponent,
2222
canActivate: [
23-
MsalGuard,
2423
RoleGuard
2524
],
2625
data: {
@@ -31,7 +30,6 @@ const routes: Routes = [
3130
path: 'todo-view',
3231
component: TodoViewComponent,
3332
canActivate: [
34-
MsalGuard,
3533
RoleGuard
3634
],
3735
data: {
@@ -42,7 +40,6 @@ const routes: Routes = [
4240
path: 'dashboard',
4341
component: DashboardComponent,
4442
canActivate: [
45-
MsalGuard,
4643
RoleGuard,
4744
],
4845
data: {

5-AccessControl/1-call-api-roles/SPA/src/app/app.module.ts

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,11 +24,12 @@ import { TodoService } from './todo.service';
2424
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
2525
import { IPublicClientApplication, PublicClientApplication, InteractionType } from '@azure/msal-browser';
2626
import {
27-
MsalGuard, MsalInterceptor, MsalBroadcastService, MsalInterceptorConfiguration, MsalModule, MsalService,
27+
MsalInterceptor, MsalBroadcastService, MsalInterceptorConfiguration, MsalModule, MsalService,
2828
MSAL_GUARD_CONFIG, MSAL_INSTANCE, MSAL_INTERCEPTOR_CONFIG, MsalGuardConfiguration, MsalRedirectComponent, ProtectedResourceScopes
2929
} from '@azure/msal-angular';
3030

3131
import { msalConfig, loginRequest, protectedResources } from './auth-config';
32+
import { RoleGuard } from './role.guard';
3233

3334
/**
3435
* Here we pass the configuration parameters to create an MSAL instance.
@@ -109,7 +110,7 @@ export function MSALGuardConfigFactory(): MsalGuardConfiguration {
109110
useFactory: MSALInterceptorConfigFactory
110111
},
111112
MsalService,
112-
MsalGuard,
113+
RoleGuard,
113114
MsalBroadcastService,
114115
TodoService
115116
],

0 commit comments

Comments
 (0)