Quickstart: Create a Front Door for a highly available global web application

Important

Azure Front Door (classic) will be retired on March 31, 2027. To avoid any service disruption, it is important that you migrate your Azure Front Door (classic) profiles to Azure Front Door Standard or Premium tier by March 2027. For more information, see Azure Front Door (classic) retirement.

This quickstart shows you how to use the Azure portal to set up high availability for a web application with Azure Front Door. You create a Front Door configuration that distributes traffic across two instances of a web application running in different Azure regions. The configuration uses equal weighted and same priority backends, which means that Azure Front Door directs traffic to the closest available site that hosts the application. Azure Front Door also monitors the health of the web application and performs automatic failover to the next nearest site if the closest site is down.

Prerequisites

• An Azure account with an active subscription. Create an account for free.

Create two instances of a web app

To complete this quickstart, you need two instances of a web application running in different Azure regions. The web application instances operate in Active/Active mode, which means that they can both handle traffic simultaneously. This setup is different from Active/Stand-By mode, where one instance serves as a backup for the other.

To follow this quickstart, you need two web apps that run in different Azure regions. If you don't have them already, you can use these steps to create example web apps.

1. Sign in to the Azure portal.

2. On the top left corner of the screen, select + Create a resource and then search for Web App.

   

3. On the Basics tab of the Create Web App page, provide or select the following details.

   Setting	Value
   Subscription	Choose your subscription.
   Resource group	Select Create new and type FrontDoorQS_rg1 in the text box.
   Name	Type a unique Name for your web app. For example, WebAppContoso-1.
   Publish	Select Code.
   Runtime stack	Select .NET Core 3.1 (LTS).
   Operating System	Select Windows.
   Region	Select Central US.
   Windows Plan	Select Create new and type myAppServicePlanCentralUS in the text box.
   Sku and size	Select Standard S1 100 total ACU, 1.75 GB memory.

4. Select Review + create and verify the summary details. Then, select Create to initiate the deployment process. The deployment may take several minutes to complete.

   

Once you have successfully deployed your first web app, proceed to create another one. Follow the same steps and enter the same values as before, except for the ones listed:

Setting	Value
Resource group	Select Create new and type FrontDoorQS_rg2
Name	Type a unique name for your Web App, for example, WebAppContoso-2
Region	Select a different region than the first Web App, for example, East US
App Service plan > Windows Plan	Select New and type myAppServicePlanEastUS, and then select OK

Create a Front Door for your application

Set up Azure Front Door to route user traffic based on the lowest latency between the two web app servers. Start by adding a frontend host for Azure Front Door.

1. From the home page or the Azure menu, select + Create a resource. Select Networking > Front Door and CDN profiles.

2. On the Compare offerings page, select Explore other offerings. Then select Azure Front Door (classic). Then select Continue.

3. In the Basics tab of Create a Front Door page, provide or select the following information, and then select Next: Configuration.

   Setting	Value
   Subscription	Select your subscription.
   Resource group	Select Create new and type FrontDoorQS_rg0 in the text box.
   Resource group location	Select Central US.

4. In Frontends/domains, select + to open Add a frontend host page.

5. For Host name, type a globally unique hostname. For example, contoso-frontend. Select Add.

   

Next, set up a backend pool that includes your two web apps.

1. Still in Create a Front Door, in Backend pools, select + to open the Add a backend pool page.

2. For Name, type myBackendPool, then select Add a backend.

   

3. Provide or select the following information in the Add a backend pane and select Add.

   Setting	Value
   Backend host type	Select App service.
   Subscription	Select your subscription.
   Backend host name	Select the first web app you created. For example, WebAppContoso-1.

   Keep all other fields default.

   

4. “Select Add a backend again. Provide or select the following information and select Add.

   Setting	Value
   Backend host type	Select App service.
   Subscription	Select your subscription.
   Backend host name	Select the second web app you created. For example, WebAppContoso-2.

   Keep all other fields default.

5. Select Add on the Add a backend pool page to finish the configuration of the backend pool.

   

Lastly, create a routing rule. A routing rule links your frontend host to the backend pool. The rule routes a request for contoso-frontend.azurefd.net to myBackendPool.

1. Still in Create a Front Door, in Routing rules, select + to set up a routing rule.

2. In Add a rule, for Name, type LocationRule. Keep all the default values, then select Add to create the routing rule.”

   

   Warning

   It's essential that you associate each of the frontend hosts in your Azure Front Door with a routing rule that has a default path /*. This means that you need to have at least one routing rule for each of your frontend hosts at the default path /* among all of your routing rules. Otherwise, your end-user traffic may not be routed properly.

3. Select Review + create and verify the details. Then, select Create to start the deployment.

   

View Azure Front Door in action

Once you create a Front Door, it takes a few minutes for the configuration to be deployed globally; once completed, access the frontend host you created. In the browser, go to your frontend host address. Your requests automatically get routed to your nearest server from the specified servers in the backend pool.

If you followed this quickstart to create these apps, you see an information page.

To test the instant global failover feature, try the following steps:

1. Navigate to the resource group FrontDoorQS_rg0 and select the Front Door service.”

   

2. From the Overview page, copy the Frontend host address.

   

3. Open the browser, as described previously, and go to your frontend address.

4. In the Azure portal, search for and select App services. Scroll down to find one of your web apps, for example, WebAppContoso-1.

5. Select your web app, and then select Stop, and Yes to confirm.

6. Refresh your browser. You should see the same information page.

   Tip

   These actions may take some time to take effect. You may need to refresh the browser again.”

7. Locate the other web app, and stop it as well.

8. Refresh your browser. This time, you should see an error message.

   

Clean up resources

After you're done, you can delete all the items you created. Deleting the resource group also deletes its contents. If you don't intend to use this Front Door, you should delete the resources to avoid incurring unnecessary charges.

1. In the Azure portal, search for and select Resource groups, or choose Resource groups from the Azure portal menu.

2. Filter or scroll down to find a resource group, for example, FrontDoorQS_rg0.

3. Choose the resource group, then select Delete resource group.

   Warning

   This action can't be undone.

4. Enter the name of the resource group that you want to delete, and then select Delete.

5. Repeat these steps for the remaining two groups.

Next steps

Proceed to the next article to learn how to configure a custom domain for your Front Door.

Add a custom domain