Juicer

The Juicer Blog

How Juicer Obtained Free SSL (HTTPS) on Heroku, and How You Can, Too

Posted January 16th, 2015 by Ryan in

    It's possible to get free SSL on Heroku, albiet in somewhat limited fashion. We did this on Juicer. We were looking for an easy way to keep our monthly costs low, while still allowing users to embed their Juicer feeds on https sites (it would throw an error otherwise if we didn't support SSL).

    All of our embed code (JS and CSS) is hosted on assets.juicer.io, which is an Amazon Cloudfront Distribution. We needed this distribution to have an SSL certificate. Additionally, these assets need to talk to our API, which is hosted on heroku. It seemed just about impossible to do it all for free but we pulled it off. Here's what we needed to do:

    Get a free SSL Certificate

    This was the easiest part, but still a pain. We got our free certificate from StartSSL. Their interface is a bit clunky, so it took me a while to get my certificate, but eventually I managed it. Of course, almost immediately after I did it, I discovered this guide from Digital Ocean that walks you through the whole process of getting your certificate. Follow their guide until you get the certificate, then come back to us. Make sure that the domain to which you register the certificate is the same domain that will be hosting your assets.

    Set it up on our Cloudfront Distribution

    First, we had to upload our SSL certificate to AWS via IAM. The easiest way to do this is with the AWS CLI. Install it using Homebrew (if you are on a mac)

    brew install awscli

    You may need to reinitialize your $PATH for the cli to work in your terminal. I generally do it like so:

    source ~/.bash_profile

    Then you should be able to use the CLI to upload your Certificate. Use this command:

    aws iam upload-server-certificate --server-certificate-name YOUR_CERTIFICATE_NAME --certificate-body your/path/to/ssl.crt --private-key your/path/to/private.pem --certificate-chain your/path/to/bundle.pem --path /cloudfront/

    Then, you'll have to login to your AWS, go to cloudfront, and create a new distribution using the CNAME of your assets domain (and make sure to select the correct S3 bucket), and selecting:

    SSL Certificate: Custom SSL Certificate (stored in AWS IAM)
    Custom SSL Client Support: Only Clients that Support Server Name Indication (SNI)
    

    Once that distribution propagates, you should be able to access it over SSL. Test it out by going to https://yourassetdomain.com/an/asset/file.css

    Have the assets hosted on Cloudfront talk to our API via SSL

    Once we got that set up, we thought we were fine and dandy, until we realized that our assets talk to our API, which is hosted on Heroku. Obviously an https connection (our assets) can't talk to our heroku app (non-ssl) without some issues.

    Luckily we discovered that heroku has a wildcard SSL cert. So in our assets we changed our api root from http://api.juicer.io to https://juicer-api.herokuapp.com

    This clearly has some limitations. For example, you can't write to the https herokuapp url, so we had to make sure that our embed assets only did GETs from that url, and used the normal API url for POSTs and PUTs.

    Hope this helps!