Now it’s time to get serious. After adding an App Registration in step 1, giving it access to the Web App resource group in step 2, and preparing the Storage Account in step 3, we are now ready to finish the process by installing and configuring the Let’s Encrypt extension.

Let us head over to the web app where we will install the SSL certificate. Choose the relevant app from the App Service plan menu as shown here:

Finding the app settings

Inside the app itself, click on the Custom domains menu:

The Custom domains menu

And proceed by clicking the + Add custom domain button. Fill in your domain name.

Adding a custom domain

In order to add the domain name, you first have to prove that you actually own the name. I will not go into the details of buying the domain name and forwarding it to Azure in this post, but here I show one way to claim the domain ownership by using a CNAME record:

Domain verification page

The green checkmarks indicate that the domain was verified successfully. At this point, we should also be able to notice that the newly added domain name is not secure.

This domain is not secure

It is time to fix this and conclude the tutorial! While still inside the web app, scroll down until you find the extensions menu and click it:

The App extensions menu

Then click on the + Add button:

Adding a new extension

Search for the Azure Let’s Encrypt extension by SKJP from the marketplace.

Selecting the Let's Encrypt extension

And accept the legal terms:

Read and accept the legal terms

After accepting the legal terms, the OK button is enabled and you can click it to start the installation process.

Click ok to install extension

You will get a notification of the installation status:

Extension installation in progress

Once ready you will be presented with the Let’s Encrypt configuration wizard. Here you need to fill in the information of the resources that we created earlier.

The Let's Encrypt configuration wizard

The information that you need to enter is obtained as follows:

  • Tenant id was shown on the last screenshot of part 1.
  • Subscription id is shown on the last screenshot of part 2.
  • Client id in the same last screenshot of part 1.
  • Client secret on the screenshot before it.
  • Resource group access was described during part 2. This is the same resource group that we configured there.
  • WebAppName we also saw during this post.
  • For both of the connection strings, refer to the last screenshot of part 3.
  • Finally, tick the checkbox for updating the application settings.
Double-check everything once over, and click the Next button to go to the next step.

Let's Encrypt settings are being applied

After some time, an information screen about the existing and available custom domains shows up.

Existing domains

Click next to go to the final step. Here you need to pick up the domain name that the certificate will be bound to. Enter an email address where you will receive future expiry warnings and click on the Request and install certificate button.

The certificate request step

After this, the extension will generate and install the SSL certificate for you.

Certificate was installed successfully

We should now be able to see this new certificate in the Certificates page inside theTLS/SSL settings menu.

Certificate list

Back in the custom domains page, refresh to see that the domain name associated with the new certificate is now secure.

Site is now secure

To confirm that the website is really secure, just hit it through the browser and click on the padlock icon. I’m using Chrome here so other browsers will display a different icon and have a slightly different behaviour.

Browser also shows that site is secure

Great! We have an encouraging message that the connection is secure. Clicking on the Certificate icon shown above will open the detailed certificate information window. Just like what the rest of our website visitors will see, here we can also read that the certificate was issued by Let’s Encrypt.

Certificate details

While we are still on the Azure portal one final thing. Since our HTTPS connection is now secured, we can switch on the option to force the secure connection. This is done again from the TLS/SSL settings page as shown here:

Switch to toggle HTTPS only mode

Now if anyone tries to access the site through the unsecured HTTP connection, they will be redirected to the secure site. We can observe and confirm this behaviour in the network headers.

Site should now redirect to HTTPS

So that concludes our journey to install a free SSL certificate to an Azure website through the Let’s Encrypt extension. Many thanks to SJKP for sharing this useful extension with the rest of us. If you have any further questions feel free to comment below.

After setting up the app registration and role assignment, now it is time to look into obtaining some storage.

The Let’s Encrypt application will run as a Web Job, and as a web job it needs a storage account to store the required information. So head over to the Storage accounts menu and click on the + Create button.

Storage Account Icon

The storage account can be set with the cheapest configuration since the job will just run in the background without affecting the performance of your web site visitors. It can be set to standard performance, locally redundant storage, and hot access tier.

Creating a new Azure storage account

Once filled in, click on the Review + create button, and the review screen will come up. Go ahead and click on the Create button.

Confirm all storage account settings are correct

Wait until the new storage account is deployed, then hop over to the Access keys section and make a note of the storage account connection string.

Storage account connection string

We will then use all of the connection settings that we have collected so far in the last step. Just be patient and keep them safe.

In the previous post, we have configured an app registration to give us the means to identify the Let’s Encrypt app during automatic jobs. Now we will give access to the app so that it can manage the resources inside the web application for us.

Go to the resource group that contains the web app where the SSL certificate will be installed. Click on the Access control (IAM) menu:

Resource group access control

On the right-hand side of the page, you should be able to see the role assignment widget. Click on the Add button inside it:

Add role assignment button

And in the role assignment window, add the Let’s Encrypt app registration as a contributor to the resource group as shown below. To find the correct app registration, use the search functionality inside the Select field. When searching for the app name, the search results will be shown below the Select field. Once clicked in the result, the app registration will then also be shown in the Selected members list.

Add role assignment window

Click the save button to finalise granting the rights to the application. Now technically, the Let’s Encrypt app has the necessary rights to modify our resources inside the selected group.

Finding the subscription id

Before we conclude this step, since we are already inside the Resource group page, take note of the subscription ID as indicated above. We will also need this later, together with the client secret and client ID which we had copied during the first step. Then in the next step, we will set up a storage account.

As reported in Microsoft’s Identity Platform Blog, the user experience for Azure App Registrations has changed, and the choice to use the legacy editor will not be available after March 1st. The end result is that some things in Azure Active Directory(AAD) have been moved around. So I decided that it’s time to do another series of blog posts to describe how to configure your Azure Web App with a free Let’s Encrypt certificate because AAD is an essential part of the process.

In this first post, I will go through the process of creating an App Registration inside Azure Active Directory. By the end of the series, we will have a Let’s Encrypt extension running beside our web app. Since the generated certificates will expire every three months, this extension will renew SSL certificates automatically for us.

We need a way to give the Let's Encrypt extension access to our Azure resource group so that it can manage the resources automatically for us. An Azure App Registration will enable us to create an authentication account that the extension will use to log into our Azure Active Directory.

So without further ado, let’s start our journey to make our site secure. From the Azure Portal dashboard, click on Azure Active Directory:

Azure Active Directory Icon

Then further down look for the App registrations menu, and click the + New registration button:

New app registration menu

This will open a new window to register the app. Here we need to provide any name which we will use to identify the application (I opted to name it Let's Encrypt). The supported account type should be ‘Accounts in this organizational directory only (Default Directory only - Single tenant)’ and the redirect URI filled in with the web app’s URL.

Register an application window

Click the Register button and wait for the app registration to be created.

Now we need to create the actual login. Once back to the app registrations page, click on Certificates & secrets, and then + New client secret:

Certificates and secrets menu

Give it a descriptive name and the desired expiry time.

Add a client secret window

After the secret store is created, its value will be displayed. Make sure to copy the value by hovering on the field and clicking on the copy icon as shown below. For security reasons, this value will be hidden when you try to view it in a future session (otherwise it wouldn't be a secret anymore). We will then use this secret once when configuring the Let’s Encrypt extension during the last step and dispose of the information immediately after.

Copy the client secret

Back inside the app registration window, we also need to make a note of the application id for later.

Copy the application id

In the second step, we will give the Let's Encrypt account that we just created access to our Azure resources.

In this tutorial, we will see how to create a YAML build pipeline from an existing pipeline built with the classic editor. Creating a YAML build pipeline from scratch may be intimidating for novice users, but if you have an existing one in the classic editor, switching over is easier. You don’t need to be a YAML guru.

Once logged in Azure DevOps, head over to your existing pipeline. This can be accessed from the build pipelines section as shown below.

Opening the original pipeline

In my case, I have a pipeline to build this website’s code. Click on the job name, then we will have the option to view it in YAML form.

View it as YAML

This will open a popup window showing the existing job in the YAML format. Click the ‘Copy to clipboard’ button. We will need to paste this code into a new file soon.

Copy YAML to clipboard

We now need to copy the code and store it inside a text file in our repository. This can be done directly from the Azure DevOps portal. From your repository, create a new branch and then a new file right afterwards. Put this new file in the Pipeline folder, so that it will not be stored directly beside your code.

Create new YAML file

Paste the copied YAML into the new file.

The YAML editor

Before you commit, it is important to check if you need to specify the image name of the build agent. When you run your build on an Azure-hosted agent, you need to add the vmImage parameter, as I did with windows-2019 below. If you have a private agent instead, just the name of the agent is enough.

Setting the YAML build agent

Now we can go back to the build pipelines page and click on the button to create a new pipeline.

Start build with Azure Repos Git

On the next step, click on the repository name.

Selecting the repository

And on the Configure step, we will select an ‘Existing Azure Pipelines YAML file’.

Connect pipeline to existing YAML file

Then choose the filename that we just saved a few steps back.

Selecting the YAML file

On the final review step, we can now add the required variables. The generated YAML file contains comments about the variables that the build expects so that it can run successfully.

Need to declare some variables

Click on the Variables button so that we can add them and then just add each one individually. We can look the existing classic pipeline if we need to verify the values of the variables.

Adding a variable for YAML pipeline

We can now click the Run button to test the pipeline.

The build is queued

Once the job finishes, we can check the outcome.

The build run outcome

So now we now that the build has run successfully, we can set it to be triggered automatically whenever any code is committed into the master branch. Go back to edit the YAML file and add the trigger as shown here.

Adding a master branch trigger to the YAML file

And there’s no better way to test it than creating a pull request on the YAML file so that it can be integrated into master and automatically trigger the build. Create a new pull request and choose to merge the new branch into master.

The change is ready to be added to a pull request

If this triggers the build, then we have confirmed that we have really managed to set up everything successfully.

The pull request has triggered the build

Buy me a coffee Buy me a coffee