Forcing .dev domains to HTTPS via HSTS

In one of our projects we had the need to access a web application via a .dev domain. The application was shipped with a self-signed SSL certificate, usually not a big deal. But not this time. Chrome and Firefox both complained that the application was using a self-signed certificate, an error I have seen many times. But this time things were a bit different, neither Chrome nor Firefox offered the possibility to whitelist the server certificate because the website was using HSTS. I checked the webserver configuration for the HSTS configuration but could not find anything. It took me quite a while to remember having read about a change in Chrome which added the HSTS configuration for the .dev gTLD by default. Also Firefox made a similar change recently which I learned about while looking on how to solve the issue.

Solving the issue (for Chrome) is rather simple. You need to slightly change the way you generate your self-signed SSL certificate by supplying configuration file, the file is called myapp.dev.conf in our case:

[ req ]
default_bits        = 2048
default_keyfile     = server-key.pem
distinguished_name  = subject
req_extensions      = req_ext
x509_extensions     = x509_ext
string_mask         = utf8only

[ subject ]
countryName                 = Country Name (2 letter code)
countryName_default         = US
stateOrProvinceName         = State or Province Name (full name)
stateOrProvinceName_default = Somewhere
localityName                = Locality Name (eg, city)
localityName_default        = Secret Location
organizationName            = Organization Name (eg, company)
organizationName_default    = ACME Inc.
commonName                  = Common Name (e.g. server FQDN or YOUR name)
commonName_default          = myapp.dev
emailAddress                = Email Address
emailAddress_default        = em@il.com

[ x509_ext ]
subjectKeyIdentifier   = hash
authorityKeyIdentifier = keyid,issuer
basicConstraints       = CA:FALSE
keyUsage               = digitalSignature, keyEncipherment
subjectAltName         = @alternate_names
nsComment              = "OpenSSL Generated Certificate"

[ req_ext ]
subjectKeyIdentifier = hash
basicConstraints     = CA:FALSE
keyUsage             = digitalSignature, keyEncipherment
subjectAltName       = @alternate_names
nsComment            = "OpenSSL Generated Certificate"

[ alternate_names ]
DNS.1       = myapp.dev

The important part in this case is to add the alternate_names section and define the domain name there again. Now use the configuration to generate your SSL certificate like this:

openssl req -config myapp.dev.conf -new -sha256 -newkey rsa:2048 -nodes 
   -keyout myapp.dev.key -x509 -days 365 -out myapp.dev.crt

Since you are not able to add the certificate directly in Chrome to its certificate database, you need to do this via the cli tool certutil. In case you are using Ubuntu, it is an apt install away:

sudo apt install libnss3-tools

To import the self-signed certificate use the following command:

certutil -d sql:$HOME/.pki/nssdb -A -t "CP,CP," -n MyApp -i myapp.dev.crt

For Firefox you can use the following command:

certutil -d sql:$HOME/.mozilla/firefox// -A -t "CT,C,C" -n MyApp 
   -i myapp.dev.crt

However, in Firefox this won't work for now, the certificate gets imported fine, but Firefox somehow seems to ignore it. The only working solution for now seems to be to downgrade your Firefox version, accept the certificate and upgrade Firefox again. Hopefully this "bug" gets fixed soon.

Other than that, just stop using .dev domains ;)