@azure/msal-angular 4.0.13 → 4.0.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/IMsalService.d.ts +17 -0
- package/README.md +1 -1
- package/constants.d.ts +5 -0
- package/esm2020/IMsalService.mjs +6 -0
- package/esm2020/azure-msal-angular.mjs +5 -0
- package/esm2020/constants.mjs +10 -0
- package/esm2020/msal.broadcast.config.mjs +6 -0
- package/esm2020/msal.broadcast.service.mjs +66 -0
- package/esm2020/msal.guard.config.mjs +6 -0
- package/esm2020/msal.guard.mjs +218 -0
- package/esm2020/msal.interceptor.config.mjs +6 -0
- package/esm2020/msal.interceptor.mjs +270 -0
- package/esm2020/msal.module.mjs +46 -0
- package/esm2020/msal.navigation.client.mjs +53 -0
- package/esm2020/msal.redirect.component.mjs +31 -0
- package/esm2020/msal.service.mjs +88 -0
- package/esm2020/packageMetadata.mjs +4 -0
- package/esm2020/public-api.mjs +18 -0
- package/fesm2015/azure-msal-angular.mjs +762 -0
- package/fesm2015/azure-msal-angular.mjs.map +1 -0
- package/fesm2020/azure-msal-angular.mjs +758 -0
- package/fesm2020/azure-msal-angular.mjs.map +1 -0
- package/index.d.ts +5 -0
- package/msal.broadcast.config.d.ts +3 -0
- package/msal.broadcast.service.d.ts +19 -0
- package/msal.guard.config.d.ts +9 -0
- package/msal.guard.d.ts +43 -0
- package/msal.interceptor.config.d.ts +13 -0
- package/msal.interceptor.d.ts +70 -0
- package/msal.module.d.ts +13 -0
- package/msal.navigation.client.d.ts +19 -0
- package/msal.redirect.component.d.ts +15 -0
- package/msal.service.d.ts +33 -0
- package/package.json +26 -56
- package/packageMetadata.d.ts +2 -0
- package/{src/public-api.ts → public-api.d.ts} +17 -35
- package/.beachballrc +0 -3
- package/.editorconfig +0 -16
- package/.eslintrc.json +0 -3
- package/CHANGELOG.json +0 -2315
- package/CHANGELOG.md +0 -869
- package/FAQ.md +0 -182
- package/angular.json +0 -51
- package/docs/angular-universal.md +0 -64
- package/docs/configuration.md +0 -609
- package/docs/errors.md +0 -89
- package/docs/events.md +0 -262
- package/docs/initialization.md +0 -206
- package/docs/known-issues.md +0 -19
- package/docs/logging.md +0 -47
- package/docs/msal-guard.md +0 -208
- package/docs/msal-interceptor.md +0 -160
- package/docs/multi-tenant.md +0 -90
- package/docs/performance.md +0 -50
- package/docs/public-apis.md +0 -29
- package/docs/redirects.md +0 -257
- package/docs/security.md +0 -4
- package/docs/ssosilent.md +0 -84
- package/docs/v0-v1-upgrade-guide.md +0 -61
- package/docs/v1-v2-upgrade-guide.md +0 -70
- package/docs/v2-v3-upgrade-guide.md +0 -52
- package/docs/v3-v4-upgrade-guide.md +0 -36
- package/karma.conf.js +0 -44
- package/ng-package.json +0 -7
- package/src/IMsalService.ts +0 -34
- package/src/constants.ts +0 -20
- package/src/msal.broadcast.config.ts +0 -8
- package/src/msal.broadcast.service.spec.ts +0 -471
- package/src/msal.broadcast.service.ts +0 -84
- package/src/msal.guard.config.ts +0 -27
- package/src/msal.guard.spec.ts +0 -525
- package/src/msal.guard.ts +0 -290
- package/src/msal.interceptor.config.ts +0 -39
- package/src/msal.interceptor.spec.ts +0 -1168
- package/src/msal.interceptor.ts +0 -388
- package/src/msal.module.ts +0 -51
- package/src/msal.navigation.client.spec.ts +0 -96
- package/src/msal.navigation.client.ts +0 -59
- package/src/msal.redirect.component.spec.ts +0 -64
- package/src/msal.redirect.component.ts +0 -26
- package/src/msal.service.spec.ts +0 -468
- package/src/msal.service.ts +0 -104
- package/src/packageMetadata.ts +0 -3
- package/src/test.ts +0 -19
- package/tsconfig.json +0 -25
- package/tsconfig.lib.json +0 -27
- package/tsconfig.lib.prod.json +0 -10
- package/tsconfig.spec.json +0 -17
- package/typedoc.json +0 -10
package/docs/msal-guard.md
DELETED
|
@@ -1,208 +0,0 @@
|
|
|
1
|
-
# MSAL Guard
|
|
2
|
-
|
|
3
|
-
MSAL Angular provides `MsalGuard`, a class you can use to protect routes and require authentication before accessing the protected route. This doc provides more information about configuring and considerations when using the `MsalGuard`.
|
|
4
|
-
|
|
5
|
-
`MsalGuard` is a convenience class you can use improve the user experience, but it should not be relied upon for security. Attackers can potentially get around client-side guards, and you should ensure that the server does not return any data the user should not access.
|
|
6
|
-
|
|
7
|
-
You may also need a route guard that addresses specific needs. We encourage you to write your own guard if `MsalGuard` does not meet all those needs.
|
|
8
|
-
|
|
9
|
-
## Configurations
|
|
10
|
-
|
|
11
|
-
### Configuring the `MsalGuard` in the *app.module.ts* and *app-routing.module.ts*
|
|
12
|
-
|
|
13
|
-
The `MsalGuard` can be added to your application as a provider in the *app.module.ts*, with its configuration. The imports takes in an instance of MSAL, as well as two Angular-specific configuration objects. The second argument is a [`MsalGuardConfiguration`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.guard.config.ts) object, which contain the values for `interactionType`, an optional `authRequest`, and an optional `loginFailedRoute`.
|
|
14
|
-
|
|
15
|
-
The `MsalGuard` is then used to protect routes in the *app-routing.module.ts*. The code sample below demonstrates adding the `MsalGuard` to the `Profile` route. Protecting the `Profile` route means that even if a user does not sign in using the `Login` button, if they try to access the `Profile` route or click the `Profile` button, the `MsalGuard` will prompt the user to authenticate via popup or redirect before showing the `Profile` page.
|
|
16
|
-
|
|
17
|
-
Your configuration may look like the below. See our [configuration doc](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/configuration.md) on other ways to configure MSAL Angular for your app, and the sections below for more details on the `MsalConfiguration` object and interfaces for routing.
|
|
18
|
-
|
|
19
|
-
```javascript
|
|
20
|
-
// app.module.ts
|
|
21
|
-
import { NgModule } from '@angular/core';
|
|
22
|
-
import { HTTP_INTERCEPTORS, HttpClientModule } from "@angular/common/http";
|
|
23
|
-
import { MsalModule, MsalRedirectComponent, MsalGuard } from '@azure/msal-angular'; // Import MsalInterceptor
|
|
24
|
-
import { InteractionType, PublicClientApplication } from '@azure/msal-browser';
|
|
25
|
-
import { AppComponent } from './app.component';
|
|
26
|
-
import { AppRoutingModule } from './app-routing.module';
|
|
27
|
-
|
|
28
|
-
@NgModule({
|
|
29
|
-
declarations: [
|
|
30
|
-
AppComponent,
|
|
31
|
-
],
|
|
32
|
-
imports: [
|
|
33
|
-
MsalModule.forRoot( new PublicClientApplication({
|
|
34
|
-
// MSAL Configuration
|
|
35
|
-
}), {
|
|
36
|
-
// MSAL Guard Configuration
|
|
37
|
-
interactionType: InteractionType.Redirect,
|
|
38
|
-
authRequest: {
|
|
39
|
-
scopes: ['user.read']
|
|
40
|
-
},
|
|
41
|
-
loginFailedRoute: '/login-failed'
|
|
42
|
-
}, {
|
|
43
|
-
// MSAL Interceptor Configurations
|
|
44
|
-
}),
|
|
45
|
-
AppRoutingModule
|
|
46
|
-
],
|
|
47
|
-
providers: [
|
|
48
|
-
// ...
|
|
49
|
-
MsalGuard
|
|
50
|
-
],
|
|
51
|
-
bootstrap: [AppComponent, MsalRedirectComponent]
|
|
52
|
-
})
|
|
53
|
-
export class AppModule { }
|
|
54
|
-
```
|
|
55
|
-
|
|
56
|
-
```javascript
|
|
57
|
-
// app-routing.module.ts
|
|
58
|
-
import { NgModule } from '@angular/core';
|
|
59
|
-
import { Routes, RouterModule } from '@angular/router';
|
|
60
|
-
import { HomeComponent } from './home/home.component';
|
|
61
|
-
import { ProfileComponent } from './profile/profile.component';
|
|
62
|
-
import { MsalGuard } from '@azure/msal-angular';
|
|
63
|
-
|
|
64
|
-
const routes: Routes = [
|
|
65
|
-
{
|
|
66
|
-
path: 'profile',
|
|
67
|
-
component: ProfileComponent,
|
|
68
|
-
canActivate: [MsalGuard]
|
|
69
|
-
},
|
|
70
|
-
{
|
|
71
|
-
path: '',
|
|
72
|
-
component: HomeComponent
|
|
73
|
-
},
|
|
74
|
-
];
|
|
75
|
-
|
|
76
|
-
@NgModule({
|
|
77
|
-
imports: [RouterModule.forRoot(routes)],
|
|
78
|
-
exports: [RouterModule]
|
|
79
|
-
})
|
|
80
|
-
export class AppRoutingModule { }
|
|
81
|
-
```
|
|
82
|
-
|
|
83
|
-
### Interaction Type
|
|
84
|
-
|
|
85
|
-
Setting the interaction type determines how the `MsalGuard` will interactively prompt for login. The `InteractionType` can be imported from `@azure/msal-browser` and set to `Popup` or `Redirect`.
|
|
86
|
-
|
|
87
|
-
### Optional authRequest
|
|
88
|
-
|
|
89
|
-
The optional `authRequest` is an advanced featured that is not required. However, we recommend setting `authRequest` on the `MsalGuardConfiguration` with `scopes` so that consent may be obtained for the scopes upfront. If consent for `scopes` are not consented to upfront, scopes can be obtained incrementally. This may result in a consent dialogue being presented to your app user multiple times.
|
|
90
|
-
|
|
91
|
-
Consenting to scopes upfront is demonstrated in the code samples above, and in our [samples](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/samples/msal-angular-samples).
|
|
92
|
-
|
|
93
|
-
All possible parameters for the request object can be found here: [`PopupRequest`](https://azuread.github.io/microsoft-authentication-library-for-js/ref/msal-browser/modules/_src_request_popuprequest_.html) and [`RedirectRequest`](https://azuread.github.io/microsoft-authentication-library-for-js/ref/msal-browser/modules/_src_request_redirectrequest_.html).
|
|
94
|
-
|
|
95
|
-
### Login Failed Route
|
|
96
|
-
|
|
97
|
-
The `loginFailedRoute` string can be set on `MsalGuardConfiguration`. The `MsalGuard` will redirect to this route if login is required and fails.
|
|
98
|
-
|
|
99
|
-
See the Angular sample for examples of implementing it in the [configuration](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/samples/msal-angular-samples/angular-modules-sample/src/app/app.module.ts#L66) and [app routing module](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/samples/msal-angular-samples/angular-modules-sample/src/app/app-routing.module.ts#L20).
|
|
100
|
-
|
|
101
|
-
Note that redirecting on failure is not available for Angular 9 applications that use the `CanLoad` interface due to base type differences.
|
|
102
|
-
|
|
103
|
-
### Interfaces
|
|
104
|
-
|
|
105
|
-
In addition to `canActivate`, `MsalGuard` also implements `canActivateChild` and `canLoad`, and these can be added to your route definitions in *app-routing.module.ts*. You can see these used in our [older MSAL Angular v2 Angular 11 sample application](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/msal-lts/samples/msal-angular-v2-samples/angular11-sample-app/src/app/app-routing.module.ts), as well as below. For more information on interfaces, see the [Angular docs](https://angular.io/api/router).
|
|
106
|
-
|
|
107
|
-
```js
|
|
108
|
-
const routes: Routes = [
|
|
109
|
-
{
|
|
110
|
-
path: 'profile',
|
|
111
|
-
canActivateChild: [MsalGuard],
|
|
112
|
-
children: [
|
|
113
|
-
{
|
|
114
|
-
path: '',
|
|
115
|
-
component: ProfileComponent
|
|
116
|
-
},
|
|
117
|
-
{
|
|
118
|
-
path: 'detail',
|
|
119
|
-
component: DetailComponent
|
|
120
|
-
}
|
|
121
|
-
]
|
|
122
|
-
},
|
|
123
|
-
{
|
|
124
|
-
path: 'lazyLoad',
|
|
125
|
-
loadChildren: () => import('./lazy/lazy.module').then(m => m.LazyModule),
|
|
126
|
-
canLoad: [MsalGuard]
|
|
127
|
-
},
|
|
128
|
-
];
|
|
129
|
-
```
|
|
130
|
-
|
|
131
|
-
## Considerations when using the MSAL Guard
|
|
132
|
-
|
|
133
|
-
### Using the MSAL Guard on the home page
|
|
134
|
-
|
|
135
|
-
Setting the `MsalGuard` on the initial page is our recommendation if you want users to be prompted to log in when they reach your application. We do not recommend calling `login` in the `ngOnInit` in `app.component.ts`, as this can cause looping with redirects.
|
|
136
|
-
|
|
137
|
-
Our additional recommendations depend on your routing strategy, and can be found in the sections below.
|
|
138
|
-
|
|
139
|
-
### Using the MSAL Guard with path routing
|
|
140
|
-
|
|
141
|
-
When using the `PathLocationStrategy` and redirects with your Angular app, we recommend using a dedicated route for redirects, which will help prevent looping. This route should also be your `redirectUri`, and should not be protected by the `MsalGuard`.
|
|
142
|
-
|
|
143
|
-
```javascript
|
|
144
|
-
const routes: Routes = [
|
|
145
|
-
{
|
|
146
|
-
path: 'profile',
|
|
147
|
-
component: ProfileComponent,
|
|
148
|
-
canActivate: [MsalGuard]
|
|
149
|
-
},
|
|
150
|
-
{
|
|
151
|
-
// Dedicated route for redirects
|
|
152
|
-
path: 'auth',
|
|
153
|
-
component: MsalRedirectComponent
|
|
154
|
-
},
|
|
155
|
-
{
|
|
156
|
-
path: '',
|
|
157
|
-
component: HomeComponent
|
|
158
|
-
}
|
|
159
|
-
];
|
|
160
|
-
```
|
|
161
|
-
|
|
162
|
-
To log users in upon reaching your app, when using the `PathLocationStrategy`, we recommend:
|
|
163
|
-
- Setting the `MsalGuard` on your initial page
|
|
164
|
-
- Set your `redirectUri` to `'http://localhost:4200/auth'`
|
|
165
|
-
- Adding an `'auth'` path to your routes, setting the `MsalRedirectComponent` as the component (this route should not be protected by the `MsalGuard`)
|
|
166
|
-
- Making sure the `MsalRedirectComponent` is bootstrapped
|
|
167
|
-
- Optionally: adding `MsalGuard` to all your routes if you want all your routes protected
|
|
168
|
-
|
|
169
|
-
Our [Angular 15 sample](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/samples/msal-angular-samples/angular-modules-sample) uses the `PathLocationStrategy` and demonstrates how to protect routes with the `MsalGuard`.
|
|
170
|
-
|
|
171
|
-
### Using the MSAL Guard with hash routing
|
|
172
|
-
|
|
173
|
-
When using the `HashLocationStrategy` with your Angular app, we strongly recommend setting placeholder routes (such as `/code`) in your *app-routing.module.ts* to prevent triggering the Angular router when AAD returns the auth code response in the hash, as you may experience issues completing authentication without doing so. These placeholder routes should not be protected by the `MsalGuard`, and should not point to a component that triggers interaction or makes protected API calls on page load.
|
|
174
|
-
|
|
175
|
-
```javascript
|
|
176
|
-
const routes: Routes = [
|
|
177
|
-
{
|
|
178
|
-
path: 'profile',
|
|
179
|
-
component: ProfileComponent,
|
|
180
|
-
canActivate: [MsalGuard]
|
|
181
|
-
},
|
|
182
|
-
{
|
|
183
|
-
// Needed for hash routing
|
|
184
|
-
path: 'code',
|
|
185
|
-
component: HomeComponent
|
|
186
|
-
},
|
|
187
|
-
{
|
|
188
|
-
path: '',
|
|
189
|
-
component: HomeComponent
|
|
190
|
-
}
|
|
191
|
-
];
|
|
192
|
-
```
|
|
193
|
-
|
|
194
|
-
The `redirectUri` in the MSAL Configuration should also be set to the home page.
|
|
195
|
-
|
|
196
|
-
To log users in upon reaching your app, when using the `HashLocationStrategy`, we recommend:
|
|
197
|
-
- Setting the `MsalGuard` on your initial page
|
|
198
|
-
- Not setting the `MsalGuard` on placeholder routes (e.g. `/code`, `/error`)
|
|
199
|
-
- Making sure the `MsalRedirectComponent` is bootstrapped
|
|
200
|
-
- Optionally: adding `MsalGuard` to all the rest of your routes if you want all your routes protected
|
|
201
|
-
|
|
202
|
-
See our [older MSAL Angular v2 Angular 11 sample](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/msal-lts/samples/msal-angular-v2-samples/angular11-sample-app/src/app/app-routing.module.ts), which uses the `HashLocationStrategy` and demonstrates how to protect routes with `MsalGuard`.
|
|
203
|
-
|
|
204
|
-
## Changes from msal-angular v1 to v2
|
|
205
|
-
|
|
206
|
-
* **Configuration**: `MsalAngularConfiguration` has been deprecated and no longer works. Configuring the `MsalGuard` is now done through the `MsalGuardConfiguration`.
|
|
207
|
-
* **Interfaces**: `MsalGuard` now implements `CanActivateChild` and `CanLoad` in addition to `CanActivate`. See the section above on `Interfaces` for more details.
|
|
208
|
-
* **Redirect on failure**: `MsalGuard` configuration now has a `loginFailedRoute` that can be configured. See the section above on the `loginFailedRoute` for details.
|
package/docs/msal-interceptor.md
DELETED
|
@@ -1,160 +0,0 @@
|
|
|
1
|
-
# MSAL Interceptor
|
|
2
|
-
|
|
3
|
-
MSAL Angular provides an `Interceptor` class that automatically acquires tokens for outgoing requests that use the Angular `http` client to known protected resources. This doc provides more information about the configuring and using the `MsalInterceptor`.
|
|
4
|
-
|
|
5
|
-
While we recommend using the `MsalInterceptor` instead of the `acquireTokenSilent` API directly, please note that using the `MsalInterceptor` is optional. You may wish to explicitly acquire tokens using the acquireToken APIs instead.
|
|
6
|
-
|
|
7
|
-
Please note that the `MsalInterceptor` is provided for your convenience and may not fit all use cases. We encourage you to write your own interceptor if you have specific needs that are not addressed by the `MsalInterceptor`.
|
|
8
|
-
|
|
9
|
-
## Configuration
|
|
10
|
-
|
|
11
|
-
### Configuring the `MsalInterceptor` in the *app.module.ts*
|
|
12
|
-
|
|
13
|
-
The `MsalInterceptor` can be added to your application as a provider in the *app.module.ts*, with its configuration. The imports takes in an instance of MSAL, as well as two Angular-specific configuration objects. The third argument is a [`MsalInterceptorConfiguration`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.interceptor.config.ts) object, which contain the values for `interactionType`, a `protectedResourceMap`, and an optional `authRequest`.
|
|
14
|
-
|
|
15
|
-
Your configuration may look like the below. See our [configuration doc](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/configuration.md) on other ways to configure MSAL Angular for your app.
|
|
16
|
-
|
|
17
|
-
```javascript
|
|
18
|
-
import { NgModule } from '@angular/core';
|
|
19
|
-
import { HTTP_INTERCEPTORS, HttpClientModule } from "@angular/common/http";
|
|
20
|
-
import { AppComponent } from './app.component';
|
|
21
|
-
import { MsalModule, MsalRedirectComponent, MsalGuard, MsalInterceptor } from '@azure/msal-angular'; // Import MsalInterceptor
|
|
22
|
-
import { InteractionType, PublicClientApplication } from '@azure/msal-browser';
|
|
23
|
-
|
|
24
|
-
@NgModule({
|
|
25
|
-
declarations: [
|
|
26
|
-
AppComponent,
|
|
27
|
-
],
|
|
28
|
-
imports: [
|
|
29
|
-
MsalModule.forRoot( new PublicClientApplication({
|
|
30
|
-
// MSAL Configuration
|
|
31
|
-
}), {
|
|
32
|
-
// MSAL Guard Configuration
|
|
33
|
-
}, {
|
|
34
|
-
// MSAL Interceptor Configurations
|
|
35
|
-
interactionType: InteractionType.Redirect,
|
|
36
|
-
protectedResourceMap: new Map([
|
|
37
|
-
['Enter_the_Graph_Endpoint_Here/v1.0/me', ['user.read']]
|
|
38
|
-
])
|
|
39
|
-
})
|
|
40
|
-
],
|
|
41
|
-
providers: [
|
|
42
|
-
{
|
|
43
|
-
provide: HTTP_INTERCEPTORS, // Provides as HTTP Interceptor
|
|
44
|
-
useClass: MsalInterceptor,
|
|
45
|
-
multi: true
|
|
46
|
-
},
|
|
47
|
-
MsalGuard
|
|
48
|
-
],
|
|
49
|
-
bootstrap: [AppComponent, MsalRedirectComponent]
|
|
50
|
-
})
|
|
51
|
-
export class AppModule { }
|
|
52
|
-
```
|
|
53
|
-
|
|
54
|
-
### Interaction Type
|
|
55
|
-
|
|
56
|
-
While the `MsalInterceptor` is designed to acquire tokens silently, in the event that a silent request fails, it will fall back to acquiring tokens interactively. The `InteractionType` can be imported from `@azure/msal-browser` and set to `Popup` or `Redirect`.
|
|
57
|
-
|
|
58
|
-
```javascript
|
|
59
|
-
{
|
|
60
|
-
interactionType: InteractionType.Redirect,
|
|
61
|
-
protectedResourceMap: new Map([
|
|
62
|
-
['Enter_the_Graph_Endpoint_Here/v1.0/me', ['user.read']]
|
|
63
|
-
])
|
|
64
|
-
}
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
### Protected Resource Map
|
|
68
|
-
|
|
69
|
-
The protected resources and corresponding scopes are provided as a `protectedResourceMap` in the `MsalInterceptor` configuration.
|
|
70
|
-
|
|
71
|
-
The URLs you provide in the `protectedResourceMap` collection are case-sensitive. For each resource, add scopes being requested to be returned in the access token.
|
|
72
|
-
|
|
73
|
-
For example:
|
|
74
|
-
|
|
75
|
-
* `["user.read"]` for Microsoft Graph
|
|
76
|
-
* `["<Application ID URL>/scope"]` for custom web APIs (that is, `api://<Application ID>/access_as_user`)
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
Scopes can be specified for a resource in the following ways:
|
|
80
|
-
|
|
81
|
-
1. An array of scopes, which will be added to every HTTP request to that resource, regardless of HTTP method.
|
|
82
|
-
|
|
83
|
-
```javascript
|
|
84
|
-
{
|
|
85
|
-
interactionType: InteractionType.Redirect,
|
|
86
|
-
protectedResourceMap: new Map<string, Array<string> | null>([
|
|
87
|
-
["https://graph.microsoft.com/v1.0/me", ["user.read", "profile"]],
|
|
88
|
-
["https://myapplication.com/user/*", ["customscope.read"]]
|
|
89
|
-
]),
|
|
90
|
-
}
|
|
91
|
-
```
|
|
92
|
-
|
|
93
|
-
1. An array of `ProtectedResourceScopes`, which will attach scopes only for specific HTTP methods.
|
|
94
|
-
|
|
95
|
-
```javascript
|
|
96
|
-
{
|
|
97
|
-
interactionType: InteractionType.Redirect,
|
|
98
|
-
protectedResourceMap: new Map<string, Array<string|ProtectedResourceScopes> | null>([
|
|
99
|
-
["https://graph.microsoft.com/v1.0/me", ["user.read"]],
|
|
100
|
-
["http://myapplication.com", [
|
|
101
|
-
{
|
|
102
|
-
httpMethod: "POST",
|
|
103
|
-
scopes: ["write.scope"]
|
|
104
|
-
}
|
|
105
|
-
]]
|
|
106
|
-
])
|
|
107
|
-
}
|
|
108
|
-
```
|
|
109
|
-
|
|
110
|
-
Note that scopes for a resource can contain a combination of strings and `ProtectedResourceScopes`. In the below example, a `GET` request will have the scopes `"all.scope"` and `"read.scope"`, whereas as `PUT` request would just have `"all.scope"`.
|
|
111
|
-
|
|
112
|
-
```javascript
|
|
113
|
-
{
|
|
114
|
-
interactionType: InteractionType.Redirect,
|
|
115
|
-
protectedResourceMap: new Map<string, Array<string|ProtectedResourceScopes> | null>([
|
|
116
|
-
["http://myapplication.com", [
|
|
117
|
-
"all.scope",
|
|
118
|
-
{
|
|
119
|
-
httpMethod: "GET",
|
|
120
|
-
scopes: ["read.scope"]
|
|
121
|
-
},
|
|
122
|
-
{
|
|
123
|
-
httpMethod: "POST",
|
|
124
|
-
scopes: ["info.scope"]
|
|
125
|
-
}
|
|
126
|
-
]]
|
|
127
|
-
])
|
|
128
|
-
}
|
|
129
|
-
```
|
|
130
|
-
|
|
131
|
-
1. A scope value of `null`, indicating that a resource is to be unprotected and will not get tokens. Resources not included in the `protectedResourceMap` are not protected by default. Specifying a particular resource to be unprotected can be useful when some routes on a resource are to be protected, and some are not. Note that the order in `protectedResourceMap` matters, so null resource should be put before any similar base urls or wildcards.
|
|
132
|
-
|
|
133
|
-
```javascript
|
|
134
|
-
{
|
|
135
|
-
interactionType: InteractionType.Redirect,
|
|
136
|
-
protectedResourceMap: new Map<string, Array<string> | null>([
|
|
137
|
-
["https://graph.microsoft.com/v1.0/me", ["user.read", "profile"]],
|
|
138
|
-
["https://myapplication.com/unprotected", null],
|
|
139
|
-
["https://myapplication.com/unprotected/post", [{ httpMethod: 'POST', scopes: null }]],
|
|
140
|
-
["https://myapplication.com", ["custom.scope"]]
|
|
141
|
-
]),
|
|
142
|
-
}
|
|
143
|
-
```
|
|
144
|
-
|
|
145
|
-
Other things to note regarding the `protectedResourceMap`:
|
|
146
|
-
|
|
147
|
-
* **Wildcards**: `protectedResourceMap` supports using `*` for wildcards. When using wildcards, if multiple matching entries are found in the `protectedResourceMap`, the first match found will be used (based on the order of the `protectedResourceMap`).
|
|
148
|
-
* **Relative paths**: If there are relative resource paths in your application, you may need to provide the relative path in the `protectedResourceMap`. This also applies to issues that may arise with ngx-translate. Be aware that the relative path in your `protectedResourceMap` may or may not need a leading slash depending on your app, and may need to try both.
|
|
149
|
-
|
|
150
|
-
### Optional authRequest
|
|
151
|
-
|
|
152
|
-
For more information on the optional `authRequest` that can be set in the `MsalInterceptorConfiguration`, please see our [multi-tenant doc here](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/multi-tenant.md#dynamic-auth-request).
|
|
153
|
-
|
|
154
|
-
## Changes from msal-angular v1 to v2
|
|
155
|
-
|
|
156
|
-
* Note that the `unprotectedResourceMap` in MSAL Angular v1's `MsalAngularConfiguration` has been deprecated and no longer works.
|
|
157
|
-
* `protectedResourceMap` has been moved to the `MsalInterceptorConfiguration` object, and can be passed as `Map<string, Array<string|ProtectedResourceScopes>>`. `MsalAngularConfiguration` has been deprecated and no longer works.
|
|
158
|
-
* Putting the root domain in the `protectedResourceMap` to protect all routes is no longer supported. Please use wildcard matching instead.
|
|
159
|
-
|
|
160
|
-
For more information on how to configure scopes, please see our [FAQs](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/FAQ.md).
|
package/docs/multi-tenant.md
DELETED
|
@@ -1,90 +0,0 @@
|
|
|
1
|
-
# Multi-Tenant
|
|
2
|
-
|
|
3
|
-
By default, there is multi-tenant support for your application since MSAL sets the tenant in the authority to 'common' if it is not specified in the config. This allows any Microsoft account to authenticate to your application. If you are not interested in multi-tenant behavior, you will need to set the `authority` config property when instantiating MSAL in the `app.module.ts` as shown below.
|
|
4
|
-
|
|
5
|
-
```js
|
|
6
|
-
@NgModule({
|
|
7
|
-
imports: [
|
|
8
|
-
MsalModule.forRoot({ // MSAL Configuration
|
|
9
|
-
auth: {
|
|
10
|
-
clientId: 'CLIENT_ID_HERE',
|
|
11
|
-
authority: 'https://login.microsoftonline.com/TENANT_ID_HERE',
|
|
12
|
-
redirectUri: 'http://localhost:4200',
|
|
13
|
-
postLogoutRedirectUri: 'http://localhost:4200'
|
|
14
|
-
},
|
|
15
|
-
// Additional configuration here
|
|
16
|
-
});
|
|
17
|
-
]
|
|
18
|
-
})
|
|
19
|
-
export class AppModule {}
|
|
20
|
-
```
|
|
21
|
-
|
|
22
|
-
If you allow multi-tenant authentication, and you do not wish to allow all Microsoft account users to use your application, you must provide your own method of filtering the token issuers to only those tenants who are allowed to login.
|
|
23
|
-
|
|
24
|
-
## Changing the tenant
|
|
25
|
-
The tenant can also be set dynamically by instantiating a new instance of MSAL in the relevant component, as shown below.
|
|
26
|
-
|
|
27
|
-
```js
|
|
28
|
-
import { PublicClientApplication } from '@azure/msal-browser';
|
|
29
|
-
import { MsalService } from '@azure/msal-angular';
|
|
30
|
-
|
|
31
|
-
@Component({})
|
|
32
|
-
export class AppComponent implements OnInit {
|
|
33
|
-
constructor(
|
|
34
|
-
private authService: MsalService
|
|
35
|
-
) {}
|
|
36
|
-
|
|
37
|
-
ngOnInit(): void {
|
|
38
|
-
this.authService.instance = new PublicClientApplication({
|
|
39
|
-
auth: {
|
|
40
|
-
clientId: 'CLIENT_ID_HERE',
|
|
41
|
-
authority: 'https://login.microsoftonline.com/TENANT_ID_HERE',
|
|
42
|
-
redirectUri: 'http://localhost:4200',
|
|
43
|
-
postLogoutRedirectUri: 'http://localhost:4200'
|
|
44
|
-
}
|
|
45
|
-
});
|
|
46
|
-
}
|
|
47
|
-
```
|
|
48
|
-
|
|
49
|
-
## Dynamic auth request
|
|
50
|
-
|
|
51
|
-
By default the MsalGuard and the MsalInterceptor use the static properties set in the config. Both can also be configured with a method for the `authRequest`, allowing the parameters used for authentication to be changed dynamically.
|
|
52
|
-
|
|
53
|
-
### MsalInterceptor - dynamic auth request (multi tenant tokens)
|
|
54
|
-
|
|
55
|
-
If `organizations` or `common` is used as the tenant, all tokens will be requested for the users' home tenant. However, this may not be the desired outcome. If a user is invited as a guest, the tokens may be from the wrong authority.
|
|
56
|
-
|
|
57
|
-
Setting the `authRequest` in the **MsalInterceptorConfig** to a method allows you to dynamically change the auth request. For instance, you may set the authority based on the home tenant of the account when using guest users.
|
|
58
|
-
Properties on `authRequest` may be changed, but should always extend the `originalAuthRequest` like below:
|
|
59
|
-
|
|
60
|
-
```js
|
|
61
|
-
export function MSALInterceptorConfigFactory(): MsalInterceptorConfiguration {
|
|
62
|
-
const protectedResourceMap = new Map<string, Array<string>>();
|
|
63
|
-
protectedResourceMap.set("https://graph.microsoft.com/v1.0/me", ["user.read"]);
|
|
64
|
-
|
|
65
|
-
return {
|
|
66
|
-
interactionType: InteractionType.Popup,
|
|
67
|
-
protectedResourceMap,
|
|
68
|
-
authRequest: (msalService, httpReq, originalAuthRequest) => {
|
|
69
|
-
return {
|
|
70
|
-
...originalAuthRequest,
|
|
71
|
-
authority: `https://login.microsoftonline.com/${originalAuthRequest.account?.tenantId ?? 'organizations'}`
|
|
72
|
-
};
|
|
73
|
-
}
|
|
74
|
-
};
|
|
75
|
-
}
|
|
76
|
-
...
|
|
77
|
-
|
|
78
|
-
@NgModule({
|
|
79
|
-
declarations: [...],
|
|
80
|
-
imports: [...],
|
|
81
|
-
providers: [
|
|
82
|
-
...
|
|
83
|
-
{
|
|
84
|
-
provide: MSAL_INTERCEPTOR_CONFIG,
|
|
85
|
-
useFactory: MSALInterceptorConfigFactory
|
|
86
|
-
}
|
|
87
|
-
]
|
|
88
|
-
});
|
|
89
|
-
|
|
90
|
-
```
|
package/docs/performance.md
DELETED
|
@@ -1,50 +0,0 @@
|
|
|
1
|
-
# Performance
|
|
2
|
-
|
|
3
|
-
## How to configure `@azure/msal-angular` to use your router's navigate function for client-side navigation
|
|
4
|
-
|
|
5
|
-
By default, when MSAL.js needs to navigate from one page in your application to another it will reassign `window.location`, causing a full frame redirect to the other page and causing your application to re-render. If you're using the Angular Router this may be undesireable since the Router enables "client-side" navigation and shows or hides only the parts of the page as necessary.
|
|
6
|
-
|
|
7
|
-
Currently there is one scenario where MSAL.js will navigate from one page in your application to another. If your application is doing **all** of the following things, continue reading:
|
|
8
|
-
|
|
9
|
-
- Your application is using the redirect flow, instead of the popup flow, to login
|
|
10
|
-
- `PublicClientApplication` is configured with `auth.navigateToLoginRequestUrl: true` (default)
|
|
11
|
-
- Your application has pages that may call `loginRedirect`/`acquireTokenRedirect` with a shared `redirectUri` i.e. You call `loginRedirect` from `http://localhost/protected` with a redirectUri of `http://localhost`
|
|
12
|
-
|
|
13
|
-
If your application is doing all of the things above you can override the method MSAL uses to navigate by importing the `MsalCustomNavigationClient` and calling `setNavigationClient`.
|
|
14
|
-
|
|
15
|
-
**NOTE**: Due to a security fix, the `MsalCustomNavigationClient` will not be using the Angular `Router` to navigate client-side when `navigateToLoginRequestUrl` is set to true and handling redirects. This is a known issue that will be addressed in a future release.
|
|
16
|
-
|
|
17
|
-
### Example Implementation
|
|
18
|
-
|
|
19
|
-
The example below will show how to implement this when using the Angular `Router`. More information on the Angular Router can be found [here](https://angular.io/guide/router), and you can find a full sample app that implements this for [Angular here](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/msal-lts/samples/msal-angular-v2-samples/angular10-sample-app).
|
|
20
|
-
|
|
21
|
-
```javascript
|
|
22
|
-
import { Component, OnInit, Inject } from '@angular/core';
|
|
23
|
-
import { Router } from '@angular/router';
|
|
24
|
-
import { Location } from '@angular/common';
|
|
25
|
-
import { MsalService, MsalBroadcastService, MSAL_GUARD_CONFIG, MsalGuardConfiguration, MsalCustomNavigationClient } from '@azure/msal-angular';
|
|
26
|
-
|
|
27
|
-
@Component({
|
|
28
|
-
selector: 'app-root',
|
|
29
|
-
templateUrl: './app.component.html',
|
|
30
|
-
styleUrls: ['./app.component.css']
|
|
31
|
-
})
|
|
32
|
-
export class AppComponent implements OnInit, OnDestroy {
|
|
33
|
-
|
|
34
|
-
constructor(
|
|
35
|
-
@Inject(MSAL_GUARD_CONFIG) private msalGuardConfig: MsalGuardConfiguration,
|
|
36
|
-
private authService: MsalService,
|
|
37
|
-
private msalBroadcastService: MsalBroadcastService,
|
|
38
|
-
private router: Router,
|
|
39
|
-
private location: Location
|
|
40
|
-
) {
|
|
41
|
-
const customNavigationClient = new MsalCustomNavigationClient(this.authService, this.router, this.location);
|
|
42
|
-
this.authService.instance.setNavigationClient(customNavigationClient);
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
ngOnInit(): void {
|
|
46
|
-
// Additional code
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
```
|
package/docs/public-apis.md
DELETED
|
@@ -1,29 +0,0 @@
|
|
|
1
|
-
# Public APIs for MSAL Angular
|
|
2
|
-
|
|
3
|
-
Before you start here, make sure you understand how to [initialize the application object](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/initialization.md).
|
|
4
|
-
|
|
5
|
-
The login APIs in MSAL retrieve an `authorization code` which can be exchanged for an [ID token](https://docs.microsoft.com/azure/active-directory/develop/id-tokens) for a signed in user, while consenting scopes for an additional resource, and an [access token](https://docs.microsoft.com/azure/active-directory/develop/access-tokens) containing the user consented scopes to allow your app to securely call the API.
|
|
6
|
-
|
|
7
|
-
You can read more about ID tokens on our [Azure Docs pages](https://docs.microsoft.com/azure/active-directory/develop/id-tokens).
|
|
8
|
-
|
|
9
|
-
## Public APIs
|
|
10
|
-
|
|
11
|
-
`@azure/msal-angular` exposes the following, along with their configurations. See the [library references](https://azuread.github.io/microsoft-authentication-library-for-js/ref/modules/_azure_msal_angular.html) for properties and methods.
|
|
12
|
-
|
|
13
|
-
1. [`MsalService`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.service.ts/)
|
|
14
|
-
1. [`MsalGuard`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.guard.ts/)
|
|
15
|
-
* [`MsalGuardConfiguration`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.guard.config.ts/)
|
|
16
|
-
1. [`MsalInterceptor`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.interceptor.ts/)
|
|
17
|
-
* [`MsalInterceptorConfiguration`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.interceptor.config.ts/)
|
|
18
|
-
1. [`MsalBroadcastService`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.broadcast.service.ts/)
|
|
19
|
-
1. [`MsalModule`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.module.ts/)
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
The login and acquire token functions using Angular observables are found on the [IMsalService](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/IMsalService.ts/).
|
|
23
|
-
|
|
24
|
-
`@azure/msal-angular` also exposes the following:
|
|
25
|
-
|
|
26
|
-
1. [`MsalRedirectComponent`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.redirect.component.ts): Used for handling redirects. See the [redirect doc](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/redirects.md) for more details.
|
|
27
|
-
1. [`MsalCustomNavigationClient`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/src/msal.navigation.client.ts): Used for client-side navigation. See the [performance doc](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-angular/docs/performance.md) for more details.
|
|
28
|
-
|
|
29
|
-
Additional functions from `@azure/msal-browser` are found on [`IPublicClientApplication`](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/src/app/IPublicClientApplication.ts), with corresponding documentation [here](https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/dev/lib/msal-browser/docs/login-user.md).
|