Skip to content

Commit 72fe1bb

Browse files
derisenderisen
committed
review changes
1 parent ee2ab85 commit 72fe1bb

File tree

26 files changed

+236
-349
lines changed

26 files changed

+236
-349
lines changed

‎1-Authentication/1-sign-in/AppCreationScripts/sample.json‎

Lines changed: 40 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,42 +1,41 @@
11
{
2-
"Sample": {
3-
"Title": "Angular single-page application using MSAL Angular to sign-in users with Azure Active Directory",
4-
"Level": 100,
5-
"Client": "Angular SPA",
6-
"RepositoryUrl": "ms-identity-javascript-angular-tutorial",
7-
"Endpoint": "AAD v2.0"
8-
},
9-
"AADApps": [
10-
{
11-
"Id": "spa",
12-
"Name": "msal-angular-spa",
13-
"Kind" : "SinglePageApplication",
14-
"Audience": "AzureADMyOrg",
15-
"HomePage": "http://localhost:4200",
16-
"ReplyUrls":"http://localhost:4200",
17-
"ManualSteps": [
18-
{
19-
"Comment": "Navigate to the Manifest page, find the 'replyUrlsWithType' section and change the type of redirect URI to 'Spa'"
20-
}
21-
]
22-
}
23-
],
24-
25-
"CodeConfiguration": [
26-
{
27-
"App": "spa",
28-
"SettingKind": "Replace",
29-
"SettingFile": "\\..\\SPA\\src\\app\\auth-config.ts",
30-
"Mappings": [
31-
{
32-
"key": "Enter_the_Application_Id_Here",
33-
"value": ".AppId"
34-
},
35-
{
36-
"key": "Enter_the_Tenant_Info_Here",
37-
"value": "$tenantId"
38-
}
39-
]
40-
}
41-
]
42-
}
2+
"Sample": {
3+
"Title": "Angular single-page application using MSAL Angular to sign-in users with Azure Active Directory",
4+
"Level": 100,
5+
"Client": "Angular SPA",
6+
"RepositoryUrl": "ms-identity-javascript-angular-tutorial",
7+
"Endpoint": "AAD v2.0"
8+
},
9+
"AADApps": [
10+
{
11+
"Id": "spa",
12+
"Name": "msal-angular-spa",
13+
"Kind": "SinglePageApplication",
14+
"Audience": "AzureADMyOrg",
15+
"HomePage": "http://localhost:4200",
16+
"ReplyUrls": "http://localhost:4200",
17+
"ManualSteps": [
18+
{
19+
"Comment": "Navigate to the Manifest page, find the 'replyUrlsWithType' section and change the type of redirect URI to 'Spa'"
20+
}
21+
]
22+
}
23+
],
24+
"CodeConfiguration": [
25+
{
26+
"App": "spa",
27+
"SettingKind": "Replace",
28+
"SettingFile": "\\..\\SPA\\src\\app\\auth-config.ts",
29+
"Mappings": [
30+
{
31+
"key": "Enter_the_Application_Id_Here",
32+
"value": ".AppId"
33+
},
34+
{
35+
"key": "Enter_the_Tenant_Info_Here",
36+
"value": "$tenantId"
37+
}
38+
]
39+
}
40+
]
41+
}

‎1-Authentication/1-sign-in/README-incremental.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,9 @@
1515

1616
## Overview
1717

18-
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with Azure Active Directory (Azure AD) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular). In doing so, it also illustrates various authentication concepts, such as [ID Tokens](https://docs.microsoft.com/azure/active-directory/develop/id-tokens), [OIDC scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [single-sign on](https://docs.microsoft.com/azure/active-directory/develop/msal-js-sso), **silent requests** and more.
18+
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with Azure Active Directory (Azure AD) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular).
19+
20+
Here you'll learn about [ID Tokens](https://docs.microsoft.com/azure/active-directory/develop/id-tokens), [OIDC scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [single-sign on](https://docs.microsoft.com/azure/active-directory/develop/msal-js-sso), **silent requests** and more.
1921

2022
## Scenario
2123

@@ -28,8 +30,6 @@ This sample demonstrates an Angular single-page application (SPA) that lets user
2830

2931
| File/folder | Description |
3032
|---------------------------------|-----------------------------------------------------------|
31-
| `AppCreationScripts/` | Contains Powershell scripts to automate app registration. |
32-
| `ReadmeFiles/` | Contains illustrations and etc. |
3333
| `src/app/auth-config.ts` | Authentication parameters reside here. |
3434
| `src/app/app.module.ts` | MSAL Angular configuration parameters reside here. |
3535
| `src/app/app-routing.module.ts` | Configure your MSAL-Guard here. |
@@ -350,7 +350,7 @@ Use [Stack Overflow](http://stackoverflow.com/questions/tagged/msal) to get supp
350350
Ask your questions on Stack Overflow first and browse existing issues to see if someone has asked your question before.
351351
Make sure that your questions or comments are tagged with [`azure-active-directory` `azure-ad-b2c` `ms-identity` `adal` `msal`].
352352

353-
If you find a bug in the sample, raise the issue on [GitHub Issues](../../issues).
353+
If you find a bug in the sample, raise the issue on [GitHub Issues](../../../../issues).
354354

355355
To provide feedback on or suggest features for Azure Active Directory, visit [User Voice page](https://feedback.azure.com/forums/169401-azure-active-directory).
356356

‎1-Authentication/1-sign-in/README.md‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,9 @@
1515

1616
## Overview
1717

18-
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with Azure Active Directory (Azure AD) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular). In doing so, it also illustrates various authentication concepts, such as [ID Tokens](https://docs.microsoft.com/azure/active-directory/develop/id-tokens), [OIDC scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [single-sign on](https://docs.microsoft.com/azure/active-directory/develop/msal-js-sso), **silent requests** and more.
18+
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with Azure Active Directory (Azure AD) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular).
19+
20+
Here you'll learn about [ID Tokens](https://docs.microsoft.com/azure/active-directory/develop/id-tokens), [OIDC scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [single-sign on](https://docs.microsoft.com/azure/active-directory/develop/msal-js-sso), **silent requests** and more.
1921

2022
## Scenario
2123

@@ -28,8 +30,6 @@ This sample demonstrates an Angular single-page application (SPA) that lets user
2830

2931
| File/folder | Description |
3032
|---------------------------------|-----------------------------------------------------------|
31-
| `AppCreationScripts/` | Contains Powershell scripts to automate app registration. |
32-
| `ReadmeFiles/` | Contains illustrations and etc. |
3333
| `src/app/auth-config.ts` | Authentication parameters reside here. |
3434
| `src/app/app.module.ts` | MSAL Angular configuration parameters reside here. |
3535
| `src/app/app-routing.module.ts` | Configure your MSAL-Guard here. |
@@ -157,7 +157,7 @@ In the sample, authentication parameters reside in [auth-config.ts](./SPA/src/ap
157157

158158
### Sign-in
159159

160-
**MSAL Angular** exposes 3 login APIs: `loginPopup()`, `loginRedirect()` and `ssoSilent()`. First, setup your default interaction type in [app.module.ts](./SPA/src/app/app.module.ts):
160+
**MSAL Angular** exposes 3 login methods: `loginPopup()`, `loginRedirect()` and `ssoSilent()`. First, setup your default interaction type in [app.module.ts](./SPA/src/app/app.module.ts):
161161

162162
```typescript
163163
export function MSALGuardConfigFactory(): MsalGuardConfiguration {
@@ -346,7 +346,7 @@ Use [Stack Overflow](http://stackoverflow.com/questions/tagged/msal) to get supp
346346
Ask your questions on Stack Overflow first and browse existing issues to see if someone has asked your question before.
347347
Make sure that your questions or comments are tagged with [`azure-active-directory` `azure-ad-b2c` `ms-identity` `adal` `msal`].
348348

349-
If you find a bug in the sample, raise the issue on [GitHub Issues](../../issues).
349+
If you find a bug in the sample, raise the issue on [GitHub Issues](../../../../issues).
350350

351351
To provide feedback on or suggest features for Azure Active Directory, visit [User Voice page](https://feedback.azure.com/forums/169401-azure-active-directory).
352352

‎1-Authentication/1-sign-in/SPA/src/app/home/home.component.ts‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Subject } from 'rxjs';
33
import { filter, takeUntil } from 'rxjs/operators';
44

55
import { MsalBroadcastService, MsalService } from '@azure/msal-angular';
6-
import { EventMessage, EventType } from '@azure/msal-browser';
6+
import { EventMessage, EventType, AuthenticationResult } from '@azure/msal-browser';
77

88
@Component({
99
selector: 'app-home',
@@ -27,15 +27,14 @@ export class HomeComponent implements OnInit {
2727
takeUntil(this._destroying$)
2828
)
2929
.subscribe((result: EventMessage) => {
30-
if (result?.payload?.account) {
31-
this.authService.instance.setActiveAccount(result?.payload?.account);
32-
}
30+
console.log(result);
31+
const payload = result.payload as AuthenticationResult;
32+
this.authService.instance.setActiveAccount(payload.account);
3333
});
3434

3535
this.setLoginDisplay();
3636
this.checkAndSetActiveAccount();
3737
this.getClaims(this.authService.instance.getActiveAccount()?.idTokenClaims)
38-
3938
}
4039

4140
checkAndSetActiveAccount() {

‎1-Authentication/2-sign-in-b2c/AppCreationScripts/sample.json‎

Lines changed: 38 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,44 +1,42 @@
11
{
2-
"Sample": {
3-
"Title": "Angular single-page application using MSAL Angular to sign-in users against Azure AD B2C",
4-
"Level": 100,
5-
"Client": "Angular SPA",
6-
"RepositoryUrl": "ms-identity-javascript-angular-tutorial",
7-
"Endpoint": "AAD v2.0",
8-
"Provider": "B2C"
9-
},
10-
11-
"AADApps": [
12-
{
13-
"Id": "spa",
14-
"Name": "msal-angular-spa",
15-
"Kind" : "SinglePageApplication",
16-
"Audience": "AzureADandPersonalMicrosoftAccount",
17-
"HomePage": "http://localhost:4200",
18-
"ReplyUrls":"http://localhost:4200",
19-
"ManualSteps": [
20-
{
21-
"Comment": "Navigate to the Manifest page, find the 'replyUrlsWithType' section and change the type of redirect URI to 'Spa'"
22-
}
23-
]
24-
}
25-
],
26-
27-
"CodeConfiguration": [
2+
"Sample": {
3+
"Title": "Angular single-page application using MSAL Angular to sign-in users against Azure AD B2C",
4+
"Level": 100,
5+
"Client": "Angular SPA",
6+
"RepositoryUrl": "ms-identity-javascript-angular-tutorial",
7+
"Endpoint": "AAD v2.0",
8+
"Provider": "B2C"
9+
},
10+
"AADApps": [
11+
{
12+
"Id": "spa",
13+
"Name": "msal-angular-spa",
14+
"Kind": "SinglePageApplication",
15+
"Audience": "AzureADandPersonalMicrosoftAccount",
16+
"HomePage": "http://localhost:4200",
17+
"ReplyUrls": "http://localhost:4200",
18+
"ManualSteps": [
2819
{
29-
"App": "spa",
30-
"SettingKind": "Replace",
31-
"SettingFile": "\\..\\SPA\\src\\app\\auth-config.ts",
32-
"Mappings": [
33-
{
34-
"key": "Enter_the_Application_Id_Here",
35-
"value": ".AppId"
36-
},
37-
{
38-
"key": "Enter_the_Tenant_Info_Here",
39-
"value": "$tenantName"
40-
}
41-
]
20+
"Comment": "Navigate to the Manifest page, find the 'replyUrlsWithType' section and change the type of redirect URI to 'Spa'"
4221
}
4322
]
44-
}
23+
}
24+
],
25+
"CodeConfiguration": [
26+
{
27+
"App": "spa",
28+
"SettingKind": "Replace",
29+
"SettingFile": "\\..\\SPA\\src\\app\\auth-config.ts",
30+
"Mappings": [
31+
{
32+
"key": "Enter_the_Application_Id_Here",
33+
"value": ".AppId"
34+
},
35+
{
36+
"key": "Enter_the_Tenant_Info_Here",
37+
"value": "$tenantName"
38+
}
39+
]
40+
}
41+
]
42+
}

‎1-Authentication/2-sign-in-b2c/README-incremental.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,9 @@
1515

1616
## Overview
1717

18-
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with [Azure AD B2C](https://azure.microsoft.com/services/active-directory/external-identities/b2c/) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular). In doing so, it also illustrates various authentication and B2C concepts, such as [ID Tokens](https://docs.microsoft.com/azure/active-directory-b2c/tokens-overview#token-types), [OIDC Scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [external identity providers](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#external-identity-providers) , [consumer social accounts](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#consumer-accounts), [single-sign on (SSO)](https://docs.microsoft.com/azure/active-directory-b2c/session-overview), **silent requests** and more.
18+
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with [Azure AD B2C](https://azure.microsoft.com/services/active-directory/external-identities/b2c/) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular).
19+
20+
Here you'll learn about [ID Tokens](https://docs.microsoft.com/azure/active-directory-b2c/tokens-overview#token-types), [OIDC Scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [external identity providers](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#external-identity-providers), [consumer social accounts](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#consumer-accounts), [single-sign on (SSO)](https://docs.microsoft.com/azure/active-directory-b2c/session-overview), **silent requests** and more.
1921

2022
## Scenario
2123

@@ -28,8 +30,6 @@ This sample demonstrates an Angular single-page application (SPA) that lets user
2830

2931
| File/folder | Description |
3032
|---------------------------------|-----------------------------------------------------------|
31-
| `AppCreationScripts/` | Contains Powershell scripts to automate app registration. |
32-
| `ReadmeFiles/` | Contains illustrations etc. |
3333
| `src/app/auth-config.ts` | Authentication parameters reside here. |
3434
| `src/app/app.module.ts` | MSAL Angular configuration parameters reside here. |
3535
| `src/app/app-routing.module.ts` | Configure your MSAL-Guard here. |
@@ -418,7 +418,7 @@ Use [Stack Overflow](http://stackoverflow.com/questions/tagged/msal) to get supp
418418
Ask your questions on Stack Overflow first and browse existing issues to see if someone has asked your question before.
419419
Make sure that your questions or comments are tagged with [`azure-active-directory` `azure-ad-b2c` `ms-identity` `adal` `msal`].
420420

421-
If you find a bug in the sample, raise the issue on [GitHub Issues](../../issues).
421+
If you find a bug in the sample, raise the issue on [GitHub Issues](../../../../issues).
422422

423423
To provide feedback on or suggest features for Azure Active Directory, visit [User Voice page](https://feedback.azure.com/forums/169401-azure-active-directory).
424424

‎1-Authentication/2-sign-in-b2c/README.md‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,9 @@
1515

1616
## Overview
1717

18-
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with [Azure AD B2C](https://azure.microsoft.com/services/active-directory/external-identities/b2c/) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular). In doing so, it also illustrates various authentication and B2C concepts, such as [ID Tokens](https://docs.microsoft.com/azure/active-directory-b2c/tokens-overview#token-types), [OIDC Scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [external identity providers](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#external-identity-providers) , [consumer social accounts](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#consumer-accounts), [single-sign on (SSO)](https://docs.microsoft.com/azure/active-directory-b2c/session-overview), **silent requests** and more.
18+
This sample demonstrates an Angular single-page application (SPA) that lets users sign-in with [Azure AD B2C](https://azure.microsoft.com/services/active-directory/external-identities/b2c/) using the [Microsoft Authentication Library for Angular (Preview)](https://github.com/AzureAD/microsoft-authentication-library-for-js/tree/dev/lib/msal-angular) (MSAL Angular).
19+
20+
Here you'll learn about [ID Tokens](https://docs.microsoft.com/azure/active-directory-b2c/tokens-overview#token-types), [OIDC Scopes](https://docs.microsoft.com/azure/active-directory/develop/v2-permissions-and-consent#openid-connect-scopes), [external identity providers](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#external-identity-providers), [consumer social accounts](https://docs.microsoft.com/azure/active-directory-b2c/technical-overview#consumer-accounts), [single-sign on (SSO)](https://docs.microsoft.com/azure/active-directory-b2c/session-overview), **silent requests** and more.
1921

2022
## Scenario
2123

@@ -28,8 +30,6 @@ This sample demonstrates an Angular single-page application (SPA) that lets user
2830

2931
| File/folder | Description |
3032
|---------------------------------|-----------------------------------------------------------|
31-
| `AppCreationScripts/` | Contains Powershell scripts to automate app registration. |
32-
| `ReadmeFiles/` | Contains illustrations etc. |
3333
| `src/app/auth-config.ts` | Authentication parameters reside here. |
3434
| `src/app/app.module.ts` | MSAL Angular configuration parameters reside here. |
3535
| `src/app/app-routing.module.ts` | Configure your MSAL-Guard here. |
@@ -121,7 +121,7 @@ To setup your B2C user-flows, do the following:
121121

122122
![Screenshot](./ReadmeFiles/screenshot.png)
123123

124-
> :information_source: Did the sample not work for you as expected? Then please reach out to us using the [GitHub Issues](../../../issues) page.
124+
> :information_source: Did the sample not work for you as expected? Then please reach out to us using the [GitHub Issues](../../../../issues) page.
125125
126126
> :information_source: if you believe your issue is with the B2C service itself rather than with the sample, please file a support ticket with the B2C team by following the instructions [here](https://docs.microsoft.com/en-us/azure/active-directory-b2c/support-options).
127127
@@ -414,7 +414,7 @@ Use [Stack Overflow](http://stackoverflow.com/questions/tagged/msal) to get supp
414414
Ask your questions on Stack Overflow first and browse existing issues to see if someone has asked your question before.
415415
Make sure that your questions or comments are tagged with [`azure-active-directory` `azure-ad-b2c` `ms-identity` `adal` `msal`].
416416

417-
If you find a bug in the sample, raise the issue on [GitHub Issues](../../issues).
417+
If you find a bug in the sample, raise the issue on [GitHub Issues](../../../../issues).
418418

419419
To provide feedback on or suggest features for Azure Active Directory, visit [User Voice page](https://feedback.azure.com/forums/169401-azure-active-directory).
420420

0 commit comments

Comments
 (0)