Apart from securing your web apps there is another reason why you would use applicatoin gateway (WAF tier) in an ILB ASE. You can expose your web app to the internet. 

This is direct followup from the previous article about creating the ILB ASE itself - https://www.azuretechguy.com/ilb-ase-new

To integrate our ILB ASE with an WAF tier App Gateway we will be following this guide loosely because it is kind of old and screenshots are no longer relevant (as of now) but it gives good insight on how to achieve this

Table of Contents:

Requirements

  • ILB ASE with at least 1 App Service plan and 1 Web App
  • Public Internet domain and access to its DNS

Creating the Application Gateway (WAFv2)

First let's create an empty subnet, requirement to deploy the Application Gateway. We create the submet in the same VNET as the ILB ASE.

App Gateway Creation

Let's start deploying the App GW- https://ms.portal.azure.com/#create/Microsoft.ApplicationGateway-ARM

The first tab will be the Project details

Give the gateway a name

Region: Same as ILB ASE

Tier: WAF V2

Enable autoscaling: No

Instances: 2 (cannot go less than 2)

Virtual Network: Same as ILB ASE

Subnet: the newly created subnet

App Gateway Creation

Let's move to Frontends. Front end is just creating a Public IP address for the gateway

App Gateway Frontends

Let's move to Backends

We need to create a Backend pool. This is where the application gateway will route requests too. In our case this is the ILB IP Address. In particular for this tutorial - 192.168.11.11

Click on Add a backend pool

Give it a name and specify the ILB IP Address

App Gateway Backend pool

Let's move to Configuration

So we have a frontend and a backend pool. We need to add a rule now.

Click the big Add a rule button in the middle

App Gateway Add rule

Now we need to give the rule a name

In the first tab we need to configure a Listener

Give it a name

Frontend IP: Public

Protocol: HTTP

Port: 80

Listener type: Basic

Error page url: No

App Gateway Listener rule

Switch to the Backend targets tab

Backend target: the backend pool we created

HTTP Setting:  Create New

Give it a name and leave the rest default

Click Add at the bottom

App Gateway Add rule completed

So now you have both Listener and Backend target tabs fully set. That completes the whole Rule creation. Click Add again

Next: Tags > skip it. Next: Review + Create >

So your WAF is now ready to be deployed. The Overall review and create window should look like this

App Gateway Review & Create

Click Create and the WAF will start deploying. It should take around 30-40 minutes.

Configuring the WAFv2

With the new style of deployment for the Application gateway, we did a lot of the configuration during the creation of the waf. However, there are still few things to do left

We are now on step 6 of the official guide

We need to create a probe. In your gateway, go to Health probes blade and click Add.

Give it a name

Protocol: HTTP

Host: your web app's full URL i.e  webapp.asename.appserviceenvironment.com

Path: /

rest is default

Click Add in the end

Adding a Gateway Probe 

Next, we need to go and assign the probe to the http settings we created during the intial setup.

Go to HTTP Settings and browse the existing HTTP setting

Tick the "Use custom probe" and select the probe we created in the last step. Save

App Gateway Probe settings

Go to Backend Health and check if the Health of the probe is in status "Healthy"

Probe Backend Health

It should be! If not, re-check your configurations.

Now that we know our app gateway is successfully reaching the web app, we need to point a public DNS of a domain to the Application Gateway's public IP

Go to your internet domain of choice - i will be using hybridcenter.net which i happen to manage in Azure. 

First go and note the IP address of the Application gateway from the Overview blade

App Gateway public IP

Go to your internet domain of choice DNS and point the @(naked) A record to this IP. If you are pointing a subdomain in your example, you could point it to the App Gateway's public domain name through a CNAME.

Point A Record to your App Gateway IP

The last thing we want to do is to also make sure to include this domain as a Custom Domain inside the Web App

Go back to your ILB ASE Web app, go to Custom Domains and Add the domain. No vertification needed as it is an ILB ASE.

Try and browse it. Did it work? If yes, congratulations. You've made it work

Successful

Configuring HTTPS

Making it work with HTTP is rather easy. If you want to also pass HTTPS traffic, we have some additional steps

First, make sure that you have a PFX copy of the certificate you used in your Internet domain that you poined to the App gateway

Next, we will be creating a HTTPS listener to listen on port 443

Go to your Application Gateway -> Listeners and create a new Basic Listener

Give it a name. Something like https_listener

You will have to create a new Frontend port

Give it a name. For example: SSL-Port

Port: 443

Protocol: HTTPS

Upload the PFX and give it a name and use the password for that PFX

Click OK to create the listener

HTTPS Listener

Now, we need to create a rule and associate it with the https listener. Go to Rules and create a Basic rule

Give it a name

Point it to the https listener

Backend pool remains the same

HTTP setting remains the same

New Rule for the https listener

Add the rule.

Browse the domain with https://

Did it work? If yes, we are done with this tutorial. If not re-check your steps

Successful with https