713 Votes

XAMPP: How to set up SSL/HTTPS for local Projects

Tutorial by Stefan Trost | Last update on 2024-05-05 | Created on 2018-03-16

In this tutorial, I would like to show you how to set up your XAMPP configuration in a way that you can access your local PHP projects via SSL and in the browser via an HTTPS URL. You can use that, for example, in the case that your online website is running over HTTPS and you want to use the same link structure also for testing.

In my tutorial about setting up virtual domains, I had already explained the basics of how to define arbitrary domains with XAMPP and Apache, which can then point to a local directory in the XAMPP installation. However, after this setup, initially, all domains can only be accessed via HTTP in the browser. In order to also allow URLs via HTTPS, the following steps are necessary additionally:

  1. Create Certificate
  2. Define VirtualHost
  3. Restart Apache
  4. Add Exceptions
  5. Install Certificate

In the following, we would like to go through each of these steps in detail.

Create Certificate

First, we have to create our own SSL certificate. Fortunately, XAMPP already offers a little ready script for this task that makes this work easier for us and that we can open and use as follows:

  1. The script can be found in the Apache folder of the XAMPP installation, in a standard installation on Windows this is the path: C:\xampp\apache
  2. In this folder we find the file makecert.bat, with a double-click on the file we can start the script.

After starting the script, the command line opens where we just need to follow the instructions. Below we would like to go through these instructions step by step and explain what needs to be entered. At the end of this section you will find the entire process as a summary without any comments.

The script starts with the automatic generation of a private key under the name "privkey.pem". Meanwhile, the script gives us the following feedback about this process:

Generating a 2048 bit RSA private key
............+++
...................+++
writing new private key to 'privkey.pem'

After that, we have to come in action for the first time and we are asked to enter a password for our key. That should look like this:

Enter PEM pass phrase:
Verifying - Enter PEM pass phrase:

Here we can use any password we want and then we have to repeat it for one more time.

This is followed by a few questions about the location and the organization respectively company to which we would like to issue our certificate. This information will later be written into our certificate. Specifically, the questions are about the country (Country Name), the federal state (State or Province), the city (Locality Name), the name of the company or organization (Organization Name) as well as the name of the department (Organizational Unit Name):

Country Name (2 letter code) [AU]:DE
State or Province Name (full name) [Some-State]:NRW
Locality Name (eg, city) []:BOT
Organization Name (eg, company) [Internet Widgits Pty Ltd]:STT
Organizational Unit Name (eg, section) []:WEB

Since we only want to use our certificate locally, we can enter anything we want here. Alternatively, we can also just type a period if we want to leave the respective field blank. The country must be entered in the form of a two-digit country code (here "DE" for Germany); all other fields also allow more characters. In our example, in addition to "DE" (Germany), we used the information "NRW" (North Rhine-Westphalia), "BOT" (Bottrop), "STT" (as a company) and "WEB" as an organizational unit.

After that, the question for the "Common Name" follows ("FQDN" stands for "Fully Qualified Domain Name" here):

Common Name (e.g. server FQDN or YOUR name) []:*.example.com

Here we can enter the domain of our website for which the certificate should be issued. In order to later receive a green lock in the browser, the name of the domain must match the URL exactly.

If the certificate is to be issued for only one domain such as www.example.com, "www.example.com" must be specified here. If your domain also has subdomains, you can issue a wildcard certificate by entering "*.example.com", for example. With *.example.com the certificate then includes both www.example.com as well as all other conceivable subdomains such as en.example.com or de.example.com.

If you have several different domain names, unfortunately you cannot just specify something like "*" or "*.*". Instead, you can just repeat the process for each of your domains to get a separate certificate for each domain - if you value the green lock in the browser. Alternatively, you can namely also specify "localhost" and use the same certificate for each of your domains. With doing so, you won't get a green lock in the browser, but the page will still work, which should usually be sufficient for testing purposes. If you click on the red lock, you will receive the information "Server's Certificate does not match the URL", otherwise you should not notice any differences.

Email Address []:local@example.com

Next, the question for an email address follows. Here, too, we can specify any address we want, as we do not have to be reachable over it. We have chosen "local@example.com" here.

Two further questions follow about the so-called extra attributes named "challenge password" and "optional company name":

A challenge password []:.
An optional company name []:.

We can skip both of these questions by acknowledging them with entering a point. The so-called "challenge password" is neither contained in the certificate nor in the key and was originally only intended to be used to identify to the certification authority in order to revoke the certificate. This was intended to prevent someone who only has the certificate and the key from being able to revoke the certificate. In practice, however, this has never really played a big role and for us, who only want to use the certificate locally, not anyway.

Finally, we have to repeat the password from the beginning again:

Enter pass phrase for privkey.pem:

If this password matches the previous input, our certificate will be created. After we have received the feedback that our certificate is ready, we can press any key to close the command line window.

The whole procedure then looks like this:

Generating a 2048 bit RSA private key
............+++
...................+++
writing new private key to 'privkey.pem'
Enter PEM pass phrase:
Verifying - Enter PEM pass phrase:
-----
You are about to be asked to enter information that will be incorporated
into your certificate request.
What you are about to enter is what is called a Distinguished Name or a DN.
There are quite a few fields but you can leave some blank
For some fields there will be a default value,
If you enter '.', the field will be left blank.
-----
Country Name (2 letter code) [AU]:DE
State or Province Name (full name) [Some-State]:NRW
Locality Name (eg, city) []:BOT
Organization Name (eg, company) [Internet Widgits Pty Ltd]:STT
Organizational Unit Name (eg, section) []:WEB
Common Name (e.g. server FQDN or YOUR name) []:*.example.com
Email Address []:local@example.com

Please enter the following 'extra' attributes
to be sent with your certificate request
A challenge password []:.
An optional company name []:.
Enter pass phrase for privkey.pem:
writing RSA key
Signature ok
subject=/C=DE/ST=NRW/L=BOT/O=STT/OU=WEB/CN=localhost/emailAddress=local@example.com
Getting Private key
        1 File(s) moved.
        1 File(s) moved.

-----
The certificate was provided.

Press any key . . .

Now our certificate is created and this step is completed.

The ready certificate consists of two parts that are stored in two different files: the private key with the file extension KEY as well as the signed public certificate with the file extension CRT. You can find both files in the folder C:\xampp\apache\conf\ in the subfolders "ssl.crt" respectively "ssl.key" under the names "server.crt" (Signed Certificate) as well as "server.key" (Private Key ), provided you have XAMPP installed in C:\xampp.

If you want to create multiple certificates for different domain names, you should make sure to rename these files or move them to a different subfolder before, otherwise they would be overwritten when the next certificate is created.

By default, the validity of the certificate created is 365 days. If you prefer a different time period, you can open the file makecert.bat with a text editor and adjust the parameter "-days 365" accordingly.

Define VirtualHost

In the next step, we have to set up a new VirtualHost for each domain we would like to make able to be called via HTTPS within the file C:\xampp\apache\conf\extra\httpd-vhosts.conf similar to what we did in the first tutorial.

At this point, it's important to know that HTTP is running on port 80, but SSL is on port 443. In the following, we'll define the URL example.com, which can then be called with both http://www.example.com and https://www.example.com afterwards. The first block applies to all requests over port 80 (i.e. for all requests starting with http://...) and looks something like the blocks from the first tutorial. Under DocumentRoot we can specify the root directory of the respective website again.

# HTTP
<VirtualHost *:80>
 DocumentRoot "C:/xampp/htdocs/myproject"
 ServerName example.com
 ServerAlias www.example.com
</VirtualHost>
 
# HTTPS
<VirtualHost *:443>
 DocumentRoot "C:/xampp/htdocs/myproject"
 ServerName example.com
 ServerAlias www.example.com
 SSLEngine on
 SSLCertificateFile "conf/ssl.crt/server.crt"
 SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

The HTTPS requests are defined via the second block "<VirtualHost *:443>" (port 443). The DocumentRoot directory, ServerName, and ServerAlias specifications are identical to HTTP. In addition, now we have to switch on SSL and provide information about our SSL certificate and key. This tells the server that SSL should be used (SSLEngine on) and where to find the corresponding files (crt and key). As you can see, we have specified the folders where our certificate has just been stored.

In the example here we have only defined one URL that should be reachable via HTTP as well as HTTPS. Each additional domain or URL must be defined in exactly the same way, we can write any number of blocks of this type among each other.

For both the certificate file (CRT) as well as the private key (KEY), the example contains the path where the two files are saved by default after their creation. If you have created multiple certificates for different domains and do not want to use the same certificate for these different domains, you have to adjust the paths and file names accordingly, depending on where you have saved your certificate.

Restart Apache

For our changes to take effect, after saving the changed file, we must now restart Apache. For this, we open the XAMPP Control Panel and click on "Stop" behind the module "Apache" and then on "Start", so that the server restarts with the new configuration.

Add Exceptions

Now we are done with our configuration. However, when we visit one of our freshly defined HTTPS pages in the browser, we may receive the error message "This connection is not secure" with error code SEC_ERROR_UNKNOWN_ISSUER (depending on browser and browser settings). The Firefox browser, as an example, provides the dissuasive text "The owner of ... did not properly configure the site, Firefox did not connect to the site to protect your information from theft." In short, we can not just visit our website.

The reason is that we have created the certificate on our own and Firefox, Chrome, Edge and other browsers only trusts certificates from official certification authorities. For our local testing purposes that would of course be exaggerated, so we can confidently click on the button "Add an exception ...". In the dialogue that opens up, we should activate the option "Permanently save this exception", otherwise we will be asked again with each call. Afterwards we can click on "Confirm security exemption" and should now finally be able to see our website via the HTTPS URL.

Install Certificate

As an alternative to adding an exception in the browser, as we looked at in the last section, we can also install our own certificate directly on our system, regardless of the browser. To do this, we simply open our certificate file "server.crt" from the folder "C:\xampp\apache\conf\ssl.crt" with a double-click in order to click on "Install certificate" in the dialog that opens. Then, the Windows "Certificate Import Wizard" opens, which we go through as follows:

  1. We skip the welcome page by clicking "Next".
  2. On the page "Certificate Store", we select the option "Place all certificates in the following store" and click on "Browse".
  3. The certificate store "Personal" is preset here. Instead, we select "Trusted Root Certification Authorities" and confirm with "OK".
  4. Finally, we click on "Next" again and get a summary of our import. We confirm this by clicking on "Finish" and then confirm the warning message that may be displayed to complete the installation.

This should be enough to get a green lock in the browsers Chrome and Edge. If your browser was open during the certificate installation, it must be restarted before we see the green lock so that our certificate is loaded updated when the browser is started again.

In order to get our own certificate recognized also by the Firefox browser, one of the following two additional steps is necessary:

  • The easiest way is to enter "about:config" in the Firefox address bar and then set the option "security.enterprise_roots.enabled" to "true". The result is that Firefox also starts trusting the Trusted Root Certification Authorities of Windows (like the other two browsers do by default).
  • Alternatively, we can also enter "about:preferences" in the URL bar and then use the search function at the top right to search for "certificates". Then we click on "View Certificates" and in the dialog window on "Import", where we select our own certificate and then confirm the process.

This should also give you a green lock in Firefox.

Safety Warning

The instructions for installing and using self-created SSL certificates shown in this tutorial should only be used for testing purposes, for example if you use a XAMPP server within a virtual machine without an internet connection to test your websites before they go online.

For productive use, however, only certificates from a recognized certification authority (CA) should be used and installed.

ReplyPositiveNegativeDateVotes
00 Votes

It would be nice to know WHICH FILE the virtualhost needs to be put in...
2018-06-10 at 22:31

ReplyPositive Negative
00 Votes

This tutorial is based on the first tutorial on this topic, so it is the same file that is to be edited here:

C:\xampp\apache\conf\extra\httpd-vhosts.conf

I have added the file path also in this tutorial, I hope this makes it a little clearer.
2018-06-11 at 22:26

Positive Negative
Reply
00 Votes

Must the specifications from Part 2 of the tutorial be added to the httpd-vhosts.conf in addition to the information from Part 1, so that the httpd-vhosts.conf would look like this:

<VirtualHost www.example.com>
 ServerAdmin webmaster@localhost
 DocumentRoot "c:/xampp/htdocs/seiten/xyz"
 ServerName example.com
 ServerAlias example.com
</VirtualHost>

<VirtualHost s.example.com>
 ServerAdmin webmaster@localhost
 DocumentRoot "c:/xampp/htdocs/seiten/xyzs"
 ServerName s.example.com
 ServerAlias s.example.com
</VirtualHost>

# HTTP
<VirtualHost *:80>
 DocumentRoot "C:/xampp/htdocs/myproject"
 ServerName example.com
 ServerAlias www.example.com
</VirtualHost>

# HTTPS
<VirtualHost *:443>
 DocumentRoot "C:/xampp/htdocs/myproject"
 ServerName example.com
 ServerAlias www.example.com
 SSLEngine on
 SSLCertificateFile "conf/ssl.crt/server.crt"
 SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

Or are the blocks described in this tutorial alone sufficient?
2020-01-20 at 06:42

ReplyPositive Negative
00 Votes

No, not additionally.

You don't need the first section, what you have defined under #HTTP and #HTTPS is sufficient.

In your example, you should incorporate a redirection to HTTPS for the HTTP variant so that the page can only be accessed via HTTPS and people who enter http.. are redirected to https.. automatically.
2020-01-20 at 15:35

Positive Negative
Reply
Reply

About the Author

AvatarYou can find Software by Stefan Trost on sttmedia.com. Do you need an individual software solution according to your needs? - sttmedia.com/contact
Show Profile

 

Related Topics

Important Note

Please note: The contributions published on askingbox.com are contributions of users and should not substitute professional advice. They are not verified by independents and do not necessarily reflect the opinion of askingbox.com. Learn more.

Participate

Ask your own question or write your own article on askingbox.com. That’s how it’s done.