configuring namecheap domains with heroku

I have just done something similar recently and I think it's what you need. In my case, I need to turn on SSL ACM (Automatic Certificate Management) for my existing heroku app.

First, you need to turn on Automatic Certificate Management to get the SSL certificate from heroku.

  • Check if ACM is on

    $ heroku certs:auto -a [your app name]
    === Automatic Certificate Management is disabled on [your app name]
    
    Note: if you don't have heroku-toolbelt installed, just ignore this step. It's just a check.
    
  • Go to heroku dashboard's Settings

  • Click on 'Configure SSL' button
  • Choose ACM and click continue
  • Click 'Add domain' button if api.mysite.com is not already there.
  • Take note of the 'DNS Target' which is something like api.mysite.com.herokudns.com
  • Check certificate status again

    $ heroku certs:auto -a [your app name]
    === Automatic Certificate Management is enabled on [your app name]
    

Second, you need to login to your namecheap dns zonefile page and add a CNAME.

  • Change CNAME to 'api' record to point to api.mysite.com.herokudns.com (or whatever is there in the DNS Target above)

    TYPE        NAME        VALUE
    A           @           10.10.10.10                         <<< your www ip 
    CNAME       api         api.mysite.com.herokudns.com        <<< you need this one.
    
  • Wait 10 mins

  • Browse to api.mysite.com

So CNAME didn't work for me. In Heroku, I setup my domain as follows: enter image description here

Then in Namecheap, I setup a redirect and an ALIAS WWW Record with your Heroku DNS Target

enter image description here

Trust me if anyone has been struggling with this, try this configuration! Worked for me after many trial and error attempts.


Considering your app is at https://example.herokuapp.com/, and assuming you own the domain www.example.com as stated, follow the following steps to have your app running on your custom domain:

Using the Heroku CLI

  1. Add a custom domain with a subdomain

$ heroku domains:add www.example.com

  1. Add a custom root domain

$ heroku domains:add example.com

On namecheap

After signing into your account

  1. Select Domain List from the left side menu and click the Manage button next to your domain:

enter image description here

  1. Navigate to the Advanced DNS tab and click the Add New Record button in the Host Records section:

enter image description here

  1. To use www.example.com and example.com, the following host records should be created:

URL Redirect Record for @ to forward to http://www.example.com (http://www.yourdomain.tld in the picture)

CNAME Record for www mapped to your Heroku Domain www.example.com.herokudns.com. (www.yourdomain.tld.herokudns.com. in the picture)

enter image description here

  1. (Optional) To use any other subdomain, like app.example.com and example.com, you should create the following records:

URL Redirect Record for @ to forward to http://app.example.com (http://app.yourdomain.tld in the picture)

CNAME Record for app mapped to your Heroku Domain app.example.com.herokudns.com. (app.yourdomain.tld.herokudns.com. in the picture)

enter image description here

That's it! Now your app should be running at www.example.com.

For more information on the namecheap side you can check this link.