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
Copy file name to clipboardExpand all lines: articles/frontdoor/create-front-door-portal.md
+50-52Lines changed: 50 additions & 52 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -7,17 +7,17 @@ manager: KumudD
7
7
ms.service: frontdoor
8
8
ms.topic: quickstart
9
9
ms.workload: infrastructure-services
10
-
ms.date: 08/15/2022
10
+
ms.date: 10/02/2023
11
11
ms.author: duau
12
12
ms.custom: mode-ui
13
13
#Customer intent: As an IT admin, I want to direct user traffic to ensure high availability of web applications.
14
14
---
15
15
16
16
# Quickstart: Create an Azure Front Door profile - Azure portal
17
17
18
-
In this quickstart, you'll learn how to create an Azure Front Door profile using the Azure portal. You can create an Azure Front Door profile through *Quick create* with basic configurations or through the *Custom create* which allows a more advanced configuration.
18
+
In this quickstart, you learn how to create an Azure Front Door profile using the Azure portal. You can create an Azure Front Door profile through *Quick create* with basic configurations or through the *Custom create* which allows a more advanced configuration.
19
19
20
-
With *Custom create*, you deploy two App services. Then, you create the Azure Front Door profile using the two App services as your origin. Lastly, you'll verify connectivity to your App services using the Azure Front Door frontend hostname.
20
+
With *Custom create*, you deploy two App services. Then, you create the Azure Front Door profile using the two App services as your origin. Lastly, you verify connectivity to your App services using the Azure Front Door frontend hostname.
21
21
22
22
:::image type="content" source="media/quickstart-create-front-door/environment-diagram.png" alt-text="Diagram of Front Door deployment environment using the Azure portal." border="false":::
23
23
@@ -31,13 +31,13 @@ An Azure account with an active subscription. [Create an account for free](https
31
31
32
32
1. Sign in to the [Azure portal](https://portal.azure.com).
33
33
34
-
1.From the home page or the Azure menu, select**+ Create a resource**. Search for *Front Door and CDN profiles*. Then select **Create**.
34
+
1.To create a new resource for Front Door and CDN profiles, navigate to the home page or the Azure menu and select**+ Create a resource** button. Then, enter *Front Door and CDN profiles* in the search box and select **Create**.
35
35
36
36
1. On the **Compare offerings** page, select **Quick create**. Then select **Continue to create a Front Door**.
37
37
38
38
:::image type="content" source="./media/create-front-door-portal/front-door-quick-create.png" alt-text="Screenshot of compare offerings.":::
39
39
40
-
1. On the **Create a Front Door profile** page, enter, or select the following settings.
40
+
1. On the **Create a Front Door profile** page, provide the following information for the required settings.
41
41
42
42
:::image type="content" source="./media/create-front-door-portal/front-door-quick-create-2.png" alt-text="Screenshot of Front Door quick create page.":::
43
43
@@ -68,21 +68,21 @@ An Azure account with an active subscription. [Create an account for free](https
68
68
69
69
In the previous tutorial, you created an Azure Front Door profile through *Quick create*, which created your profile with basic configurations.
70
70
71
-
You'll now create an Azure Front Door profile using *Custom create* and deploy two App services that your Azure Front Door profile will use as your origin.
71
+
Youcreate an Azure Front Door profile using *Custom create* and deploy two App services that your Azure Front Door profile uses as your origins.
72
72
73
73
### Create two Web App instances
74
74
75
75
If you already have services to use as an origin, skip to [create a Front Door for your application](#create-a-front-door-for-your-application).
76
76
77
-
In this example, we create two Web App instances that are deployed in two different Azure regions. Both web application instances will run in *Active/Active* mode, so either one can service incoming traffic. This configuration differs from an *Active/Stand-By* configuration, where one acts as a failover.
77
+
This example demonstrates how to create two Web App instances that are deployed in two different Azure regions. Both web application instances operate in Active/Active mode, which means that they can both handle incoming traffic. This configuration is different from an Active/Stand-By configuration, where one instance serves as a backup for the other.
78
78
79
-
Use the following steps to create two Web Apps used in this example.
79
+
To create the two Web Apps for this example, follow these steps:
80
80
81
81
1. Sign in to the [Azure portal](https://portal.azure.com).
82
82
83
-
1.On the top left-hand side of the portal, select **+ Create a resource**. Then search for **Web App**. Select **Create** to begin configuring the first Web App.
83
+
1.To start creating the first Web App, select **+ Create a resource** button on the top left corner of the portal. Then, type *Web App* in the search box and select the **Create** to proceed with the configuration.
84
84
85
-
1. On the **Basics** tab of **Create Web App** page, enter, or select the following information.
85
+
1. On the **Create Web App** page, fill in the required information on the **Basics** tab.
86
86
87
87
:::image type="content" source="./media/create-front-door-portal/create-web-app.png" alt-text="Quick create Azure Front Door premium tier in the Azure portal.":::
88
88
@@ -98,9 +98,9 @@ Use the following steps to create two Web Apps used in this example.
98
98
|**Windows Plan**| Select **Create new** and enter *myAppServicePlanCentralUS* in the text box. |
99
99
|**Sku and size**| Select **Standard S1 100 total ACU, 1.75-GB memory**. |
100
100
101
-
1.Select **Review + create**, review the summary, and then select **Create**. Deployment of the Web App can take up to a minute.
101
+
1.To complete the creation of the Web App, select **Review + create** button and verify the summary of the settings. Then, select the **Create** button to start the deployment process, which may take up to a minute.
102
102
103
-
1.After you create the first Web App, create a second Web App. Use the same settings as above, except for the following settings:
103
+
1.To create a second Web App, follow the same steps as for the first Web App, but make the following changes in the settings:
104
104
105
105
| Setting | Description |
106
106
|--|--|
@@ -111,13 +111,13 @@ Use the following steps to create two Web Apps used in this example.
111
111
112
112
### Create a Front Door for your application
113
113
114
-
Configure Azure Front Door to direct user traffic based on lowest latency between the two Web Apps origins. You'll also secure your Azure Front Door with a Web Application Firewall (WAF) policy.
114
+
In this step, you set up Azure Front Door to route user traffic to the nearest Web App origin based on the latency. You apply a Web Application Firewall (WAF) policy to protect your Azure Front Door from malicious attacks.
115
115
116
116
1. Sign in to the [Azure portal](https://portal.azure.com).
117
-
118
-
1. From the home page or the Azure menu, select **+ Create a resource**. Search for *Front Door and CDN profiles*. Then select **Create**.
119
117
120
-
1. On the **Compare offerings** page, select **Custom create**. Then select **Continue to create a Front Door**.
118
+
1. Select **+ Create a resource** from the home page or the Azure menu, search for *Front Door and CDN profiles*, and select **Create**.
119
+
120
+
1. Select **Custom create** on the *Compare offerings* page and then **Continue** to create a Front Door.
121
121
122
122
1. On the **Basics** tab, enter or select the following information, and then select **Next: Secret**.
123
123
@@ -131,93 +131,91 @@ Configure Azure Front Door to direct user traffic based on lowest latency betwee
131
131
|**Name**| Enter a unique name in this subscription **Webapp-Contoso-AFD**|
132
132
|**Tier**| Select **Premium**. |
133
133
134
-
1.*Optional*: **Secrets**. If you plan to use managed certificates, this step is optional. If you have an existing Key Vault in Azure that you plan to use to Bring Your Own Certificate for a custom domain, then select **Add a certificate**. You can also add a certificate in the management experience after creation.
134
+
1.*Optional*: **Secrets**. You can skip this step if you plan to use managed certificates. If you have an existing Key Vault in Azure that contains a certificate for a custom domain, you can select **Add a certificate**. You can also add a certificate later in the management experience.
135
135
136
136
> [!NOTE]
137
-
> You need to have the right permission to add the certificate from Azure Key Vault as a user.
137
+
> To add a certificate from Azure Key Vault as a user, you must have the appropriate permission.
138
138
139
139
:::image type="content" source="./media/create-front-door-portal/front-door-custom-create-secret.png" alt-text="Screenshot of add a secret in custom create.":::
140
140
141
-
1. In the **Endpoint** tab, select **Add an endpoint** and give your endpoint a globally unique name. You can create more endpoints in your Azure Front Door profile after you complete the deployment. This example uses *contoso-frontend*. Select **Add** to add the endpoint.
141
+
1. In the *Endpoint* tab, select **Add an endpoint**, enter a globally unique name (this example uses contoso-frontend), and select **Add**. You can create more endpoints after the deployment.
142
142
143
143
:::image type="content" source="./media/create-front-door-portal/front-door-custom-create-add-endpoint.png" alt-text="Screenshot of add an endpoint.":::
144
144
145
-
1.Next, select **+ Add a route** to configure routing to your Web App origin.
145
+
1.To configure routing to your Web App origin, select **+ Add a route**.
146
146
147
147
:::image type="content" source="./media/create-front-door-portal/add-route.png" alt-text="Screenshot of add a route from the endpoint page." lightbox="./media/create-front-door-portal/add-route-expanded.png":::
148
148
149
-
1.On the **Add a route** page, enter, or select the following information, select **Add** to add the route to the endpoint configuration.
149
+
1.Enter or select the following information on the **Add a route** page and select **Add** to add the route to the endpoint configuration.
150
150
151
151
:::image type="content" source="./media/create-front-door-portal/add-route-page.png" alt-text="Screenshot of add a route configuration page." lightbox="./media/create-front-door-portal/add-route-page-expanded.png":::
152
152
153
153
| Setting | Description |
154
154
|--|--|
155
-
| Name |Enter a name to identify the mapping between domains and origin group. |
156
-
| Domains |A domain name has been auto-generated for you to use. If you want to add a custom domain, select **Add a new domain**. This example will use the default. |
157
-
| Patterns to match |Set all the URLs this route will accept. This example will use the default, and accept all URL paths. |
158
-
| Accepted protocols |Select the protocol the route will accept. This example will accept both HTTP and HTTPS requests. |
159
-
| Redirect |Enable this setting to redirect all HTTP traffic to the HTTPS endpoint. |
160
-
| Origin group |Select **Add a new origin group**. For the origin group name, enter **myOriginGroup**. Then select **+ Add an origin**. For the first origin, enter **WebApp1** for the *Name* and then for the *Origin Type* select **App services**. In the *Host name*, select **webapp-contoso-001.azurewebsites.net**. Select **Add** to add the origin to the origin group. Repeat the steps to add the second Web App as an origin. For the origin *Name*, enter **WebApp2**. The *Host name* is **webapp-contoso-002.azurewebsites.net**. Choose a priority, the lowest number has the highest priority, a priority of 1 if both origins are needed to be served by Azure Front Door. Choose a weight appropriately for traffic routing, equal weights of 1000 if the traffic needs to be routed to both origins equally. Once both Web App origins have been added, select **Add** to save the origin group configuration. |
161
-
| Origin path |Leave blank. |
162
-
| Forwarding protocol |Select the protocol that will be forwarded to the origin group. This example will match the incoming requests to origins. |
163
-
| Caching |Select the check box if you want to cache contents closer to your users globally using Azure Front Door's edge POPs and the Microsoft network. |
164
-
| Rules |Once you've deployed the Azure Front Door profile, you can configure Rules to apply to your route. |
155
+
| Name |Provide a name that identifies the mapping between domains and origin group. |
156
+
| Domains |The system has generated a domain name for you to use. To add a custom domain, select **Add a new domain**. This example uses the default domain name. |
157
+
| Patterns to match |Specify the URLs that this route accepts. This example uses the default setting, which accepts all URL paths. |
158
+
| Accepted protocols |Choose the protocol that the route accepts. This example accepts both HTTP and HTTPS requests. |
159
+
| Redirect |Turn on this setting to redirect all HTTP requests to the HTTPS endpoint. |
160
+
| Origin group |To create a new origin group, select **Add a new origin group** and enter *myOriginGroup* as the origin group name. Then select **+ Add an origin** and enter *WebApp1* for the **Name** and *App services*for the **Origin Type**. In the **Host name**, select *webapp-contoso-001.azurewebsites.net* and select **Add** to add the origin to the origin group. Repeat the steps to add the second Web App as an origin with *WebApp2* as the **Name** and *webapp-contoso-002.azurewebsites.net* as the **Host name**. Choose a **priority** for each origin, with the lowest number having the highest priority. If you need Azure Front Door to serve both origins, use a priority of 1. Choose a weight for each origin, with the weight determining how traffic is routed to the origins. Use equal weights of 1000 if the traffic needs to be routed to both origins equally. Once both Web App origins have been added, select **Add** to save the origin group configuration. |
161
+
| Origin path |Don't enter any value. |
162
+
| Forwarding protocol |Choose the protocol that the origin group receives. This example uses the same protocol as the incoming requests. |
163
+
| Caching |Mark the check box if you want to use Azure Front Door’s edge POPs and the Microsoft network to cache contents closer to your users globally. |
164
+
| Rules |After deploying the Azure Front Door profile, you can use Rules to customize your route. |
165
165
166
166
1. Select **+ Add a policy** to apply a Web Application Firewall (WAF) policy to one or more domains in the Azure Front Door profile.
167
167
168
168
:::image type="content" source="./media/create-front-door-portal/add-policy.png" alt-text="Screenshot of add a policy from endpoint page." lightbox="./media/create-front-door-portal/add-policy-expanded.png":::
169
169
170
-
1.On the **Add security policy** page, enter a name to identify this security policy. Then select domains you want to associate the policy with. For *WAF Policy*, you can select a previously created policy or select **Create New** to create a new policy. Select**Save** to add the security policy to the endpoint configuration.
170
+
1.To create a security policy, provide a name that uniquely identifies it. Next, choose the domains that you want to apply the policy to. You can also select an existing WAF policy or create a new one. To finish, select**Save** to add the security policy to the endpoint configuration.
171
171
172
172
:::image type="content" source="./media/create-front-door-portal/add-security-policy.png" alt-text="Screenshot of add security policy page.":::
173
173
174
-
1.Select **Review + Create**, and then**Create** to deploy the Azure Front Door profile. It will take a few minutes for configurations to be propagated to all edge locations.
174
+
1.To deploy the Azure Front Door profile, select **Review + Create** and then**Create**. The configurations propagate to all edge locations in a few minutes.
175
175
176
176
## Verify Azure Front Door
177
177
178
-
When you create the Azure Front Door profile, it takes a few minutes for the configuration to be deployed globally. Once completed, you can access the frontend host you created. In a browser, enter the endpoint hostname. For example `contoso-frontend.z01.azurefd.net`. Your request will automatically get routed to the nearest server from the specified servers in the origin group.
179
-
180
-
If you created these apps in this quickstart, you'll see an information page.
178
+
The global deployment of the Azure Front Door profile takes a few minutes to complete. After that, you can access the frontend host that you created by entering its endpoint hostname in a browser. For example, `contoso-frontend.z01.azurefd.net`. The request is automatically routed to the closest server among the specified servers in the origin group.
181
179
182
-
To test instant global failover, do the following steps:
180
+
To test the instant global failover feature, follow these steps if you created the apps in this quickstart. You see an information page with the app details.
183
181
184
-
1.Open a browser, as described above, and go to the frontend address:`contoso-frontend.z01.azurefd.net`.
182
+
1.To access the frontend host, enter its endpoint hostname in a browser as described previous. For example,`contoso-frontend.z01.azurefd.net`.
185
183
186
-
1. In the Azure portal, search and select *App services*. Scroll down to find one of your Web Apps, **WebApp-Contoso-001** in this example.
184
+
1. In the Azure portal, find and select *App services* from the search bar. Locate one of your Web Apps from the list, such as **WebApp-Contoso-001**.
187
185
188
-
1.Select your web app, and then select **Stop**, and **Yes** to verify.
186
+
1.To stop your web app, select it from the list and then select **Stop**. Confirm your action by selecting **Yes**.
189
187
190
-
1.Refresh your browser. You should see the same information page.
188
+
1.Reload the browser to see the information page again.
191
189
192
190
> [!TIP]
193
-
> There is a delay between when the traffic will be directed to the second Web app. You may need to refresh again.
191
+
> The traffic may take some time to switch to the second Web app. You may need to reload the browser again.
194
192
195
-
1.Go to the second Web app, and stop that one as well.
193
+
1.To stop the second Web app, select it from the list and then choose **Stop**. Confirm your action by selecting **Yes**.
196
194
197
-
1.Refresh your browser. This time, you should see an error message.
195
+
1.Reload the web page. You should encounter an error message after the refresh.
198
196
199
197
:::image type="content" source="./media/create-front-door-portal/web-app-stopped-message.png" alt-text="Both instances of the web app stopped":::
200
198
201
199
## Clean up resources
202
200
203
-
After you're done, you can remove all the items you created. Deleting a resource group also deletes its contents. If you don't intend to use this Azure Front Door, you should remove these resources to avoid unnecessary charges.
201
+
Once you have completed the task, you can delete all the resources you created. Removing a resource group also eliminate its contents. To avoid incurring unnecessary charges, we recommend that you delete these resources if you don't plan to use this Azure Front Door.
204
202
205
-
1. In the Azure portal, search for and select **Resource groups**, or select**Resource groups** from the Azure portal menu.
203
+
1. In the Azure portal, locate and select **Resource groups** by using the search bar, or navigate to**Resource groups** from the Azure portal menu.
206
204
207
-
1.Filter or scroll down to find a resource group, such as **myAFDResourceGroup**, **myAppResourceGroup** or **myAppResourceGroup2**.
205
+
1.Use the filter option or scroll down the list to locate a resource group, such as **myAFDResourceGroup**, **myAppResourceGroup** or **myAppResourceGroup2**.
208
206
209
-
1.Select the resource group, then select **Delete resource group**.
207
+
1.Choose the resource group, then select the option to **Delete** resource group.
210
208
211
209
> [!WARNING]
212
-
> Once a resource group has been deleted, there is no way to recover the resources.
210
+
> Deleting a resource group is an irreversible action. The resources within the resource group won't be recoverable once they are deleted.
213
211
214
-
1.Type the resource group name to verify, and then select **Delete**.
212
+
1.Enter the name of the resource group to confirm, and then select the **Delete** button.
215
213
216
-
1.Repeat the procedure for the other two resource groups.
214
+
1.Follow the same steps for the remaining two resource groups.
217
215
218
216
## Next steps
219
217
220
-
Advance to the next article to learn how to add a custom domain to your Front Door.
218
+
Proceed to the next article to learn how to configure a custom domain for your Azure Front Door.
221
219
222
220
> [!div class="nextstepaction"]
223
221
> [Add a custom domain](standard-premium/how-to-add-custom-domain.md)
0 commit comments