How To Setup SSL Certificate on Heroku (Namecheap SSL)

How To Setup SSL Certificate on Heroku (Namecheap SSL)How To Setup SSL Certificate on Heroku (Namecheap SSL)We recently setup SSL on Resumonk.com which is a Rails 3 application running on Heroku. Here is a quick summary of the entire process and hope it saves you some time when you are looking to enable SSL for your Rails application on Heroku.What is SSL and why do you need it?SSL or Secure Sockets Layer is protocol for establishing a secure (encrypted) link between server and the browser. If your app or website is using a database for storing and retrieving user generated information, you need to get SSL to ensure that the data is transmitted securely and to ensure that it is less vulnerable to tampering or forgery.Also, displaying SSL Seal helps improve trust and it tells your customers that their data is protected.Adding SSL certificate to your Heroku applicationTo use SSL for an app hosted on Heroku, youll need to enable SSL add-on that Heroku provides. This add-on costs $20/mon th. Please keep in mind that this is a recurring expense and it does elend include the cost of the SSL certificate itself. Youll need to buy that separately.Note If you dont plan to use a custom domain then you can use the free SSL that Heroku provides (https//myapp.herokuapp.com).Here are the steps that you need to follow to add an SSL certificate to you app Purchase SSL certificateGenerate private key and CSRProvision the Heroku SSL add-onUpload the key and certificate to HerokuUpdate your DNS settingsUpdate your app code to redirect https instead of httpSTEP 1 Purchase SSL certificateWe bought a RapidSSL certificate from Namecheap.Note RapidSSL certificate ($10/year) is only valid for the root domain. If you need to secure all your subdomains (blog.domain.com or labs.domain.com), youll need to buy a wildcard SSL certificate.STEP 2 Generate Private key and CSRBefore you can activate your SSL certificate, youll need to provide a CSR (Certificate Signing Request) to the SSL provide r.The first step to generating a CSR is to create a private key. You can use openssl for generating a private key.On a Mac (install Homebrew first if you dont have it installed), open up Terminal.app and use the following command.brew install opensslOn Ubuntu, you can do sudo apt-get install opensslOnce youve installed openssl, use this command to generate a private key openssl genrsa -des3 -out server.reisepass.key 2048Youll be asked to enter a password.Enter pass phrase for server.pass.keyVerifying - Enter pass phrase for server.pass.keyThen run this command openssl rsa -in server.pass.key -out server.keyThe above command will create a file called server.key in your working directory. Well need this key to generate the CSR.openssl req -nodes -new -key server.key -out server.csrThis is the command that will generate a CSR for you. Youll be prompted to enter the following details Country Name 2 Digit code. This link has a list of all accepted country codes ssl.com/csrs/country_code sState and Locality (e.g. California, New Delhi etc)Organization anthroponym (Legal/Registered Name of your company e.g. Abhayam Software Solutions Pvt. Ltd)Organizational Unit is whichever branch of your company is ordering the certificate (e.g. Marketing Department, Product Development, Software Lab)Common Name This is the most important part so be extra careful. Common Name is the domain name that you want the CSR (and the SSL certificate) for. Please note that you need to specify which web-adresse you want www or non-www. You cannot set the common name to example.com and expect it to secure www.example.com.For Resumonk, our main URL has www in it and the root url (non-www) redirects to the www url, So the common name we specified was www.resumonk.comThe previous command would have generated a file name server.csr. Open up that file in a text editor and copy everything inside the BEGIN/END block.NOTE The following step is only applicable for Namecheap and may vary for other SSL providers.zugang to your Namecheap account (or any other SSL provider) and navigate to your SSL dashboard Your Account - Manage SSL Certificates and click the Activate link next to your SSL certificate.Paste the CSR code that you copied into the text box and fill in the rest of your details. For server name, choose Apache 2.Important Note You will have to choose an approver email from the list that is shown. Youll have options like emailprotected, emailprotected, emailprotected etc. If you dont have any of these email addresses created, youll need to do that before proceeding since Namecheap will send our a verification email to the approver email address.Once you save all the details, youll receive a verification email from Namecheap (to the approver email that you specified earlier) asking you to verify that you want to active the SSL certificate.After you verify, Namecheap will send you an email with 2 certificates WEB SERVER CERTIFICATE and INTERMEDIATE CA. Copy both these ce rtificates one after the other into a separate file and save it as server.crt.Important Note INCLUDE the BEGIN CERTIFICATE/END CERTIFICATE lines and ensure that there are 5 dashes to either side of BEGIN CERTIFICATE and END CERTIFICATE. Do not add any extra whitespaces or line breaks.The final file should look something like this - BEGIN CERTIFICATE- encoded data- END CERTIFICATE- - BEGIN CERTIFICATE- encoded data- END CERTIFICATE- STEP 3 Provision the Heroku add-onNow you need to provision Herokus add-on. Open up your terminal and cd to your project directory. Then give this command heroku addonsadd sslendpointSTEP 4 Upload the key and certificate to HerokuNow add the certificate and private key to Herokuheroku certsadd server.crt server.keyHere the server.crt file is the certificate we created in the last step and server.key is the private key we generated in Step 1.If everything worked as it should, youll see a screen likeAdding SSL Endpoint to example... doneexample now served b y fuscia-1212.herokussl.com.This is the new endpoint URL at which your domain should point.STEP 5 Update your DNS settingsLogin to your domain management panel.If you already have a CNAME record pointing to myapp.heroku.com, change it to the new URL endpoint (fuscia-1212.herokussl.com).If you dont have a CNAME record, youll need to add your custom domain to Heroku first. To do that, follow this guide.Now once the DNS change has propagated (this can take a while), youll have SSL activated on your website. Navigate to https//mydomain.com and youll see that the address bar turns green and shows a lock symbol.Additional Step for Rails apps STEP 6 Tell Rails to use the https URL.Youll notice that right now, although you have got your SSL certificate to work, you can still access your app without SSL (http//mydomain.com). You need to tell Rails to use the SSL version by default.Doing this is really easy, open up production.rb file and add this line config.force_ssl = trueThats it. Now if you try access your website without ssl (http//mydomain.com), Rails will do a 301 (permanent redirect) to the https version.One final thing to keep in mind is that if you are using social sign-in (omniauth), you might need to change the callback URL (especially for Google+).Also check your code for places where you have referenced the absolute URL and change it to https (This usually happens in transactional emails (welcome, password-reset etc) that you send out).Thats all there is to adding a SSL certificate to your Heroku-hosted app. Let me know if you have any questions.PS Resumonk can help you create a beautiful and professional resume in minutes. Try it out and do let me know how we can improve it further.