Set up HTTPS on localhost for macOS [mac os catalina 10.15.2]

Viewed 2865
cd ~/
mkdir .localhost-ssl

sudo openssl genrsa -out ~/.localhost-ssl/localhost.key 2048

sudo openssl req -new -x509 -key ~/.localhost-ssl/localhost.key -out ~/.localhost-ssl/localhost.crt -days 3650 -subj /CN=localhost

sudo security add-trusted-cert -d -r trustRoot -k /Library/Keychains/System.keychain ~/.localhost-ssl/localhost.crt

npm install -g http-server
echo " 
function https-server() {
  http-server --ssl --cert ~/.localhost-ssl/localhost.crt --key ~/.localhost-ssl/localhost.key
}
" >> ~/.bash_profile

source ~/.bash_profile

echo "You're ready to use https on localhost "
echo "Navigate to a project directory and run:"
echo ""
echo "https-server"

it's not working ...is there anything wrong with this code?

code source: https://gist.github.com/jonsamp/587b78b7698be7c7fd570164a586e6b7

1 Answers

After a few days of struggling I finally found a way to run localhost with https. I guess this solution will work on any macOS version.

from: https://letsencrypt.org/docs/certificates-for-localhost/

I found this minica tool which is a simple CA intended for use in situations where the CA operator also operates each host where a certificate will be used. It automatically generates both a key and a certificate when asked to produce a certificate. It does not offer OCSP or CRL services. Minica is appropriate, for instance, for generating certificates for RPC systems or microservices.

https://github.com/jsha/minica

Step 1

brew install minica

Step 2

minica --domains localhost

Generate a root key and cert in minica-key.pem, and minica.pem, then generate and sign an end-entity key and cert, storing them in ./localhost/

enter image description here

Step 3

add those cert and key files into your config server file. For example configure in: /etc/apache2/extra/httpd-ssl.conf

<VirtualHost _default_:443>
    DocumentRoot "/Volumes/WORK/www/webapp"
    ServerName localhost

    SSLEngine on
    SSLCertificateFile /Users/xxxx/selfsigned-certs/localhost/cert.pem
    SSLCertificateKeyFile /Users/xxxx/selfsigned-certs/localhost/key.pem

    <Directory "/Volumes/WORK/www/webapp">
        Options All
        MultiviewsMatch Any
        AllowOverride All
        Require all granted
        Order allow,deny
        Allow from all
    </Directory>
</VirtualHost>

Step 4

Restart server

Step 5

in Keychain Access ---> File ---> Import Items import "minica.pem" file

enter image description here

Step 6

in Chrome browser when accessing the https://localhost you will get a message with a not trusted certificate to make it a trusted you must go to:
chrome://settings/security --> "Manage certificates"
from there open the "minica..." certificate and set it as trusted

enter image description here

Step 7

reopen https://localhost ---> it will recognise certificate as valid and trusted one enter image description here

enter image description here


Happy coding!
Related