So I'll start off by saying this took me longer setup the first time than I would like to admit, but there were a couple gotchas along the way so I figured I'd document them here at least for myself.

I will caveat this with I did discover another way in a blog post by Scott Hanselman: "Securing an Azure App Service Website under SSL in minutes with Let's Encrypt" that I will likely try in the future.  

What's Let's Encrypt

According to their about page "Let’s Encrypt is a free, automated, and open certificate authority (CA), run for the public’s benefit. It is a service provided by the Internet Security Research Group (ISRG). "

Basically it's a free service for generating SSL certificates to use on your websites. However, one of the main drawbacks is the certificates expire within 90 days, which is why automating this process in the future will be critical.

Generating the Certificates

If you wanted to you could install the Certbot ACME client yourself and run it if you have Shell Access, however, if you don't then I found using a 3rd party a nice route to go.

To do so I utilzed ZeroSSL's Free SSL Certificate Wizard. Once on that page you just do a few simple steps to get started:

  1. Enter your domain names, comma delimitied so for me you can see I did jshapland.com and www.jshapland.com.
  2. Check both Accept Boxes.
  3. Select HTTP verification.
  4. Click 'Next' to generate your CSR, download and save it in a safe location.
  5. Click 'Next' to generate your Key, download and save it in a safe location.

ssl_setup.bmp

  1. Click Next, now we need to verify domain ownership. This is where Azure App Service threw a minor curveball at me.

domain-verification

  1. Download both files and put them in your App Service site at the /wwwroot/.well-known/acme-challenge/ directory.
  2. The quirk for Azure App Services is you need to add a Web.Config file to this directory to tell the server how to handle extensionless files. Here is what is the web.config I put in that directory looks like to set the mime type for files with no extension:
<?xml version="1.0" encoding="UTF-8"?>
 <configuration>
     <system.webServer>
         <staticContent>
             <mimeMap fileExtension="" mimeType="text/json" />
         </staticContent>
     </system.webServer>
 </configuration>

files

  1. Once doing this you should be able to verify you can navigate to the files by clicking the file name link on the screen above. Then click next to verify.
  2. From here you should be able to save your key file and your crt file. I renamed mine to jshapland.com.crt and jshapland.com.key respectively.

Converting the Certificate and Key into .pfx format

Now that we have a key and certificate we need to generate a .PFX certificate to upload to our Azure App Service. You can generate the .PFX file relatively easily with a tool called OpenSSL which you can download here.

Once you've downloaded the tool, extract it somewhere and also copy your .crt and .key files to the same location as open SSL. Then open a command line in that directory.

OpenSSL.exe pkcs12 -export -in jshapland.com.crt -inkey jshapland.com.key -out jshapland.com.pfx -password pass:yourpassword

From there the rest is pretty easy! You can find a nice guide for how to configure an SSL certificate in Azure with a custom domain here.

Like I said at the start of the post, I'll likely look into how to automate this in the future, since Let's Encrypt certificates have a 3 month time to live. Good luck and hopefully this helps.