Configure XAMPP to allow SSL connection

Steps - 

  • Config hosts for virtual host
  • Config httpd-vhost.conf
  • Config httpd.conf
  • Make SSL Certificate
  • Config Chrome - allow CA on localhost

Step 1: Config hosts 

    Open notepad as administrator.



    From the file menu select open. In popup windows select C:\Windows\System32\drivers\etc and then select hosts and open it. 


Create a virtual host as bellow - 

127.0.0.1 test.dev

then save and close the file.

Step 2:  Config httpd-vhost.conf 

Now we will open httpd-vhost.conf with a notepad for some configuration.


We need to do here is to create a new virtual host. So we're building our certificate keys in a minute.


<VirtualHost *:443>
    DocumentRoot "/xampp/htdocs/"
    ServerName test.dev
    SSLEngine on
    SSLCertificateFile "conf/ssl.crt/server.crt"
    SSLCertificateKeyFile "conf/ssl.key/server.key"
    <Directory "/xampp/htdocs/">
        Options All
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>


In the above code you can see where we set up a virtual host for port 443 SSL, and then we have a document root so here we define the root directory of the server directory the home directory for your webpage, and then the server name so here we set test.dev for ServerName you can set any. And then set SSLCertificateFile and SSLCertificateKeyFile path then save the file and close it. See the above code.


Step 3:  Make SSL Key

Now go to the apache folder and click on makecert.bat file to generate the certificate.



A commend windows will open. Now enter required field information as bellow - 

Generating a 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]:BD
State or Province Name (full name) [Some-State]:Dhaka
Locality Name (eg, city) []:Dhaka
Organization Name (eg, company) [Internet Widgits Pty Ltd]:AdvanceTechTutorial
Organizational Unit Name (eg, section) []:IT
Common Name (e.g. server FQDN or YOUR name) []:test.dev
Email Address []:example@mail.com

Please enter the following 'extra' attributes
to be sent with your certificate request
A challenge password []:12365410
An optional company name []:admin
Enter pass phrase for privkey.pem:
writing RSA key
Signature ok
subject=C = BD, ST = Dhaka, L = Dhaka, O = AdvanceTechTutorial, OU = IT, CN = test.dev, emailAddress = example@mail.com
Getting Private key
Could Not Find H:\PHPServer\apache\.rnd
        1 file(s) moved.
        1 file(s) moved.

-----
Das Zertifikat wurde erstellt.
The certificate was provided.

Press any key to continue . . .

Here is the screenshot of the cmd prompt 


The certificate is generated successfully. Press any key to close the cmd.

Step 4: Config httpd.conf 

Now goto xampp/apache/conf and open httpd.conf in notepad.



Then uncomment or add the following line to enable virtual host configuration.

Include conf/extra/httpd-vhosts.conf
see the screenshot 


Now go to  xampp\apache\conf\ssl.crt folder and open the server.crt certificate file and install.






Now restart the apache server.



Step 5: Chrome Configuration

Now we will configure chrome for ssl.  Run the bellow script on chrome browser - 

chrome://flags/#allow-insecure-localhost


This window will open. Here "Allow invalid certificates for resources loaded from localhost." is disabled. Enable it.


Now you can run localhost as https://localhost/  or http://localhost/ .


 How to remove SSL certificate from windows 10 with MMC