Setup Local SSL

In development security is obviously an important variable to the whole equation but it can be difficult to understand the many layers of security that take place from the request of a client to the delivery from a server. One of those layers that you may be aware of but unfamiliar with is Secure Sockets Layer ( SSL); predecessor to Transport Layer Security (TLS). Essentially SSL is defined as:

the standard security technology for establishing an encrypted link between a web server and a browser. This link ensures that all data passed between the web server and browsers remain private and integral.

So if you are transferring sensitive data from a browser to a web service then in order to prevent data hijacking you must send the sensitive data through a secure socket (essentially a path that thieves and bandits can’t loot your messenger through on his way to the Emerald city where he will make your request). I’m not claiming to be an expert on this subject but in the development process it can be difficult to established said connection on a local environment so I wanted to provide a short tutorial of my successful attempt.

Environment Details

The process is similar no matter your environment so there still be some helpful nuggets here, but for the most part my instructions are based on the following:

Windows OS
XAMPP Version 1.8.2
Using VHosts (virtual host)

1) Create SSL Cert & Public Key

The first thing we need to do is create a SSL Certificate the will contain our public key and a server private key. Fortunately XAMPP already provides a couple things. 1) A pre-made solution which is included in everyone’s instance, so not the most secure. 2) A script for generating a brand new Certificate and public key. To execute this script/batch file, do the following:

From your Windows Command prompt or equivalent (I use Console2), c hange d irectory to your apache installation (my installation is in dropbox so may differ from typical installations:

cd c:\xampp\apache //Enter the path to your installation

From there you should see/run a .bat script called makecert:

NOTE: You may need to open this in your IDE or text editor to edit some path values, I had an issue with the OPENSSL_CONF set to the wrong path. Also if you want to set a new name for your certificates and key you can do that here. Once the script is as you would like it to be then run it:

makecert //that was easy

This will begin to walk you through generating the certificate and key so fill in each value accordingly. The value that matters the most is the “common_name”, this MUST be the domain address that you are trying to secure. So if I’m developing a site using a virtual host like, myproject.dev then common_name = myproject.dev

Enable Port 443 for Vhost

Usually around line 19 you will find the line you need to add or uncomment

NameVirtualHost *:80 // Around line 19
NameVirtualHost *:443

Also make a default for each port

<VirtualHost *:80> // Port 80
    DocumentRoot "c:/xampp/htdocs"
    ServerName localhost
</VirtualHost>
<VirtualHost *:443> // Port 443
    DocumentRoot "c:/xampp/htdocs"
    ServerName localhost
    ServerAlias localhost

SSLEngine On // notice we turn on SSL
    SSLCertificateFile "conf/ssl.crt/server.crt" // path to your SSL certificate
    SSLCertificateKeyFile "conf/ssl.key/server.key" //path to your private key

<Directory "c:/xampp/htdocs">
        Options Indexes FollowSymLinks Includes ExecCGI
        AllowOverride All
        Require all granted
    </Directory>
</VirtualHost>

Now that you have a vhost setup for a non-secure URL, apache will use your project’s directory. Now we just need to direct that url to HTTPS by updating your .htaccess file

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On

RewriteCond %{SERVER_PORT} !^443$ // Add these 2 lines
RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]

RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

Add Certificate and Public Key to Vhost & Require SSL

As you may have noticed from the previous step there a couple things happening when setting up a virtual host to use SSL

<VirtualHost myproject.dev:443> // Individual Vhost set to use port 443
   DocumentRoot "c:/xampp/htdocs/myproject.dev"
   ServerName myproject.dev
   ServerAlias myproject.dev

SSLEngine On // notice we turn on SSL
   SSLCertificateFile "conf/ssl.crt/myproject.crt" // path to your SSL certificate
   SSLCertificateKeyFile "conf/ssl.key/myproject.key" // path to your private key

<Directory "C:/xampp/htdocs/myproject.dev">
       Options Indexes FollowSymLinks ExecCGI Includes
       Order allow,deny
       AllowOverride All
       Allow from all
       SSLRequireSSL
   </Directory>
</VirtualHost>

Force Redirect http:// (:80) to https:// (:443)

This is not a requirement to your HTTP url to HTTPS but it is likely necessary considering that as a secure page you cannot load insecure content. This includes images, css, js, etc. If you are including/referencing resources they must be retrieved via HTTPS as well. Not to mention, what good is your site if the user forgets the “s” and sees a broken page, they won’t assume its their fault, they will assume your site is broken. So to start, below your :443 virtual host we need to make an :80 version (this way it exist to apache so that once it reaches your root directory you can THEN use .htaccess forces the HTTPS.

<VirtualHost myproject.dev:80> // Individual Vhost set to use port 80
   DocumentRoot "c:/xampp/htdocs/myproject.dev"
   ServerName myproject.dev
   ServerAlias myproject.dev

### Conclusion

If this is working properly you should see the green padlock in your address bar that will indicate a secure connection:

If you have any questions along the way feel free to post them and I will answer them or update the article accordingly the best I can. Again I’m no expert but I was able to get this working after many hours of research and figured this would help save you some time. If you would like I’ve included resources below as well

### Resources

Here is a list of some of the resources I used to help me through this setup process

- [Rob’s Notebook – XAMPP: SSL Encrypt the Transmission of Passwords with https](http://robsnotebook.com/xampp-ssl-encrypt-passwords "Rob's Notebook - XAMPP: SSL Encrypt the Transmission of Passwords with https")
- [Leonard Austin – How to Enable SSL on Xampp with Vhosts](http://www.leonardaustin.com/blog/technical/how-to-enable-ssl-on-xampp-with-vhosts/ "Leonard Austin - How to Enable SSL on Xampp with Vhosts")
- [StackOverflow – How do I use https (SSL) in XAMPP while using virtual hosts](http://stackoverflow.com/questions/16430574/how-do-i-use-https-ssl-in-xampp-while-using-virtual-hosts "StackOverflow - How do I use https (SSL) in XAMPP while using virtual hosts")

* * *

Disqus Comments

We were unable to load Disqus. If you are a moderator please see our [troubleshooting guide](https://docs.disqus.com/help/83/).

G

Start the discussion…

Comment

###### Log in with

###### or sign up with Disqus  or pick a name

### Disqus is a discussion network

- Don't be a jerk or do anything illegal. Everything is easier that way.

[Read full terms and conditions](https://docs.disqus.com/kb/terms-and-policies/)

This comment platform is hosted by Disqus, Inc. I authorize Disqus and its affiliates to:

- Use, sell, and share my information to enable me to use its comment services and for marketing purposes, including cross-context behavioral advertising, as described in our [Terms of Service](https://help.disqus.com/customer/portal/articles/466260-terms-of-service) and [Privacy Policy](https://disqus.com/privacy-policy), including supplementing that information with other data about me, such as my browsing and location data.
- Contact me or enable others to contact me by email with offers for goods or services
- Process any sensitive personal information that I submit in a comment. See our [Privacy Policy](https://disqus.com/privacy-policy) for more information

Acknowledge I am 18 or older

- [Favorite this discussion](https://disqus.com/embed/comments/?base=default&f=divtruth&t_i=30%20http%3A%2F%2Fdivtruth.com%2F%3Fp%3D30&t_u=https%3A%2F%2Fdivtruth.com%2Fsetup-local-ssl%2F&t_e=Setup%20Local%20SSL&t_d=Div%20Truth%20%7C%20Setup%20Local%20SSL%20-%20Div%20Truth&t_t=Setup%20Local%20SSL&s_o=default# "Favorite this discussion")

- ## Discussion Favorited!

Favoriting means this is a discussion worth sharing. It gets shared to your followers' Disqus feeds, and gives the creator kudos!

[Find More Discussions](https://disqus.com/home/?utm_source=disqus_embed&utm_content=recommend_btn)

[Share](https://disqus.com/embed/comments/?base=default&f=divtruth&t_i=30%20http%3A%2F%2Fdivtruth.com%2F%3Fp%3D30&t_u=https%3A%2F%2Fdivtruth.com%2Fsetup-local-ssl%2F&t_e=Setup%20Local%20SSL&t_d=Div%20Truth%20%7C%20Setup%20Local%20SSL%20-%20Div%20Truth&t_t=Setup%20Local%20SSL&s_o=default#)

- Tweet this discussion
  - Share this discussion on Facebook
  - Share this discussion via email
  - Copy link to discussion

- [Best](https://disqus.com/embed/comments/?base=default&f=divtruth&t_i=30%20http%3A%2F%2Fdivtruth.com%2F%3Fp%3D30&t_u=https%3A%2F%2Fdivtruth.com%2Fsetup-local-ssl%2F&t_e=Setup%20Local%20SSL&t_d=Div%20Truth%20%7C%20Setup%20Local%20SSL%20-%20Div%20Truth&t_t=Setup%20Local%20SSL&s_o=default#)
  - [Newest](https://disqus.com/embed/comments/?base=default&f=divtruth&t_i=30%20http%3A%2F%2Fdivtruth.com%2F%3Fp%3D30&t_u=https%3A%2F%2Fdivtruth.com%2Fsetup-local-ssl%2F&t_e=Setup%20Local%20SSL&t_d=Div%20Truth%20%7C%20Setup%20Local%20SSL%20-%20Div%20Truth&t_t=Setup%20Local%20SSL&s_o=default#)
  - [Oldest](https://disqus.com/embed/comments/?base=default&f=divtruth&t_i=30%20http%3A%2F%2Fdivtruth.com%2F%3Fp%3D30&t_u=https%3A%2F%2Fdivtruth.com%2Fsetup-local-ssl%2F&t_e=Setup%20Local%20SSL&t_d=Div%20Truth%20%7C%20Setup%20Local%20SSL%20-%20Div%20Truth&t_t=Setup%20Local%20SSL&s_o=default#)

Be the first to comment.

[Load more comments](https://disqus.com/embed/comments/?base=default&f=divtruth&t_i=30%20http%3A%2F%2Fdivtruth.com%2F%3Fp%3D30&t_u=https%3A%2F%2Fdivtruth.com%2Fsetup-local-ssl%2F&t_e=Setup%20Local%20SSL&t_d=Div%20Truth%20%7C%20Setup%20Local%20SSL%20-%20Div%20Truth&t_t=Setup%20Local%20SSL&s_o=default#)

live.rezync.com

# live.rezync.com is blocked

This page has been blocked by an extension

- Try disabling your extensions.

ERR\_BLOCKED\_BY\_CLIENT

Reload

This page has been blocked by an extension

pippio.com

# pippio.com is blocked

This page has been blocked by an extension

- Try disabling your extensions.

ERR\_BLOCKED\_BY\_CLIENT

Reload

This page has been blocked by an extension