Skip to content

MSAL.js content consolidation - Bulk Updates #52

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions msal-javascript-conceptual/angular/configuration.md
Original file line number Diff line number Diff line change
@@ -1,15 +1,15 @@
---
title: MSAL Angular Configuration
description: Learn how to configure your Angular application to use MSAL Angular
author: EmLauber
author: Dickson-Mwendia
manager: CelesteDG

ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 01/10/2024
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---
# MSAL Angular Configuration

Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/errors.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Errors in MSAL Angular
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/events.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Events in MSAL Angular
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/initialization.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---
# Initializing MSAL Angular

Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/logging.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---
# Logging in MSAL Angular

Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/msal-guard.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---
# Using MSAL Guard to protect routes

Expand Down
138 changes: 69 additions & 69 deletions msal-javascript-conceptual/angular/msal-interceptor.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
---
title: Using the MSAL Interceptor
description: Learn how to use the MSAL Interceptor
author: Dickson-Mwendia
Expand All @@ -7,9 +6,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# MSAL Interceptor
Expand All @@ -18,15 +17,15 @@ MSAL Angular provides an `Interceptor` class that automatically acquires tokens

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.

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`.
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`.

## Configuration

### Configuring the `MsalInterceptor` in the *app.module.ts*

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`.

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.
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.

```javascript
import { NgModule } from '@angular/core';
Expand Down Expand Up @@ -80,7 +79,7 @@ While the `MsalInterceptor` is designed to acquire tokens silently, in the event

### Protected Resource Map

The protected resources and corresponding scopes are provided as a `protectedResourceMap` in the `MsalInterceptor` configuration.
The protected resources and corresponding scopes are provided as a `protectedResourceMap` in the `MsalInterceptor` configuration.

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.

Expand All @@ -89,76 +88,75 @@ For example:
* `["user.read"]` for Microsoft Graph
* `["<Application ID URL>/scope"]` for custom web APIs (that is, `api://<Application ID>/access_as_user`)


Scopes can be specified for a resource in the following ways:

1. An array of scopes, which will be added to every HTTP request to that resource, regardless of HTTP method.

```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string> | null>([
["https://graph.microsoft.com/v1.0/me", ["user.read", "profile"]],
["https://myapplication.com/user/*", ["customscope.read"]]
]),
}
```

1. An array of `ProtectedResourceScopes`, which will attach scopes only for specific HTTP methods.

```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string|ProtectedResourceScopes> | null>([
["https://graph.microsoft.com/v1.0/me", ["user.read"]],
["http://myapplication.com", [
{
httpMethod: "POST",
scopes: ["write.scope"]
}
]]
])
}
```

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"`.

```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string|ProtectedResourceScopes> | null>([
["http://myapplication.com", [
"all.scope",
{
httpMethod: "GET",
scopes: ["read.scope"]
},
{
httpMethod: "POST",
scopes: ["info.scope"]
}
]]
])
}
```
```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string> | null>([
["https://graph.microsoft.com/v1.0/me", ["user.read", "profile"]],
["https://myapplication.com/user/*", ["customscope.read"]]
]),
}
```

1. An array of `ProtectedResourceScopes`, which will attach scopes only for specific HTTP methods.

```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string|ProtectedResourceScopes> | null>([
["https://graph.microsoft.com/v1.0/me", ["user.read"]],
["http://myapplication.com", [
{
httpMethod: "POST",
scopes: ["write.scope"]
}
]]
])
}
```

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"`.

```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string|ProtectedResourceScopes> | null>([
["http://myapplication.com", [
"all.scope",
{
httpMethod: "GET",
scopes: ["read.scope"]
},
{
httpMethod: "POST",
scopes: ["info.scope"]
}
]]
])
}
```

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.

```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string> | null>([
["https://graph.microsoft.com/v1.0/me", ["user.read", "profile"]],
["https://myapplication.com/unprotected", null],
["https://myapplication.com/unprotected/post", [{ httpMethod: 'POST', scopes: null }]],
["https://myapplication.com", ["custom.scope"]]
]),
}
```
```javascript
{
interactionType: InteractionType.Redirect,
protectedResourceMap: new Map<string, Array<string> | null>([
["https://graph.microsoft.com/v1.0/me", ["user.read", "profile"]],
["https://myapplication.com/unprotected", null],
["https://myapplication.com/unprotected/post", [{ httpMethod: 'POST', scopes: null }]],
["https://myapplication.com", ["custom.scope"]]
]),
}
```

Other things to note regarding the `protectedResourceMap`:

* **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`).
* **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`).
* **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.

### Optional authRequest
Expand All @@ -167,8 +165,10 @@ For more information on the optional `authRequest` that can be set in the `MsalI

## Changes from msal-angular v1 to v2

* Note that the `unprotectedResourceMap` in MSAL Angular v1's `MsalAngularConfiguration` has been deprecated and no longer works.
> [!NOTE]
> The `unprotectedResourceMap` in MSAL Angular v1's `MsalAngularConfiguration` has been deprecated and no longer works.

* `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.
* Putting the root domain in the `protectedResourceMap` to protect all routes is no longer supported. Please use wildcard matching instead.

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).
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).
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/multi-tenant.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Multi-Tenant
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/performance.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# How to configure `@azure/msal-angular` to use your router's navigate function for client-side navigation
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/public-apis.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Commonly used public APIs in MSAL Angular
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/redirects.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---
# Using redirects in MSAL Angular

Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/ssosilent.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Silent login with ssoSilent()
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/universal-ssr.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---
# Angular Universal SSR with MSAL Angular

Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/v0-v1-upgrade-guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Migrating from MSAL Angular v0 to v1
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/v1-v2-upgrade-guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Upgrading from MSAL Angular v1 to v2
Expand Down
6 changes: 3 additions & 3 deletions msal-javascript-conceptual/angular/v2-v3-upgrade-guide.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,9 +7,9 @@ manager: CelesteDG
ms.service: msal
ms.subservice: msal-angular
ms.topic: conceptual
ms.date: 11/29/2023
ms.author: emilylauber
ms.reviewer: dmwendia,cwerner, owenrichards, kengaderdus
ms.date: 05/21/2025
ms.author: dmwendia
ms.reviewer: cwerner, owenrichards, kengaderdus
---

# Upgrading from MSAL Angular v2 to v3
Expand Down
Loading