How to Create Valid SSL in localhost for XAMPP

Chrome browser updates has become a burden for local development. Not only they decided to disable .dev domain for local development, they also really have specific configuration in SSL Cert to show the site as secure.

In this step by step tutorial I will try to explain  the walk-through to create SSL cert locally to be used in XAMPP in Windows.

In my XAMPP install I basically  have a clone to all the site that I managed.  And All of them (of course) use SSL/HTTPS.

Here’s the step by  step guide:

In this step we are going to crate SSL and setup “site.test” website.

1. Navigate to Apache directory in XAMPP.

In regular install it’s in C:\xampp\apache.

2. Create a folder in that page.

This is where we will store our cert. In this example I will create “crt” folder. So we will have C:\xampp\apache\crt

3. Add this files.

4. Edit cert.conf and Run make-cert.bat

Change {{DOMAIN}} text using the domain we want to use, in this case site.test and save.

Double click the make-cert.bat and input the domain site.test when prompted. And just do enter in other question since we already set the default from cert.conf.

Note: I don’t know how to do text replace in .bat script, if you do, let me know in the comment how to do it and I will update make-cert.bat to automatically replace the {{DOMAIN}} with the domain input.

5. Install the cert in windows.

After that, you will see site.test folder created. In that folder we will have server.crt and server.key. This is our SSL certificate.

Double click on the server.crt to install it on Windows so Windows can trust it.

And then select Local Machine as Store Location.

And then Select “Place all certificate in the following store” and click browse and select Trusted Root Certification Authorities.

Click Next and Finish.

And now this cert is installed and trusted in Windows. Next is how how to use this cert in XAMPP.

6. Add the site in Windows hosts

  1. Open notepad as administrator.
  2. Edit C:\Windows\System32\drivers\etc\hosts (the file have no ext)
  3. Add this in a new line:
127.0.0.1 site.test

This will tell windows to load XAMPP when we visit http://site.test You can try and it will show XAMPP dashboard page.

7. Add the site in XAMPP conf.

We need to enable SSL for this domain and let XAMPP know where we store the SSL Cert. So we need to edit C:\xampp\apache\conf\extra\httpd-xampp.conf

And add this code at the bottom:

## site.test
 <VirtualHost *:80>
     DocumentRoot "C:/xampp/htdocs"
     ServerName site.test
     ServerAlias *.site.test
 </VirtualHost>
 <VirtualHost *:443>
     DocumentRoot "C:/xampp/htdocs"
     ServerName site.test
     ServerAlias *.site.test
     SSLEngine on
     SSLCertificateFile "crt/site.test/server.crt"
     SSLCertificateKeyFile "crt/site.test/server.key"
 </VirtualHost>

After that, you will need to restart Apache in XAMPP.  It’s very simple, simply open XAMPP Control Panel and Stop and re-Start Apache Module.

Tips: In XAMPP conf, as you can see you can change the domain root directory if needed. Eg. as sub-dir in htdocs.

8. Restart your browser and Done!

This is required to load the certificate. And visit the domain on your browser, and you will see green lock!

I hope this tutorial is useful!

If you already use other method, let me know in the comment 🙂

63 Comments

  1. Wolverine

    In step 7,

    1- I paste the code in httpd-xampp.conf
    2- then I stop the xampp (Apache)
    3- Then I start it (in this part the Apache does not work)

    now if I remove the code, the apache if it works but if I paste it again it stops working

    Is there anything else to do in this part?

    Thank you

    Reply
    • Hakim Douib

      i have the same problem and my selotion was that i need to fix the path to the ctr and key . becouse whane you change the site.site to your domain for me was localhost i forget to change it in script
      SSLCertificateFile “crt/localhost/server.crt”
      SSLCertificateKeyFile “crt/localhost/server.key”

      Reply
      • Ian

        That is correct. Google bought the .dev registry from ICANN Dec 2017 for their own internal use and closed down any external use of it.
        The alternatives are to use an undisputed TLD. .test .example and .localhost are all protected by ICANN, so one of those is the best option.

        We’re all in the same boat here.

        Reply
        • Drachsi

          Thank you very much. No wonder I was having problems, nobody but you mention that.
          Regards
          Drachsi

          Reply
  2. Yvon

    i Followed instructions, but my appach does not start anymore.
    it displayed
    11:04:24 [Apache] Status change detected: running
    11:04:25 [Apache] Status change detected: stopped
    11:04:25 [Apache] Error: Apache shutdown unexpectedly.
    11:04:25 [Apache] This may be due to a blocked port, missing dependencies,
    11:04:25 [Apache] improper privileges, a crash, or a shutdown by another method.
    11:04:25 [Apache] Press the Logs button to view error logs and check
    11:04:25 [Apache] the Windows Event Viewer for more clues
    11:04:25 [Apache] If you need more help, copy and post this
    11:04:25 [Apache] entire log window on the forums

    how can i fix it?

    Reply
  3. Ian

    Apache is missing dependencies possibly caused by trying to start before the certificate has been created
    Apache cannot find the path
    Access was denied.

    Was the SSl saved – check the directory. Is it there, is the path correct?
    If you rerun it, delete the previous directory.

    Hosts file – must be edited with elevated priviledges and save as host – not host .txt or any other extension.
    In the conf file, ensure the first module is port 80 and the second module is port 443. you still need port 80 to be there even though you are using SSL

    Do you have a .htaccess file in your root, it may be denying you. Add an Allow directive to both modules

    DocumentRoot “C:\xampp\htdocs\example.test”
    ServerName testsite.test

    Order allow,deny
    Allow from all

    DocumentRoot “C:\xampp\htdocs\example.test”
    ServerName example.test
    SSLEngine On
    SSLCertificateFile “C:/xampp/apache/crt/example.test/server.crt”
    SSLCertificateKeyFile “C:/xampp/apache/crt/example.test/server.key”

    Order allow,deny
    Allow from all

    Reply
  4. Ian

    Getting the not secure message but are you getting the green padlock? If it’s red you may have not completed a step.
    If it’s green It could be something as simple as cache needing a deep clean.
    What are you putting in the address bar and what is being returned.
    Are you calling for localhost/mysite.test where you should be requesting mysite.test.
    Try qualifying the url with the protocol by prefixing https://

    Reply
  5. Felix

    Hi man, thanks for the tutorial! I followed all the steps (twice), using .test domains but I still get the non secure screen with this error NET::ERR_CERT_COMMON_NAME_INVALID.

    I think is weird because I’m sure that in the CERT COMMON NAME I entered the domain I was cofiguring… for test purposes: secure.test.

    If anyone have this problem and has any suggestion…

    Thanks!

    Reply
  6. Felix

    Nevermind… I just replaced just one {{DOMAIN}} in the conf file and there was two. Working perfect! Thanks!

    Reply
    • Neovorg

      Nice, I was also getting the same errors as you and found out that yep: there aer two {{DOMAIN}} in the conf file, edited both of them and voila, it worked!

      Reply
  7. Gunther Jerschabek

    Hi, thank you very much for this brilliant tutorial. Works perfectly in Chrome Version 68.0.3440.106, IE 10 and Opera 54.0 .
    – Didn’t seen the second {{DOMAIN}} to replace at the very end of cert.conf.
    – Was required to clear browser caches.
    -After ‘Unsecure connection’ warning needed some time to find my forgotten point at the end of URL: NOT site.test BUT site.test.
    This works perfectly for me: https://site.test.

    Reply
  8. Stacy

    Thanks , this worked for me. The only thing you need to do is instead of editing
    C:\xampp\apache\conf\extra\httpd-xampp.conf
    We need to add test domain in
    C:\xampp\apache\conf\extra\httpd-vhosts.conf

    Reply
  9. Cyber Valdez

    If you’re having this problem when using file_get_contents or curl:
    “file_get_contents(): SSL operation failed with code 1.”

    Make sure to comment out the following line in php.ini
    openssl.cafile=”C:\xampp\apache\bin\curl-ca-bundle.crt”
    to:
    ; openssl.cafile=”C:\xampp\apache\bin\curl-ca-bundle.crt”

    This makes it so it will use the OS managed certificates.

    Reply
  10. Jeff Matumi

    Hay your plugins are great but mostly outdated. please refresh your plugins on wordpress.org 😉 thanks.

    Reply
  11. Roy

    Hi,tried allsorts certificate wrong signing xampp won’t run.please help i need localhost to work for developing my daughters website.
    It did work last week all changed when windows 10 updated.
    My address is localhost/waggybum/index.php
    certificates stored where you said. I used localhost/waggybum for them ?? it would be great if you can help also the virtual files done.
    Best regards Roy

    Reply
    • David

      I’m not 100% sure, but SSL cert is only for top level domain (?)
      So maybe need to create ServerName on your xampp (part #7)

      I hope this helps!
      have fun debugging 🙂

      Reply
  12. Ian

    Roy,
    from the way I read your problem, you are trying to call your website using a file path (localhost/waggybum/index.php) when you should be calling a url (example.test).

    You need to define waggybum.test in Hosts file (127.0.0.1 waggybum.test) or (localhost waggybum.test) as in Section 6.

    Follow the instruction replacing site.test with waggybum.test.

    Reply
    • roy

      Hi thx for your help i created certificate from your website
      I tried downloading firefox 3.6 very old one but still would not work with localhost i also took updates off windows 10 to nothing would work yet 2 weeks ago everything was working well

      Reply
  13. roy

    hi did this renamed the directory where my php programs are to waggybum.test.
    in windows host 127.0.0.1 waggybum.test
    ## site.test

    DocumentRoot “C:/xampp/htdocs/waggybum.test”
    ServerName waggybum.test
    ServerAlias *.waggybum.test

    DocumentRoot “C:/xampp/htdocs/waggybum.test”
    ServerName waggybum.test
    ServerAlias *.waggybum.test
    SSLEngine on
    SSLCertificateFile “c:/xampp/apache/crt/waggybum.test/server.crt”
    SSLCertificateKeyFile “c:/xampp/apache/crt/waggybum.test/server.key”

    Now says can’t find site

    Reply
  14. Ian

    uninstalling updates may not be enough.
    If you have restore enabled, try restoring to 2 weeks previous.

    Win 10 update may have changed something.
    Is xampp actually working?

    Reply
  15. roy

    ignore last comment forgot to take # off 127.0.0.1

    But now waggybum.test uses an invalid security certificate.

    Reply
  16. Ian

    Did you forget the ports? Virtualhost file should look like this..

    ###### DomainName.test #######

    DocumentRoot “C:\xampp\htdocs\DomainName.test”
    ServerName DomainName.test

    Order allow,deny
    Allow from all

    DocumentRoot “C:\xampp\htdocs\DomainName.test”
    ServerName DomainName.test
    SSLEngine On
    SSLCertificateFile “C:/xampp/apache/crt/DomainName.test/server.crt”
    SSLCertificateKeyFile “C:/xampp/apache/crt/DomainName.test/server.key”

    Order allow,deny
    Allow from all

    Reply
  17. Ian

    Cut/paste is n’t working very well. What I was trying to show was VirtualHost DomainName.test:80 on the first section and VirtualHost DomainName.test:443 on the second.

    Reply
    • Ian

      2: You don’t want http, you only need https (s = secure) The web is moving to greater security. Forget http.

      1: Be aware that XAMPP is a development environment and should not be used for production as it is not secure enough, (if that’s what you are trying to do).
      As far as I am aware, these instructions are for a single computer setup, not for setting up a LAN.

      Reply
      • Sixten Kangas Gustafsson

        2: i want if u go in http u redirect to https.

        1. okey, it is not for lan, it is for public website not sure why it only works on lan https, block or something for the public not sure how to change that.

        Reply
        • Ian

          Sixten, the instruction written by David are to allow you to have a fully functioning DEVELOPMENT environment. Nothing more.

          If you are are trying to move your production site from http to https then I suggest you contact your host to set up an SSL for you. Typical cost is $60 but your host may provide free SSL such as https://letsencrypt.org/

          You will probably need to change your .htaccess file too.
          You can get a ton of help and information at https://www.webmasterworld.com/home.htm

          Reply
  18. roy

    This is just to develope my website on local laptop using xampp used to work great 2 weeks ago my real site is with 123reg and is ssl at present waggybum.co.uk as an index page which you can click on to etsy till i write the site as a shopping cart.most of it is done till this happened.

    OK in windows i set 127.0.0.1 waggybum.test
    in certificate creation i put waggybum.test
    on my localsite i changed php files directory from waggybum to waggybum.test
    these are my virtual host settings

    ## site.test

    DocumentRoot “C:/xampp/htdocs/waggybum.test”
    ServerName waggybum.test
    ServerAlias *.waggybum.test

    DocumentRoot “C:/xampp/htdocs/waggybum.test”
    ServerName waggybum.test
    ServerAlias *.waggybum.test
    SSLEngine on
    SSLCertificateFile “c:/xampp/apache/crt/waggybum.test/server.crt”
    SSLCertificateKeyFile “c:/xampp/apache/crt/waggybum.test/server.key”

    Reply
    • Ian

      it should work if you have gone through the whole procedure. Don’t forget every time you generate a new certificate you also need to re-install it.

      Reply
    • Ian

      how are you trying to access site.test??
      if you are trying to click on the file from windows explorer, you will get file:///C:/xampp/htdocs/site.test which bypasses the web server completely and is not what you want.

      if you followed the instructions correctly you should be able to just enter site.test or https://site.test in the browser.

      Reply
  19. mir

    Two computer are in Same wifi zone.
    one computer has XAMPP Server.
    it is perfectly working from the same computer where the server is installed.
    but I am trying to access the site from other computer which is in the same lan or wifi zone.
    From other computer, all the sites are accessible from the ip address(Server computer). like http:\\192.167.0.52\sitename\
    i want to access from other computer using https:\\site.test\sitename\
    kindly help

    Reply
    • Ian

      localhost and 127.0.0.1 are port loopbacks on a single machine.
      to access from a different machine you will need to use the xampp machines ip address or computer name.

      get your xampp machine name (ie. my-computer)

      from your other machines browser you will need to use
      https:// my-computer/rest of the path

      Reply
  20. mir

    hi,
    sorry to late reply.
    all the functionality of the web app is working fine using
    https:// my-computer/rest form other computer but in the left corner of address bar its displaying that your connection is not secure.
    but in xampp computer, when i use the url(https://site.test/rest) then it works and displays “connection is secure”.
    How can I make the connection secure from other computer?

    Reply
  21. Drachsi

    Hi,

    I think I have done everything as shown, but when I go to https://name.test I see error message “Your connection is not secure”

    localhost/name/ and shows the basic WP Theme
    localhost/name/wp-admin/ lets be do admin ok.
    name.test loads but then turns into name.test/dashboard

    How can I identify the problem?
    Thanks to everybody that post their ideas and problems, helped me get this far. I am in my late 70’s, things just take longer.
    Regards
    Drachsi

    Reply
    • Drachsi

      I had hoped somebody could have helped me with an answer to my question. Is it so difficult?
      Regards
      Drachsi

      Reply
      • Ian

        Hi Drachsi,
        I’m not a WordPress person ( I roll my own CMS) but it looks like your index.php has a default link to dashboard.

        Look in your index.php for a link with /dashboard in it, comment it out and see if that works.

        Reply
    • Ian

      Jerome, if you have only changed your http port from 80 to 7070 because of conflict, it shouldn’t matter.
      Just change ALL references of 80 to 7070, likewise if you have changed the https port number.

      Reply

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.