37
votes

I am trying to setup a development environment on my local PC. As the production website supports HTTPS (who does not these days?), I want to have this also on the localhost. I thought it would be easy, but no.

I have a XAMP installation, and setup all so I can access the website. However, whenever I go to any page on the site locally, I get the chrome warning:

NET::ERR_CERT_AUTHORITY_INVALID

I did follow the following thread to try and solve it:

Getting Chrome to accept self-signed localhost certificate

I also created the certificate with the correct Subject Alternative Name (SAN) section, based on this:

https://deliciousbrains.com/https-locally-without-browser-privacy-errors/

After that, I generated the CER or P7B file and imported that into Chrome. I restarted both Apache and Chrome.

I put the certificate in the Trusted Root Certificate Authorities. Somehow, Chrome decided however to place it in the Intermediate Root Certificate Authorities...

I am using Chrome 61, I had the same in 60.

So somehow I am unable to install a self signed certificate, and keep getting this warning which basically makes development on localhost impossible...

I understand that this self-signing is not exactly trustworthy, but there must be a way to develop offline? It does not make sense that we have to build websites online from now on?...

Any ideas?

6

6 Answers

21
votes

We can simply allow invalid certificates for developing purposes in chrome.

This is only valid for Localhost

Paste this in your chrome address bar:

chrome://flags/#allow-insecure-localhost

Then enable the highlighted text: Allow invalid certificates for resources loaded from localhost

enter image description here

7
votes

Here are my instructions using the KeyStore Explorer tool.

The 2 things I was previously missing when I created the cert were:

  • AKID (Authority Key Identifier) - select the same "CN=" you used when creating it.
  • Adding in the "Basic Constraints" option (do not select "is a CA")

Without those 2 things Chrome will issue warnings / errors even when you have installed the self-signed certificate into your MS-CAPI PKI Trust store (as a "Trusted Root Authority).

Here are the steps I used.

  1. Instructions using KSE (KeyStore Explorer)
  2. Create a JKS
  3. Creating a self-signed certificate
  4. Open KeyStore Explorer
  5. File | New | JKS | OK
  6. Create a Password for your JKS file
  7. File | Save as... | enter your password
  8. Enter file name | OK
  9. Tools | Generate Key Pair
  10. Select Algorithm and Key Size (i.e. 2048) | OK
  11. Select validity period (i.e. 5 years)
  12. Select Name (Book icon) | Enter in Name fields | OK
  13. I.e. “CN=localhost…”
  14. Add Extensions (Very Important), this determines what type of certificate it will be and how it can be used. This example will be for a standard server certificate with SSL.
  15. Add in the Key Usage item
  16. Add in the Digital Signature and Key Encipherment options checkbox
  17. Add in the EKU (Extended Key Usage) options
  18. Select both of these options:
  19. TLS Web Client Authentication
  20. TLS Web Server Authentication
  21. Add in the SANs (Subject Alternative Name)
  22. Add in all the needed DNS names and IP Addresses (if applicable) for which this server will be used. (repeat for all desired values) (e.g. 127.0.0.1 and localhost (or )
  23. It will look something like this when it's done
  24. When it's done you will see all the fields with the OIDs (Object Identifiers) listed | OK | OK
  25. Add in the AKID (Authority Key Identifier)
  26. Add Extensions "+"
  27. Add Extension Type | Authority Key Identifier
  28. Select the Authority Cert Issuer of the CN that you created above (.e.g "CN=localhost...") | OK
  29. Add in a "Basic Constraints" (do NOT check "Subject is a CA")
  30. When you're done you'll see these listed: hit "OK"
  31. Note: the Basic Constraints and AKID (Authority Key Identifer) are needed for the Chrome Browser to validate the self-signed certificate as a trusted certificate.
  32. Otherwise you'll see warning or error messages even after you have add this certificate, explicitly, to your MS-CAPI Trusted Root certificates.
  33. Enter in the Alias of the keypair name you want to use
  34. Enter in the private keypair password
  35. *Note: this password MUST be the same as the JKS file keystore password or Java may fail silently when trying to use this certificate.
  36. You should see a message indicating success. | OK
  37. Then, save the File | Save
5
votes

I fixed my exactly same issue following this .

Issue seemed to be in the way the certificate was created.

The code below is from the above site.

#!/usr/bin/env bash
mkdir ~/ssl/
openssl genrsa -des3 -out ~/ssl/rootCA.key 2048
openssl req -x509 -new -nodes -key ~/ssl/rootCA.key -sha256 -days 1024 -out ~/ssl/rootCA.pem


#!/usr/bin/env bash
sudo openssl req -new -sha256 -nodes -out server.csr -newkey rsa:2048 -keyout server.key -config <( cat server.csr.cnf )

sudo openssl x509 -req -in server.csr -CA ~/ssl/rootCA.pem -CAkey ~/ssl/rootCA.key -CAcreateserial -out server.crt -days 500 -sha256 -extfile v3.ext

server.csr.cnf file

[req]
default_bits = 2048
prompt = no
default_md = sha256
distinguished_name = dn

[dn]
C=US
ST=New York
L=Rochester
O=End Point
OU=Testing Domain
emailAddress=your-administrative-address@your-awesome-existing-domain.com
CN = localhost

v3.ext file

authorityKeyIdentifier=keyid,issuer
basicConstraints=CA:FALSE
keyUsage = digitalSignature, nonRepudiation, keyEncipherment, dataEncipherment
subjectAltName = @alt_names

[alt_names]
DNS.1 = localhost
2
votes

There is a great GUI java-based utility that I use for creating and manipulating all things PKI called KeyStore Explorer. So much easier than all of the command-line options:

http://keystore-explorer.org/

0
votes

I found this by pure chance: if you have Fiddler installed and let it run in the background, the first time your app runs will open a popup with the certificate issue and if you click 'yes' it will allow your requests through. See this https://www.telerik.com/forums/fiddler-certificate-error-bypass-question.

0
votes
  1. Open your chrome browser

  2. Put the below link in the browser address bar and press Enter.

    chrome://flags/#allow-insecure-localhost

  3. Select "Allow invalid certificates for resources loaded from localhost." Disabled to Enabled.

Hope your problem will fix. Thanks