How to get SSL working with MAMP.

What the heck Google!

Categories: Development

Local SSL has always been something that I ignored. So I never gave it the time of day. That is until Google did the unthinkable. They bought the .dev TLD. And not only did they buy it, they also added it to Chrome and Firefoxes forced HTTPS preload list.

I don’t know if they did this as a way to supercharge the adoption of HTTPS, or if they were just being jerks.

Luckily this can be fixed with a bit of research and some command line typing.

Let’s make a certificate for my local site adam.wp

Asuming that you don’t already have your local domain created, Head over and open up ‘/etc/hosts’ in your editor. This will need to be opened as admin, or you will need to use an editor that will prompt for a password once you save changes to the file.

To the hosts file on a new line add.

127.0.0.1   adam.wp

Save the file, this changes is immidiare. No need to restart your MAMP server.

First generate a Certificate Authority

Generate the Key

openssl genrsa -des3 -out local-certificate-authority.key 2048

You will be prompted for a passphrase, which you should add. But is not required.

Generate the Certificate

openssl req -x509 -new -nodes -key local-certificate-authority.key -sha256 -days 1825 -out local-certificate-authority.pem

Install the certificate authority

Make a CA-Signed certificate

openssl genrsa -out adam.wp.key 2048

openssl req -new -key adam.wp.key -out adam.wp.csr

Next, make a file called adam.wp.ext where we will need to add our DNS entries. Pay attention to DNS.1 = adam.wp if you wish to also include www. then add DNS.2 = www.adam.wp to the file on a new line.

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

[alt_names]
DNS.1 = adam.wp

Roll it all together

openssl x509 -req -in adam.wp.csr -CA local-certificate-authority.pem -CAkey local-certificate-authority.key -CAcreateserial \
-out adam.wp.crt -days 1825 -sha256 -extfile adam.wp.ext

Cool, Now what?

Now that we have all of these files, you can add them to Apples Keychain.

Open the Keychain Access tool and drag the .pem file into the window. Remember we created local-certificate-authority.pem

Right Click on the certificate and click get info or double-click it and under the Trust section. When using this certificate, Choose to Always trust it.

Enter your password to save the change.

By doing this, Any certificate we add from this point on that has been generated using our CA will automatically be trusted.

Without doing this step. You would need to add and trust every unique certificate, and that’s not too much fun!

Setup Apache

Located MAMPS httpd.conf and make sure that “# Secure (SSL/TLS) connections” is uncommented and we are including httpd-ssl.conf. Next open httpd-ssl.conf and remove the default, secure virtual host. If you don’t, you will probably have issues with MAMP starting as it won’t be able to find the example files.

Next, somewhere just after your httpd-vhosts.conf file create a new one called httpd-vhosts-secure.conf. Adjust the following config to match your site location and certificate names.

If everything worked according to plan. You should now see https://adam.wp Or whatever site you created while following along.

NameVirtualHost *:443

<VirtualHost *:443>
    ServerName adam.wp

    DocumentRoot "/Users/adampatterson/Sites/personal/adam-wp"

    <IfModule xsendfile_module>
        XSendFilePath "/Users/adampatterson/Sites/personal/adam-wp"
    </IfModule>

    SSLEngine on

    SSLCipherSuite ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP:+eNULL

    ErrorLog "/Applications/MAMP/logs/apache_ssl_error.log"
    TransferLog "/Applications/MAMP/logs/apache_ssl_access.log"
    CustomLog "/Applications/MAMP/logs/apache_ssl_request.log" "%t %h %{SSL_PROTOCOL}x %{SSL_CIPHER}x \"%r\" %b"

    SSLCertificateFile "/Users/adampatterson/Sites/ssl/adam.wp.crt"
    SSLCertificateKeyFile "/Users/adampatterson/Sites/ssl/adam.wp.key"

    SSLSessionTickets on

    <FilesMatch "\.(cgi|shtml|phtml|php)$">
        SSLOptions +StdEnvVars
    </FilesMatch>

    <Directory "/Applications/MAMP/Library/cgi-bin">
        SSLOptions +StdEnvVars
    </Directory>

    BrowserMatch ".*MSIE.*" \
         nokeepalive ssl-unclean-shutdown \
         downgrade-1.0 force-response-1.0

    <Directory "/Users/adampatterson/Sites/personal/adam-wp">
        Options Includes FollowSymLinks ExecCGI
        AllowOverride All
        Order allow,deny
        Allow from all

    </Directory>

</VirtualHost>

MAMP PRO does support SSL, well it lets you add new sites with SSL. It will not create the certificates for you but it will create the necessary Apache configs for you.

You can read more about that here.

Adam Patterson

Adam Patterson

User Interface Designer & Developer with a background in UX. I have spent 5 years as a professionally certified bicycle mechanic and ride year-round.

I am a husband and father of two, I enjoy photography, music, movies, coffee, and good food.

You can find me on Twitter, Instagram, and YouTube!