Setting up https on Localhost Apache (Xampp)

Https on localhost can have a number of benefits. One is getting around Chrome’s limitation on cross-domain cookies on non-https sites if your sites need to talk to one another (e.g. if you’re developing APIs).

The goal here will be to generate a .crt file and a .key file – the two files that apache needs. We won’t be using the PowerShell way of generating .pfx files (which bundles the .crt and .key files together in a password protected bundle, which isn’t very useful in this context).

We’ll generate the .crt file and a .key file using an installation of Ubuntu, and this allows us to use common bash facilities (very handy for Apache/PHP development on Windows).

Given that in previous notes, we have setup sites in the URL format of mysite1.local.site and mysite2.local.site, and we are going to create a certificate that covers all of these sites, using a wildcard (e.g. *.local.site). This is only practical for local development environments. This will reduce the need to create more certificates for future sites added to our local environment. We’ll also set the expiry time to 10 years for practicality.

Note: setting a URL pattern of “*.local.site” vs something like “*.local” will yield better reliability in the cert setup, as “*.local” may not be considered a valid domain.

Steps

This example uses OpenSSL to create a wildcard certificate for *.local.site domains, extending the validity period to 10 years.

Step 1: Generate a Private Key

bash:

openssl genpkey -algorithm RSA -out local.key -pkeyopt rsa_keygen_bits:2048

This will save the generated private key to a file named local.key in the directory from which you run the command. If you want to specify a different location for the key file, you can provide a full path in the -out parameter.

Step 2: Create a Configuration File for the Certificate

Create a file named san.cnf with the following content, adjusting the [dn] section as needed for your locality, organization, etc.:

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

[dn]
C = US
ST = YourState
L = YourCity
O = YourOrganization
CN = *.local.site

[req_ext]
subjectAltName = @alt_names

[alt_names]

DNS.1 = local.site
DNS.2 = *.local.site

Step 3: Generate the Certificate Signing Request (CSR) Using the Configuration File

bash:

openssl req -new -key local.key -out local.csr -config san.cnf

Step 4: Generate the Self-Signed Certificate Valid for 10 Years

bash:

openssl x509 -req -days 3650 -in local.csr -signkey local.key -out local.crt -extensions req_ext -extfile san.cnf

Now, you have local.key as your private key and local.crt as your certificate valid for 10 years, suitable for local development environments.

Integrating the Certificate with Your Local Apache Server

  1. Copy the Certificate and Key: Move local.crt and local.key to your Apache server’s directory for certificates. If you’re using XAMPP on Windows, this might be within C:\xampp\apache\conf\ssl.crt for certificates and C:\xampp\apache\conf\ssl.key for private keys, but you can adjust the paths as needed.
  2. Configure Apache: Open your SSL configuration file (httpd-ssl.conf) located, for example, at C:\xampp\apache\conf\extra\httpd-ssl.conf. Update the SSLCertificateFile and SSLCertificateKeyFile directives to point to your new certificate and key:apacheconf
  1. SSLCertificateFile "conf/ssl.crt/local.crt" SSLCertificateKeyFile "conf/ssl.key/local.key"
  2. Restart Apache: Use the XAMPP Control Panel to stop and then start the Apache module to apply the changes.

Update httpd-vhosts.conf to 443

Open C:\xampp\apache\conf\extra then open the httpd-vhosts.conf file with Notepad or another general editor. Ensure that the sites are no longer setup to use port 80, but instead 443. ALso add some additional settings for each site.

# Virtual Hosts
# add this to the bottom of the file

<VirtualHost *:443>
 ServerName      mysite1.local.site
 DocumentRoot    "C:/XAMPP/htdocs/mysite2/public_html"
 SSLEngine on
 SSLCertificateFile "C:/path/to/your/local.crt"
 SSLCertificateKeyFile "C:/path/to/your/local.key"
 # Depending on your setup, you might also need these or similar directives:
 # SSLProtocol all -SSLv3
 # SSLCipherSuite HIGH:MEDIUM:!aNULL:!MD5:!SEED:!IDEA
</VirtualHost>
<VirtualHost *:443>
 ServerName      mysite2.local.site
 DocumentRoot    "C:/XAMPP/htdocs/mysite2/public_html"
 SSLEngine on
 SSLCertificateFile "C:/path/to/your/local.crt"
 SSLCertificateKeyFile "C:/path/to/your/local.key"
 # Depending on your setup, you might also need these or similar directives:
 # SSLProtocol all -SSLv3
 # SSLCipherSuite HIGH:MEDIUM:!aNULL:!MD5:!SEED:!IDEA
</VirtualHost>

“Your connection is not private”

The NET::ERR_CERT_AUTHORITY_INVALID error in browsers indicates that the SSL certificate used by the website is not trusted by your browser. This is a common issue when using self-signed certificates for local development, as these certificates are not issued by a Certificate Authority (CA) that the browser trusts by default.

To solve this in Windows:

  1. Double-click the .crt file you generated.
  2. Click “Install Certificate…”.
  3. Choose either “Current User” or “Local Machine” and click “Next”. Selecting “Local Machine” will require administrator privileges.
  4. Select “Place all certificates in the following store” and click “Browse…”.
  5. Choose “Trusted Root Certification Authorities” and click “OK”, then “Next”, and finally “Finish”.
  6. You might need to restart your browser for the changes to take effect.
0 0 votes
Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments

0
Would love your thoughts, please comment.x
()
x