Skip to content

Commit 1426efe

Browse files
jasonnutterjasonnutter
committed
Fix indentation and titles
1 parent 0065733 commit 1426efe

File tree

2 files changed

+74
-73
lines changed

2 files changed

+74
-73
lines changed

‎articles/active-directory/develop/quickstart-v2-angular.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: Sign in users in Angular single-page apps
2+
title: Sign in users in Angular single-page apps | Azure
33
titleSuffix: Microsoft identity platform
44
description: Learn how an Angular app can call an API that requires access tokens using the Microsoft identity platform.
55
services: active-directory

‎articles/active-directory/develop/tutorial-v2-angular.md

Lines changed: 73 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
---
2-
title: Angular single-page app tutorial
2+
title: Angular single-page app tutorial - Microsoft identity platform | Azure
33
description: Learn how Angular SPA applications can call an API that requires access tokens from the Microsoft identity platform endpoint
44
services: active-directory
55
documentationcenter: dev-center-name
@@ -90,89 +90,90 @@ Follow the instructions to [register a single-page application](https://docs.mic
9090

9191
1. In the *src/app* folder, edit *app.module.ts* and add the `MSALModule` to `imports` as well as the `isIE` const as shown below:
9292

93-
```javascript
94-
const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
95-
@NgModule({
96-
declarations: [
97-
AppComponent
98-
],
99-
imports: [
100-
BrowserModule,
101-
AppRoutingModule,
102-
MsalModule.forRoot({
103-
auth: {
104-
clientId: 'Enter_the_Application_Id_here', // This is your client ID
105-
authority: 'Enter_the_Cloud_Instance_Id_Here'/'Enter_the_Tenant_Info_Here', // This is your tenant id
106-
redirectUri: 'Enter_the_Redirect_Uri_Here'// This is your redirect URI
107-
},
108-
cache: {
109-
cacheLocation: 'localStorage',
110-
storeAuthStateInCookie: isIE, // set to true for IE 11
111-
},
112-
}, {
113-
popUp: !isIE,
114-
consentScopes: [
115-
'user.read',
116-
'openid',
117-
'profile',
93+
```javascript
94+
const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
95+
@NgModule({
96+
declarations: [
97+
AppComponent
11898
],
119-
unprotectedResources: [],
120-
protectedResourceMap: [
121-
['https://graph.microsoft.com/v1.0/me', ['user.read']]
99+
imports: [
100+
BrowserModule,
101+
AppRoutingModule,
102+
MsalModule.forRoot({
103+
auth: {
104+
clientId: 'Enter_the_Application_Id_here', // This is your client ID
105+
authority: 'Enter_the_Cloud_Instance_Id_Here'/'Enter_the_Tenant_Info_Here', // This is your tenant id
106+
redirectUri: 'Enter_the_Redirect_Uri_Here'// This is your redirect URI
107+
},
108+
cache: {
109+
cacheLocation: 'localStorage',
110+
storeAuthStateInCookie: isIE, // set to true for IE 11
111+
},
112+
}, {
113+
popUp: !isIE,
114+
consentScopes: [
115+
'user.read',
116+
'openid',
117+
'profile',
118+
],
119+
unprotectedResources: [],
120+
protectedResourceMap: [
121+
['https://graph.microsoft.com/v1.0/me', ['user.read']]
122+
],
123+
extraQueryParameters: {}
124+
})
122125
],
123-
extraQueryParameters: {}
126+
providers: [],
127+
bootstrap: [AppComponent]
124128
})
125-
],
126-
providers: [],
127-
bootstrap: [AppComponent]
128-
})
129-
```
129+
```
130130

131-
Replace these values as such:
131+
Replace these values as such:
132132

133-
|Value name|About|
134-
|---------|---------|
135-
|Enter_the_Application_Id_Here|In the **Overview** page of your application registration, this is your **Application (client) ID** |
136-
|Enter_the_Cloud_Instance_Id_Here|This is the instance of the Azure cloud. For the main or global Azure cloud, enter https://login.microsoftonline.com. For national clouds (for example, China), see [National clouds](https://docs.microsoft.com/azure/active-directory/develop/authentication-national-cloud).|
137-
|Enter_the_Tenant_Info_Here| Set to one of the following options: 1) If your application supports *accounts in this organizational directory*, replace this value with the **Directory (Tenant) ID** or **Tenant name** (for example, *contoso.microsoft.com*). 2) If your application supports *accounts in any organizational directory*, replace this value with **organizations**. 3) If your application supports *accounts in any organizational directory and personal Microsoft accounts*, replace this value with **common**. 4) To restrict support to *personal Microsoft accounts only*, replace this value with **consumers**. |
138-
|Enter_the_Redirect_Uri_Here|Replace with `http://localhost:4200`|
133+
|Value name|About|
134+
|---------|---------|
135+
|Enter_the_Application_Id_Here|In the **Overview** page of your application registration, this is your **Application (client) ID** |
136+
|Enter_the_Cloud_Instance_Id_Here|This is the instance of the Azure cloud. For the main or global Azure cloud, enter https://login.microsoftonline.com. For national clouds (for example, China), see [National clouds](https://docs.microsoft.com/azure/active-directory/develop/authentication-national-cloud).|
137+
|Enter_the_Tenant_Info_Here| Set to one of the following options: 1) If your application supports *accounts in this organizational directory*, replace this value with the **Directory (Tenant) ID** or **Tenant name** (for example, *contoso.microsoft.com*). 2) If your application supports *accounts in any organizational directory*, replace this value with **organizations**. 3) If your application supports *accounts in any organizational directory and personal Microsoft accounts*, replace this value with **common**. 4) To restrict support to *personal Microsoft accounts only*, replace this value with **consumers**. |
138+
|Enter_the_Redirect_Uri_Here|Replace with `http://localhost:4200`|
139139

140-
For more information about available configurable options, see [Initialize client applications](msal-js-initializing-client-applications.md).
140+
For more information about available configurable options, see [Initialize client applications](msal-js-initializing-client-applications.md).
141141

142142
2. In the same file, add the following import to the top of the file:
143-
```javascript
144-
import { MsalModule, MsalInterceptor } from '@azure/msal-angular';
145-
```
146143

147-
### Import modules
148-
Add the following import statements to the top of `src/app/app.component.ts`
149-
```javascript
150-
import { MsalService } from '@azure/msal-angular';
151-
import { Component, OnInit } from '@angular/core';
152-
```
153-
## Sign in a user
154-
155-
Add the following code to `AppComponent` to sign in a user:
144+
```javascript
145+
import { MsalModule, MsalInterceptor } from '@azure/msal-angular';
146+
```
156147

157-
```javascript
158-
export class AppComponent implements OnInit {
159-
constructor(private broadcastService: BroadcastService, private authService: MsalService) { }
160-
161-
login() {
162-
const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
163-
164-
if (isIE) {
165-
this.authService.loginRedirect({
166-
extraScopesToConsent: ["user.read", "openid", "profile"]
167-
});
168-
} else {
169-
this.authService.loginPopup({
170-
extraScopesToConsent: ["user.read", "openid", "profile"]
171-
});
148+
### Import modules
149+
Add the following import statements to the top of `src/app/app.component.ts`
150+
```javascript
151+
import { MsalService } from '@azure/msal-angular';
152+
import { Component, OnInit } from '@angular/core';
153+
```
154+
## Sign in a user
155+
156+
Add the following code to `AppComponent` to sign in a user:
157+
158+
```javascript
159+
export class AppComponent implements OnInit {
160+
constructor(private broadcastService: BroadcastService, private authService: MsalService) { }
161+
162+
login() {
163+
const isIE = window.navigator.userAgent.indexOf('MSIE ') > -1 || window.navigator.userAgent.indexOf('Trident/') > -1;
164+
165+
if (isIE) {
166+
this.authService.loginRedirect({
167+
extraScopesToConsent: ["user.read", "openid", "profile"]
168+
});
169+
} else {
170+
this.authService.loginPopup({
171+
extraScopesToConsent: ["user.read", "openid", "profile"]
172+
});
173+
}
172174
}
173175
}
174-
}
175-
```
176+
```
176177

177178
> [!TIP]
178179
> We recommend using `loginRedirect` for Internet Explorer users.

0 commit comments

Comments
 (0)