XAMPP serves your site on http://localhost out of the box. That is enough for a form or a PHP page. It is not enough when the browser starts blocking features that need a secure context.
Camera, microphone, service workers, and some cookies expect HTTPS. If you only test on HTTP, those pieces look broken even when the code is fine. Putting SSL on the local Apache server closes that gap.
This is the same setup I use on my machine, and the same one I walk through on the Splendid Edge Technologies YouTube channel. Read this if you want the files. Watch the video if you want the clicks.
What you need
- XAMPP installed on Windows. Default path is
C:\xampp. - Apache able to start from the XAMPP Control Panel.
- A project folder already living in
C:\xampp\htdocs.
Mac and Linux XAMPP use the same Apache settings. Only the folder names change.
1. Confirm Apache is running
Open the XAMPP Control Panel. Start Apache. If the module turns green, you are fine. If it fails, something else is already on port 80. Close Skype, IIS, or another Apache, then try again.
Leave MySQL off if you do not need a database for this test. HTTPS only cares about Apache.
2. Turn on the SSL module
Open C:\xampp\apache\conf\httpd.conf in any text editor. Search for these two lines and remove the # in front if it is there:
LoadModule ssl_module modules/mod_ssl.so
Include conf/extra/httpd-ssl.conf
Save the file. Do not restart yet. The SSL config still points at certificate files that may not exist, or that still have placeholder names.
3. Make a certificate
XAMPP already includes OpenSSL. You do not need to install anything extra.
Open Command Prompt and run:
cd C:\xampp\apache
makecert
On many XAMPP builds, makecert.bat lives in C:\xampp\apache. It asks a few questions (country, city, name). For a local box you can type anything. Common Name is the one that matters. Use localhost.
If makecert is missing, call OpenSSL yourself:
cd C:\xampp\apache
bin\openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout conf\ssl.key\server.key -out conf\ssl.crt\server.crt
When it asks for Common Name, type localhost again. That is the name you will type in the browser.
You should now have two files:
C:\xampp\apache\conf\ssl.crt\server.crtC:\xampp\apache\conf\ssl.key\server.key
If those folders do not exist, create them, then run the command again.
4. Point Apache at the files
Open C:\xampp\apache\conf\extra\httpd-ssl.conf. Find the block that starts with <VirtualHost _default_:443>.
Set these four values. Keep the quotes.
DocumentRoot "C:/xampp/htdocs"
ServerName localhost:443
SSLCertificateFile "conf/ssl.crt/server.crt"
SSLCertificateKeyFile "conf/ssl.key/server.key"
If your project lives in a subfolder, leave DocumentRoot on htdocs. You will still open https://localhost/your-folder.
Also confirm the file contains:
Listen 443
SSLEngine on
Save it.
5. Restart Apache
Back in the XAMPP Control Panel: Stop Apache, then Start. If the light stays green, the config loaded.
If it dies immediately, click Logs → Apache (error.log). The two usual causes:
- The
.crtor.keypath is wrong. - Something else already bound port 443 (another Apache, IIS, or a VPN tool).
On Windows you can check who owns 443 with:
netstat -ano | findstr :443
6. Open the site on HTTPS
In the browser go to:
https://localhost/
Or https://localhost/your-folder/.
Chrome and Edge will almost always say “Your connection is not private.” That is the self-signed certificate talking. The page is still encrypted. The browser just does not trust the issuer because you signed it yourself.
Click Advanced → Proceed to localhost. Do this only for a machine you own.
Optional: stop the warning
Two clean options.
Trust the file on Windows. Double-click server.crt → Install Certificate → Local Machine → Place all certificates in the following store → Trusted Root Certification Authorities. Restart the browser.
Use mkcert. It writes a local CA the browser already likes. Fine if you do this every week. Not required for a one-off test.
Do not email that .key file to anyone. It only belongs on your PC.
Optional: a named local host
If you want https://readlux.test instead of localhost, add this line to C:\Windows\System32\drivers\etc\hosts as Administrator:
127.0.0.1 readlux.test
Create the certificate again with Common Name readlux.test, then add a 443 virtual host for that name in httpd-vhosts.conf. Restart Apache.
Quick checks when it fails
- Page never loads. Apache is not listening on 443. Recheck
Listen 443and the Control Panel. - Not private warning you cannot click through. You opened
https://127.0.0.1while the cert sayslocalhost. Use the same name you typed as Common Name. - Mixed content. The HTML still points at
http://scripts or images. Change those URLs or use root-relative paths. - Old page after a restart. Hard refresh once. Cached HTTP redirects stick around.
What this is not
This certificate is for your laptop. It will not secure a live domain. When the project goes online, use the host’s SSL or Let’s Encrypt. Do not upload the XAMPP server.key to a shared host.
Watch it instead
If a config line is hard to find, the screen recording is easier. I keep the XAMPP, PHP, and vanilla JavaScript walkthroughs on YouTube:
Splendid Edge Technologies on YouTube
Subscribe there if you want the next setup videos — PDF in JavaScript, a small video-call page, and the other local-server notes I publish from Etche.
Questions people ask
Do I need a paid certificate for localhost?
No. A self-signed file is enough for development.
Will this break http://localhost?
No. Port 80 still works. You now have both.
Can I use this on a phone on the same Wi-Fi?
Only if the phone trusts the certificate and you open the PC by name or IP. That extra step is messy. Keep HTTPS tests on the same machine unless you have a reason.