Found the answer. In the file xampp\apache\conf\extra\httpd-ssl.conf, under the comment SSL Virtual Host Context pages on port 443 meaning https is looked up under different document root.

Simply change the document root to the same one and problem is fixed.

For XAMPP, do the following steps:

  1. G:\xampp\apache\conf\extra\httpd-ssl.conf"

  2. Search 'DocumentRoot' text.

  3. Change DocumentRoot DocumentRoot "G:/xampp/htdocs" to DocumentRoot "G:/xampp/htdocs/project name".

You can also configure your SSL in xampp/apache/conf/extra/httpd-vhost.conf like this:

<VirtualHost *:443>
DocumentRoot C:/xampp/htdocs/yourProject
ServerName yourProject.whatever
SSLEngine on
SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
</VirtualHost>

I guess, it's better not change it in the httpd-ssl.conf if you have more than one project and you need SSL on more than one of them

configure SSL in xampp/apache/conf/extra/httpd-vhost.conf

http

<VirtualHost *:80>
DocumentRoot "C:/xampp/htdocs/myproject/web"
ServerName www.myurl.com


<Directory "C:/xampp/htdocs/myproject/web">
Options All
AllowOverride All
Require all granted
</Directory>
</VirtualHost>

https

<VirtualHost *:443>
DocumentRoot "C:/xampp/htdocs/myproject/web"
ServerName www.myurl.com
SSLEngine on
SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
<Directory "C:/xampp/htdocs/myproject/web">
Options All
AllowOverride All
Require all granted
</Directory>
</VirtualHost>

make sure server.crt & server.key path given properly otherwise this will not work.

don't forget to enable vhost in httpd.conf

# Virtual hosts
Include etc/extra/httpd-vhosts.conf

In case you are on Mac OS (catalina or mojave) and wants to enable HTTPS/SSL on XAMPP for Mac, you need to enable the virtual host and use the default certificates included in XAMPP. On your httpd-vhosts.conf file add a new vhost:

<VirtualHost *:443>
ServerAdmin webmaster@localhost.com
DocumentRoot "/Users/your-user/your-site"
ServerName your-site.local
SSLEngine on
SSLCertificateFile "etc/ssl.crt/server.crt"
SSLCertificateKeyFile "etc/ssl.key/server.key"
<Directory "/Users/your-user/your-site">
Options Indexes FollowSymLinks MultiViews
AllowOverride All
Require all granted
Order allow,deny
Allow from all
</Directory>
</VirtualHost>

I finally got this to work on my own hosted xampp windows 10 server web site. I.e. padlocks came up as ssl. I am using xampp version from November 2020.

  1. Went to certbot.eff.org. Selected from their home page software [apache] and system [windows]. Then downloaded and installed certbot software found at the next page into my C drive.

  2. Then from command line [cmd in Windows Start and then before you open cmd right click to run cmd as admin] I enhtered the command from Certbot page above. I.e. navigated to system32-- C:\WINDOWS\system32> certbot certonly --standalone

  3. Then followed the prompts and enteredmy domain name. This created certs as cert1.pem and key1.pem in C:\Certbot yourwebsitedomain folder. the cmd windows tells you where these are.

  4. Then took these and changed their names from cert1.pem to my domainname or shorter+cert.pem and same for domainname or shorter+key.key. Copied these into C:\xampp\apache\ssl.crt and ssl.key folders respectively.

  5. Then for G:\xampp\apache\conf\extra\httpd-vhosts entered the following:

<VirtualHost *:443>
DocumentRoot "G:/xampp/htdocs/yourwebsitedomainname.hopto.org/public/" ###NB My document root is public.  Yours may not be.  Or could have an index.php page before /public###
ServerName yourwebsitedomainnamee.hopto.org
<Directory G:/xampp/htdocs/yourwebsitedomainname.hopto.org>
Options Indexes FollowSymLinks Includes ExecCGI
AllowOverride All
Require all granted
</Directory>
ErrorLog "G:/xampp/apache/logs/error.log"
CustomLog "G:/xampp/apache/logs/access.log" common
SSLEngine on
SSLCertificateFile "G:\xampp\apache\conf\ssl.crt\abscert.pem"
SSLCertificateKeyFile "G:\xampp\apache\conf\ssl.key\abskey.pem"
</VirtualHost>
     

  1. Then navigated to G:\xampp\apache\conf\extra\httpd-ssl.conf and did as was advised above. I missed this important step for days until I read this post. Thank you! I.e. entered
<VirtualHost _default_:443>
DocumentRoot "G:/xampp/htdocs/yourwebsitedomainnamee.hopto.org/public/"
###NB My document root is public.  Yours may not be.  Or could have an index.php page before /public###
SSLEngine on
SSLCertificateFile "conf/ssl.crt/abscert.pem"
SSLCertificateKeyFile "conf/ssl.key/abskey.pem"
CustomLog "G:/xampp/apache/logs/ssl_request.log" \
"%t %h %{SSL_PROTOCOL}x %{SSL_CIPHER}x \"%r\" %b"
</VirtualHost>


Note1. I used www.noip.com to register the domain name. Note2. Rather then try to get them to give me a ssl certificate, as I could not get it to work, the above worked instead. Note3 I use the noip DUC software to keep my personally hosted web site in sync with noip. Note4. Very important to stop and start xampp server after each change you make in xampp. If xampp fails for some reason instead of starting the xampp consol try the start xampp as this will give you problems you can bug fix. Copy these quickly and paste into note.txt.

There is a better guide here for Windows:

https://shellcreeper.com/how-to-create-valid-ssl-in-localhost-for-xampp/

Basic steps:

  1. Create an SSL certificate for your local domain using this: See more details in the link above https://gist.github.com/turtlepod/3b8d8d0eef29de019951aa9d9dcba546 https://gist.github.com/turtlepod/e94928cddbfc46cfbaf8c3e5856577d0

  2. Install this cert in Windows (Trusted Root Certification Authorities) See more details in the link above

  3. Add the site in Windows hosts (C:\Windows\System32\drivers\etc\hosts) E.g.: 127.0.0.1 site.test

  4. Add the site in XAMPP conf (C:\xampp\apache\conf\extra\httpd-vhosts.conf) E.g.:

     <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>
    
  5. Restart Apache and your browser and it's done!