Heroku Custom Domain with Cloudflare
by Daniel Kehoe
Last updated 27 January 2017
Here's how to set up Heroku with a custom domain using Cloudflare. Heroku provides low cost, easily configured Rails application hosting. Cloudflare provides domain name service plus SSL security at no cost.
This guide is a supplement to my book series, Learn Ruby on Rails. It is said to be, "The best Rails book for beginners." Get the first book in the series for free if you'd like to get a solid understanding of Rails.
Before You Start
Your application will be available at a URL such as http://myapp.herokuapp.com/.
You'll need to create an account with Cloudflare. Cloudflare provides domain nameservers and SSL security for free.
Before you start, you need to register your domain name with Namecheap or another domain register. Initially, the domain registrar will configure your domain to use a "parked" landing page using the registrar's own nameservers. You'll change the nameserver records at your domain registrar to point to the Cloudflare nameservers.
What You Need to Know
You'll start by checking existing DNS records with Cloudflare. You'll set the nameserver records at your domain registrar to point to the Cloudflare nameservers. Then you'll create DNS records at Cloudflare to route requests to the application running on Heroku. Finally, you'll set Heroku to respond to the custom domain.
Sign in to your Cloudflare account. Select "+ Add Site" from the navigation bar.
Enter a domain name and click "Begin Scan." After a few seconds, when status message shows "Scan Complete," click "Continue Setup."
Cloudflare will display existing DNS records if you have already set up domain name records elsewhere.
Change the records (or add) to point to your Heroku application. You will need to change or create two CNAME records pointing to your
| CNAME | www | myapp.herokuapp.com |
| CNAME | myapp.com | myapp.herokuapp.com |
You should use the root level domain
myapp.com as your main domain, but also point the www version of the domain at your Heroku application at
Then click "Continue" and select the "Free Website" Cloudflare plan.
Transfer your DNS to CloudFlare
Next you'll need to set the nameserver records at your domain registrar for the Cloudflare nameservers. Cloudflare shows the nameserver details you will need.
Sign in to your domain registrar account. If you are using Namecheap, find your domain and click "Manage." Look for the "Nameservers" section, choose "Custom DNS," and enter the Cloudflare nameservers. Click the checkmark to set the new nameserver records.
Here is the nameserver section of the dashboard at Namecheap:
It may take a few seconds or as long as 48 hours for the DNS records to propagate across the Internet.
Check the dashboard at Cloudflare. The status may be "Pending." You can click the button to "Recheck Nameservers."
Eventually the status will be "Active" and you will get a confirmation email from Cloudflare.
Redirect with a Page Rule
Cloudflare lets you redirect visits from the
www subdomain to the root domain. Use the "Page Rules" option.
Click the "Create Page Rule" button. Fill in the form for "If the URL matches" with
www.myapp.com/* (notice the asterisk at end of the URL string). Click "Add a Setting" and select "Forwarding URL" and enter status code "301 - Permanent Redirect." Then enter the destination URL
http://myapp.com/$1 (notice the $1 at the end of the string). Click the button "Save and Deploy." Once saved, you should be able to access your domain by both
Heroku Domain Name Setup
Finally, you need to set Heroku to accommodate your custom domain. Heroku provides a document Custom Domain Names for Apps with details. Your Heroku account must be verified by providing a credit card for billing before you can add a custom domain. You can set up a custom domain from the command line or in the Heroku Dashboard.
$ heroku domains:add myapp.com Adding myapp.com to myapp... done
You can confirm the domain is added by checking "Domains and certificates" under "Settings" in the Heroku Dashboard.