It is a good idea to have your development environment be as close to your production environment as possible, without getting in your way. For example setting up SSL in your development environment helps you to fix mixed content warnings so there are no surprises when you move to staging or production, and doesn't train you to click through SSL warnings in your browser.
This walkthrough will show you how to create, trust, and install a self signed certificate in your development web server, and setup your DNS to redirect all your development traffic back to your development box.
Brew Nginx Php
Prepare the System
Assumptions: you are using the Bash shell, have admin rights to your computer, and are using Firefox, Chrome, or Safari. Ensure that OpenSSL, Passenger, Dnsmasq, and optionally Nginx or Apache are installed.
Follow these instructions to install Passenger; you may have to adjust the settings to your desired config, for example using Passenger Enterprise or OSS.
|Red Hat, CentOS, Fedora, Amazon Linux, Scientific Linux|
Software versions used in this article:
Use HTTPS and Custom Domains for Local Development with Docker Nginx. December 11, 2020. One of the goals while developing a web application on your local machine is to try to closely mimic the production environment into which your application will eventually be deployed. Brew link pcre brew install nginx Once the installation is complete, you can type the following command to start NGINX: sudo nginx The NGINX config file can be found here: /usr/local/etc/nginx. Install your RubyGems with gem and their dependencies with brew. “To install, drag this icon” no more. Homebrew Cask installs macOS apps, fonts and plugins and other non-open source software. $ brew install-cask firefox. Making a cask is as simple as creating a formula. Brew unlink php brew link -overwrite -force [email protected] Now, for each version update the php-fpm you will need a unique port. Change the ports of each php-fpm to match its php version number.
To check the versions of the packages you have installed you can use the following commands:
|Application||Version||Linux Command||Mac Command|
When setting up a development environment with SSL it is better practice to use a self signed certificate, and leave your real certificate/key pair somewhere safe and encrypted, preferably on offline storage like a thumb drive in a safe place. In order to create a certificate that works and makes development convenient, you need to edit the
On macOS this is located at
/usr/local/etc/openssl/openssl.cnf or if it isn't there you can copy
/usr/local/etc/openssl/openssl.cnf.default to that path as a starting point, and edit from there.
On linux it may be in one of the following locations:
The changes you need to make are as follows:
uncomment these lines, they enable needed functionality:
comment out these lines, they add nothing and get in the way:
and modify the following values as indicated:
modify the following values as desired:
specify all your development domains
add the following on a new line under
keyUsage = nonRepudiation, digitalSignature, keyEncipherment:
Using a separate top level domain (TLD) for development allows you to access the production site at the proper url, while having easy access to your development sites. This guide will use
.dev and will go into more detail about how to set this up below in the DNS section.
While no browser accepts wildcard certificates for entire top level domains, if you are developing a large number of micro services or sites that share a domain and have added a wildcard for the domain to the list of alt names in the certificate, then you can simply add more sites to your setup without changing your certificate and by using mass deployment you don't have to modify your web server or app server configs to spin up another site, simply create it in the correct directory.
A working sample is provided below
Replace occurrences of example.dev with your own domain:
Add CA.pl to your path:
|Red Hat, CentOS, Fedora, Amazon Linux, Scientific Linux|
Brew Nginx Install
Create Your Certificate Authority
The changes you made to
openssl.cnf will allow the certificates produced with your CA to be accepted by modern browsers. You can hold enter/return to accept the default values for each question you get asked by the script, with the exception of the passphrase which must be at least 4 characters long.
Trust your new certificate authority root certificate:
The previous command will have created a new subdirectory called demoCA, you’ll need to install the certificate authority root certificate from the new demoCA dir into your system keychain (and/or Firefox) to prevent your browser from warning you about broken SSL.
|macOS with Safari or Chrome:|
|Debian, Ubuntu with Chrome:|
|Fedora 19+, RHEL/CentOS 7+ Chrome:|
|Any OS with Firefox:|
|Any *nix OS with Curl:|| Pass the |
create the new server certificate/key pair:
You can accept all the defaults, as you already customized them earlier.
Brew Nginx Restart
Configure Passenger + Nginx
example.dev with your domain, and set the paths to your app and the certificate/key pair you created:
Generate the Diffie-Hellman parameters file using this command:
Brew Nginx Php Fpm
Since you need the domain you visit in your browser to match the SSL certificate, you still need to direct all your development traffic back to localhost. One option is to edit your hosts file (located at
/etc/hosts) and add entries to redirect each development domain back to your computer. That solution works*, but doesn't scale well. Next I'll describe setting up Dnsmasq & configuring your own top level domain in order to save having to edit the hosts file repeatedly.
*Note some older versions of macOS actually ignored entries in the hosts file for new top level domains (for example:
.dev stopped working once Google started responding to DNS queries for that top level domain. Google owns
.dev, but they've stated it's for internal use only, so you're unlikely to break anything if you use it, unless you work for Google), which makes using a DNS resolver like Dnsmasq all the more useful, because you workaround that bug.
|In Ubuntu 12.10+ use NetworkManager's Dnsmasq:|
Brew Nginx Stop
Now if you restart your webserver, SSL should be working and your browser shouldn't complain when you visit your app over https.