DEV Community

loading...
Cover image for Dev Environment SSL

Dev Environment SSL

eclecticcoding profile image Chuck ・2 min read

Have you ever wanted to set up SSL for localhost development on your computer? No? Honestly, as hard as this can be at times, me neither. What changed? Recently, I have been working on a Rails contract project, and the project was set up using SSL. I needed to set up SSL on my Linux computer, so I could collaborate on the project.

Why you may need SSL in development? Check this tweet to find the answer.

So there is one solution Puma-dev, however, even though there is Linux support, the solution and set up never worked for me.

Solution

openssl req -x509 -sha256 -nodes -newkey rsa:2048 -days 365 -keyout localhost.key -out localhost.crt
Enter fullscreen mode Exit fullscreen mode

You will be provided with some information fields to fill in about country key, email, etc. However, you can skip this step. This command will create two new files localhost.key and localhost.crt in the current directory. You can move these files anywhere.

Rails Server and Webpack

Open in your browser: ssl://localhost:3000?key=/path/to/localhost.key&cert=/path/to/localhost.crt. Make sure the certificate and key location is correct in the URL string.

You cannot use the standard rails server as this defaults to http://localhost:3000. Instead, use the following command:

rails s -b 'ssl://localhost:3000?key=/path/to/localhost.key&cert=/path/to/localhost.crt'
Enter fullscreen mode Exit fullscreen mode

Make sure the certificate and key location is correct in the URL string.

FYI: you will have to accept the certificate in your browser the first time you open the URL.

I have included in a ZSH alias, which is much easier to remember:

alias rss="rails s -b 'ssl://localhost:3000?key=/path/to/localhost.key&cert=/path/to/localhost.crt'"
Enter fullscreen mode Exit fullscreen mode

What about Webpack, which I like to start in a separate terminal window? It is actually not that hard and is documented on the repository for webpack: Webpack SSL. Basiclly, we have to enable https in config/webpacker.yml, start webpacker like normal and accept the certificate.

Footnote

This has been fun. Leave a comment or send me a DM on Twitter.

Shameless Plug: If you work at a great company, and you are in the market for a Software Developer with a varied skill set and life experiences, and strives to be better tomorrow than I am today, send me a message on Twitter and check out my LinkedIn.

Credit: Localhost SSL

Discussion (8)

Collapse
mikerogers0 profile image
Mike Rogers ✈️ • Edited

I normally use github.com/puma/puma-dev to handle SSL locally for my rails apps :)

Collapse
eclecticcoding profile image
Chuck Author

I wasn't successful in getting puma-dev set up on Linux, so this was an easy alternative for me.

Collapse
mikerogers0 profile image
Mike Rogers ✈️

Ah I'm on Mac 😅

Collapse
dclements9 profile image
DylanC

Very nice post. Thanks for writing this up.

Have you been using WSL or pure Linux?

Collapse
eclecticcoding profile image
Chuck Author

Pure Linux. I have a System76 laptop which uses POP_OS, a customized Ubuntu derivative.

Collapse
kirkcodes profile image
Kirk Shillingford

Great post. Super useful stuff. Will try this on my next project.

Collapse
qt91 profile image
Thinh Nguyen

Which solution for Windows user?

Collapse
eclecticcoding profile image
Chuck Author • Edited

Thanks for reading. I am not a Windows user so I'm not sure. Might be possible with WSL.

Forem Open with the Forem app