How to setup https when developing localy with webpack and hosting on Azure in Docker container running ASP.NET Core

Question

I am hosting on Azure and have it configured to only allow https. The backend is running ASP .NET Core in a Linux container. The webserver (Kestrel) is running without https enabled. I've configured Azure TLS/SSL settings to force https, so when users connect from the public internet, they have to use https. I have a cert that is signed by a cert authority and it's configured in the Azure App Service -> TLS/SSL -> Bindings settings.

However in my local development environment I've been running webpack using http. So when I test I connect to localhost:8080 and this is redirected to localhost:8085 by webpack. localhost:8085 is the port Kestrel is listening on. I've decided I want to develop locally using https so that my environment mimics the production environment closely. To this I've started the webpack-dev-server with the --https command line option, and ammended my redirects in my webpack.config.js

For example:

'/api/*': {
            target: 'https://localhost:' + (process.env.SERVER_PROXY_PORT || "8085"),
               changeOrigin: true,
               secure: false
           },

This redirects https requests to port 8085.

I've created a self-signed cert for use by Kestrel when developing locally. I modified my code to use this certificate as shown below:

let configure_host (settings_file : string) (builder : IWebHostBuilder) =
    //turns out if you pass an anonymous function to a function that expects an Action<...> or
    //Func<...> the type inference will work out the inner types....so you don't need to specify them.
    builder.ConfigureAppConfiguration((fun ctx config_builder ->
                config_builder
                    .SetBasePath(Directory.GetCurrentDirectory())
                    .AddEnvironmentVariables()
                    .AddJsonFile(settings_file, false, true)
                    .Build() |> ignore))
           .ConfigureKestrel(fun ctx opt ->
                eprintfn "JWTIssuer = %A" ctx.Configuration.["JWTIssuer"]
                eprintfn "CertificateFilename = %A" ctx.Configuration.["CertificateFilename"]
                let certificate_file = (ctx.Configuration.["CertificateFilename"])
                let certificate_password = (ctx.Configuration.["CertificatePassword"])
                let certificate = new X509Certificate2(certificate_file, certificate_password)
                opt.AddServerHeader <- false
                opt.Listen(IPAddress.Loopback, 8085, (fun opt -> opt.UseHttps(certificate) |> ignore)))
           .UseUrls("https://localhost:8085") |> ignore
    builder

This all works, and I can connect to webpack locally and it redirects the request to the webserver using https. The browser complains that the cert is insecure because it's self-signed but that was expected.

My question is how should this be setup in the production environment. I don't want to be running the container on azure with the certificates I created locally embeded in the image. In my production environment should I be configuring Kestrel, as I have done with the localhost code, to use the cert in loaded into Azure (as mentioned in the 1st paragraph)? Or is simply binding it to the domain using the portal and forcing https via the Web UI enough?

Answer 1

On Azure, If you have the PFX certificate you can choose to upload the certificate: see this image

However, this certificate needs to come from a trusted certificate authority.

If the URL is a subdomain, you can choose a Free App Service Managed Certificate.

After, that all you need to do is enable https only in the portal.

If its a naked domain and you really need the certificate to be free, you can get a certificate from sslforfree.com. sslforfree will give you the.cer file and the private key you will need to generate a pfx.