You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
You need the following Azure AD B2C resources in place before continuing with the steps in this tutorial:
32
+
33
+
*[Azure AD B2C tenant](tutorial-create-tenant.md)
34
+
*[Application registered](tutorial-register-applications.md) in your tenant
35
+
*[User flows created](tutorial-create-user-flows.md) in your tenant
36
+
37
+
Additionally, you need the following in your local development environment:
38
+
39
+
* Code editor, for example [Visual Studio Code](https://code.visualstudio.com/) or [Visual Studio 2019](https://www.visualstudio.com/downloads/)
40
+
*[.NET Core SDK 2.0.0](https://www.microsoft.com/net/core) or later
41
+
*[Node.js](https://nodejs.org/en/download/)
35
42
36
43
## Update the application
37
44
38
-
In the tutorial that you completed as part of the prerequisites, you added a web application in Azure AD B2C. To enable communication with the sample in the tutorial, you need to add a redirect URI to the application in Azure AD B2C.
45
+
In the second tutorial that you completed as part of the prerequisites, you registered a web application in Azure AD B2C. To enable communication with the sample in the tutorial, you need to add a redirect URI to the application in Azure AD B2C.
39
46
40
47
1. Sign in to the [Azure portal](https://portal.azure.com).
41
-
2. Make sure you're using the directory that contains your Azure AD B2C tenant by clicking the **Directory and subscription filter** in the top menu and choosing the directory that contains your tenant.
42
-
3. Choose **All services** in the top-left corner of the Azure portal, and then search for and select **Azure AD B2C**.
43
-
4. Select **Applications**, and then select the *webapp1* application.
44
-
5. Under **Reply URL**, add `http://localhost:6420`.
45
-
6. Select **Save**.
46
-
7. On the properties page, record the application ID that you'll use when you configure the web application.
47
-
8. Select **Keys**, select **Generate key**, and select **Save**. Record the key that you'll use when you configure the web application.
48
+
1. Make sure you're using the directory that contains your Azure AD B2C tenant by clicking the **Directory and subscription filter** in the top menu and choosing the directory that contains your tenant.
49
+
1. Choose **All services** in the top-left corner of the Azure portal, and then search for and select **Azure AD B2C**.
50
+
1. Select **Applications**, and then select the *webapp1* application.
51
+
1. Under **Reply URL**, add `http://localhost:6420`.
52
+
1. Select **Save**.
53
+
1. On the properties page, record the **Application ID**. You use the app ID in a later step when you update the code in the single-page web application.
48
54
49
-
## Configure the sample
55
+
## Get the sample code
50
56
51
-
In this tutorial, you configure a sample that you can download from GitHub. The sample demonstrates how a single-page application can use Azure AD B2C for user sign-up, sign-in, and call a protected web API.
57
+
In this tutorial, you configure a code sample that you download from GitHub. The sample demonstrates how a single-page application can use Azure AD B2C for user sign up and signin, and to call a protected web API.
52
58
53
59
[Download a zip file](https://github.com/Azure-Samples/active-directory-b2c-javascript-msal-singlepageapp/archive/master.zip) or clone the sample from GitHub.
Now that you've obtained the sample, update the code with your Azure AD B2C tenant name and the application ID you recorded in an earlier step.
60
68
61
-
1. Open the `index.html` file in the sample.
62
-
2. Configure the sample with the application ID and key that you recorded earlier. Change the following lines of code by replacing the values with the names of your directory and APIs:
69
+
1. Open the `index.html` file in the root of the sample directory.
70
+
1. In the `msalConfig` definition, modify the **clientId** value with the Application ID you recorded in an earlier step. Next, update the **authority** URI value with your Azure AD B2C tenant name. Also update the URI with the name of the sign-up/sign-in user flow you created in one of the prerequisites (for example, *B2C_1_signupsignin1*).
63
71
64
72
```javascript
65
-
// The current application coordinates were pre-registered in a B2C directory.
clientId:"00000000-0000-0000-0000-000000000000", //This is your client ID
76
+
authority:"https://fabrikamb2c.b2clogin.com/fabrikamb2c.onmicrosoft.com/b2c_1_susi", //This is your tenant info
77
+
validateAuthority:false
78
+
},
79
+
cache: {
80
+
cacheLocation:"localStorage",
81
+
storeAuthStateInCookie:true
82
+
}
71
83
};
72
84
```
73
85
74
-
The name of the user flow used inthis tutorial is **B2C_1_signupsignin1**. If you're using a different user flow name, use your user flow name in `authority` value.
86
+
The name of the user flow used inthis tutorial is **B2C_1_signupsignin1**. If you're using a different user flow name, specify that name in the `authority` value.
75
87
76
88
## Run the sample
77
89
78
-
1. Launch a Node.js command prompt.
79
-
2. Change to the directory containing the Node.js sample. For example `cd c:\active-directory-b2c-javascript-msal-singlepageapp`
80
-
3. Run the following commands:
90
+
1. Open a console window and change to the directory containing the sample. For example:
91
+
92
+
```console
93
+
cd active-directory-b2c-javascript-msal-singlepageapp
94
+
```
95
+
1. Run the following commands:
81
96
82
97
```
83
98
npm install && npm update
84
99
node server.js
85
100
```
86
101
87
-
The console window displays the port number of where the app is hosted.
88
-
102
+
The console window displays the port number of the locally running Node.js server:
103
+
89
104
```
90
105
Listening on port 6420...
91
106
```
92
107
93
-
4. Use a browser to navigate to the address `http://localhost:6420` to view the application.
108
+
1. Navigate to `http://localhost:6420` in your browser to view the application.
94
109
95
110
The sample supports sign-up, sign-in, profile editing, and password reset. This tutorial highlights how a user signs up using an email address.
96
111
97
112
### Sign up using an email address
98
113
99
-
1. Click **Login** to sign up as a user of the application. This uses the **B2C_1_signupsignin1** user flow you defined in a previous step.
100
-
2. Azure AD B2C presents a sign-in page with a sign-up link. Since you don't have an account yet, click the **Sign up now** link.
101
-
3. The sign-up workflow presents a page to collect and verify the user's identity using an email address. The sign-up workflow also collects the user's password and the requested attributes defined in the user flow.
114
+
1. Click **Login** to sign up as a user of the application. This uses the **B2C_1_signupsignin1** user flow you specified in a previous step.
115
+
1. Azure AD B2C presents a sign-in page with a sign-up link. Since you don't have an account yet, click the **Sign up now** link.
116
+
1. The sign-up workflow presents a page to collect and verify the user's identity using an email address. The sign-up workflow also collects the user's password and the requested attributes defined in the user flow.
102
117
103
-
Use a valid email address and validate using the verification code. Set a password. Enter values for the requested attributes.
118
+
Use a valid email address and validate using the verification code. Set a password. Enter values for the requested attributes.
4. Click **Create** to create a local account in the Azure ADB2C directory.
122
+
1. Click **Create** to create a local account in the Azure ADB2C directory.
108
123
109
-
Now, the user can use an email address to sign inand use the SPA app.
124
+
When you click **Create**, the sign up page closes and the sign inpage reappears.
110
125
111
-
> [!NOTE]
112
-
> After login, the app displays an "insufficient permissions"error. You receive this error because you are attempting to access a resource from the demo directory. Since your access token is only valid for your Azure AD directory, the API call is unauthorized. Continuewith the next tutorial to create a protected web APIfor your directory.
126
+
You can now use your email address and password to sign in to the application.
127
+
128
+
### Error: insufficient permissions
129
+
130
+
After you sign in, the app displays an insufficient permissions error -this is **expected**:
131
+
132
+
`ServerError: AADB2C90205: This application does not have sufficient permissions against this web resource to perform the operation.`
133
+
134
+
You receive this error because you're attempting to access a resource from the demo directory, but your access token is valid only for your Azure AD directory. The API call is therefore unauthorized.
135
+
136
+
Continue with the next tutorial in the series (see [Next steps](#next-steps)) to create a protected web API for your directory.
113
137
114
138
## Next steps
115
139
@@ -120,5 +144,7 @@ In this article, you learned how to:
120
144
> * Configure the sample to use the application
121
145
> * Sign up using the user flow
122
146
147
+
Now move on to the next tutorial in the series to grant access to a protected web API from the SPA:
148
+
123
149
> [!div class="nextstepaction"]
124
150
> [Tutorial: Grant access to an ASP.NET Core web API from a single-page app using Azure Active Directory B2C](active-directory-b2c-tutorials-spa-webapi.md)
For more information about the apps, see [SaaS application integration with Azure Active Directory](https://aka.ms/appstutorial). For more information about listing your application in the Azure AD app gallery, see [List your application in the Azure Active Directory application gallery](https://aka.ms/azureadapprequest).
> The value is not real. Update the value with the actual Sign-On URL. Contact [Insperity ExpensAble Client support team](http://expensable.com/support/support-overview) to get the value. You can also refer to the patterns shown in the **Basic SAML Configuration** section in the Azure portal.
108
+
> The value is not real. Update the value with the actual Sign-On URL. Contact [Insperity ExpensAble Client support team](https://www.insperity.com/products/expense-management/support/express/) to get the value. You can also refer to the patterns shown in the **Basic SAML Configuration** section in the Azure portal.
109
109
110
110
5. On the **Set up Single Sign-On with SAML** page, in the **SAML Signing Certificate** section, click **Download** to download the **Certificate (Base64)** from the given options as per your requirement and save it on your computer.
111
111
@@ -123,7 +123,7 @@ To configure Azure AD single sign-on with Insperity ExpensAble, perform the foll
123
123
124
124
### Configure Insperity ExpensAble Single Sign-On
125
125
126
-
To configure single sign-on on **Insperity ExpensAble** side, you need to send the downloaded **Certificate (Base64)** and appropriate copied URLs from Azure portal to [Insperity ExpensAble support team](http://expensable.com/support/support-overview). They set this setting to have the SAML SSO connection set properly on both sides.
126
+
To configure single sign-on on **Insperity ExpensAble** side, you need to send the downloaded **Certificate (Base64)** and appropriate copied URLs from Azure portal to [Insperity ExpensAble support team](https://www.insperity.com/products/expense-management/support/express/). They set this setting to have the SAML SSO connection set properly on both sides.
127
127
128
128
### Create an Azure AD test user
129
129
@@ -178,7 +178,7 @@ In this section, you enable Britta Simon to use Azure single sign-on by granting
178
178
179
179
### Create Insperity ExpensAble test user
180
180
181
-
In this section, you create a user called Britta Simon in Insperity ExpensAble. Work with [Insperity ExpensAble support team](http://expensable.com/support/support-overview) to add the users in the Insperity ExpensAble platform. Users must be created and activated before you use single sign-on.
181
+
In this section, you create a user called Britta Simon in Insperity ExpensAble. Work with [Insperity ExpensAble support team](https://www.insperity.com/products/expense-management/support/express/) to add the users in the Insperity ExpensAble platform. Users must be created and activated before you use single sign-on.
Copy file name to clipboardExpand all lines: articles/aks/istio-install.md
+8-3Lines changed: 8 additions & 3 deletions
Original file line number
Diff line number
Diff line change
@@ -148,14 +148,19 @@ Now move on to the next section to [Install the Istio CRDs on AKS](#install-the-
148
148
149
149
### Windows
150
150
151
-
To install the Istio `istioctl` client binary in a **Powershell**-based shell on Windows, use the following commands. These commands copy the `istioctl` client binary to an Istio folder and make it permanently available via your `PATH`. You don't need elevated (Admin) privileges to run these commands.
151
+
To install the Istio `istioctl` client binary in a **Powershell**-based shell on Windows, use the following commands. These commands copy the `istioctl` client binary to an Istio folder and then make it available both immediately (in current shell) and permanently (across shell restarts) via your `PATH`. You don't need elevated (Admin) privileges to run these commands and you don't need to restart your shell.
Copy file name to clipboardExpand all lines: articles/azure-monitor/app/export-stream-analytics.md
+1-1Lines changed: 1 addition & 1 deletion
Original file line number
Diff line number
Diff line change
@@ -142,7 +142,7 @@ Paste this query:
142
142
143
143
* export-input is the alias we gave to the stream input
144
144
* pbi-output is the output alias we defined
145
-
* We use [OUTER APPLY GetElements](https://msdn.microsoft.com/library/azure/dn706229.aspx) because the event name is in a nested JSON array. Then the Select picks the event name, together with a count of the number of instances with that name in the time period. The [Group By](https://msdn.microsoft.com/library/azure/dn835023.aspx) clause groups the elements into time periods of one minute.
145
+
* We use [OUTER APPLY GetElements](https://docs.microsoft.com/stream-analytics-query/apply-azure-stream-analytics) because the event name is in a nested JSON array. Then the Select picks the event name, together with a count of the number of instances with that name in the time period. The [Group By](https://docs.microsoft.com/stream-analytics-query/group-by-azure-stream-analytics) clause groups the elements into time periods of one minute.
0 commit comments