Completely Free, Easy to Setup SSL with Heroku and CloudFlare

Last year, CloudFlare introduced Universal SSL. This is awesome, because it mitigates several annoyances when dealing with SSL:

  1. The cost (of both Heroku’s SSL endpoint addon and the cert itself)
  2. The back and forth interaction with clients that is required to buy and set an SSL certificate
  3. Cert expirations

Of course, this setup won’t work with every project. There are some downsides to not being in complete control of your SSL cert, and sometimes you may not want to have your DNS on CloudFlare. For the most part, though, I can see this being quite useful!

Transfer your DNS to CloudFlare

First of all, we’ll need to transfer the DNS to CloudFlare. If you don’t already have a CloudFlare account, go ahead and create one. Once you’ve created your account, you’ll want to add the domain in question to CloudFlare.

cloudflare add domain

As a side note, I’m going to be setting up a “bare” (without “www”) domain, i.e. “mydomain.com”. If you would like the “www”, the setup is mostly the same, but you’ll need to tweak the DNS a bit as appropriate.

Follow the new domain onboarding process. You’ll want to set up your DNS something like this (of course, you may have other records as well):

cloudflare dns

If you plan to use a CloudFlare page rule to redirect www to non-www (more on this later), you MUST have the www subdomain routed explicitly through CloudFlare.

You’ll also need to log into your domain registrar and redirect the DNS to the addresses specified by CloudFlare. I use NameCheap, and it looks something like this:

namecheap dns

CloudFlare SSL Setup

Under the CloudFlare Settings page for your domain, you’ll need to be sure that the SSL type is set to Full SSL:

full ssl

With this, you’ll be using CloudFlare’s SSL cert between the user and CloudFlare’s servers, and you’ll be using Heroku’s SSL cert between the CF servers and the Heroku servers.

Heroku Domain Name Setup

Within Heroku’s control panel, you’ll need to add your domain name:

heroku domains

Note: Just to reiterate, do not need the Heroku SSL endpoint addon.

Adding a Page Rule (optional)

Next up, I added a CloudFlare Page Rule to redirect www requests to non-www.

page rule

This is a fowarding page rule that redirects any www requests, while preserving the latter part of the URL.

If your application is not forcing all requests to go through SSL, you can also add a page rule here to redirect http requests to https.

The Waiting Game

Now, you’ll need to wait about 24 hours for everything to go through. DNS transfers can take some time, and I believe that CloudFlare specifically imposes a 24 hour wait time for free SSL certs.

If you do all of these steps, and things are looking weird, I’d recommend just waiting about 24 hours before attempting to debug.

That’s it!

Now you can kick back and enjoy your extra $290 per year ($20 x 12 for Heroku’s SSL endpoint and $50 per year for an SSL cert). Spend it all in one place!

I did this mostly from memory, so if I missed any steps please let me know.

If you enjoyed this post, please let me know on twitter @bolandrm, and/or use the form below to subscribe to my mailing list! Thanks for reading!