When I visited a site that uses a self-signed SSL certificate for development environment with Chrome, "Your connection is not private. NET::ERR_CERT_COMMON_NAME_INVALID" error occurred.

Although I use a self-signed certificate, I installed it for the clients and trusted it. (Keychain Access on Mac and Certificate Manager on Windows.)
The CN(Common Name) also matches the host name being accessed.

There is no problem with browsers other than Chrome.
Even Chrome could access without problems, but suddenly it got an error.

There is "[missing_subjectAltName]" in the error, so I thought the certificate without subjectAltName caused the error.

Cause

For Chrome 58 and later, only the subjectAlternativeName extension, not commonName, is used to match the domain name and site certificate.

https://support.google.com/chrome/a/answer/7391219?hl=en

Workaround

Create self-signed certificate with subjectAltName extension

Copy openssl.cnf and set subjectAltName, use it on creating certificate.

1. Copy openssl.cnf（Below is example on Red Hat family. Change the path to openssl.cnf for other platforms.）

   $ cp /etc/pki/tls/openssl.cnf my-server.example.com.cnf
   

2. x509_extensions in [ req ] section is v3_ca. So it seems I should add subjectAltName in [ v3_ca ] section.

   $ vi my-server.example.com.cnf
   

   [ req ]
   ...
   x509_extensions = v3_ca # The extentions to add to the self signed cert
   ...
   

   Add subjectAltName in [ v3_ca ] section.

   [ v3_ca ]
   ...
   subjectAltName=DNS.1:my-server.example.com
   ...
   

   You can also set multiple subjectAltNames.

   subjectAltName=DNS.1:my-server.example.com,DNS.2:my-server2.example.com
   

   See `man 5 x509v3_config` for detail.

3. Create private key

   $ openssl genrsa -out my-server.example.com.key 2048
   

4. Create certificate（Specify your cnf file for the -config option）

   $ openssl req -new -x509 -days 36500 -sha256 -config my-server.example.com.cnf -key my-server.example.com.key -out my-server.example.com.crt