HTTPS for local dev

---

Increasingly it is becoming necessary to develop software in a secure environment in order that there are very few changes when deploying to production. Recently Facebook changed their policies for apps/sites that use Facebook login which requires the use of an HTTPS URL for the OAuth redirect URL. So if you want to use the users application with a OAuth provider such as Facebook, securing your communication to the local development environment will be necessary.

On order to create a secure environment, we need to have a trusted SSL certficate installed in our Docker application.

Let's Encrypt

The official line from Let’s Encrypt is:

For local development section ... The best option: Generate your own certificate, either self-signed or signed by a local root, and trust it in your operating system’s trust store. Then use that certificate in your local web server. See below for details.

See letsencrypt.org - certificates-for-localhost

Valid HTTPS Certificates For Localhost:

mkcert is a simple by design tool that hides all the arcane knowledge required to generate valid TLS certificates. It works for any hostname or IP including localhost. It supports macOS, Linux, and Windows, and Firefox, Chrome and Java. It even works on mobile devices with a couple manual steps.

Visit this blog post for more info.

Configure Docker

After installing a trusted TLS certificate, configure your docker installation. We are going to configure an nginx reverse-proxy server. This makes sure that it does not interfere with our traefik configuration that is reserved for production environements.

These are the places that you should configure to secure your local environment.

certs

Take the certificates that you generated and place them in a folder called certs on the projects root folder. Assuming that you registered your local hostname as my-dev-env.local, the certificates you will put in the folder should have the names my-dev-env.local.crt andmy-dev-env.local.key.

Add a local nginx service

Add the nginx-proxy service. in local.yml

    nginx-proxy:
      image: jwilder/nginx-proxy:alpine
      container_name: nginx-proxy
      ports:
        - "80:80"
        - "443:443"
      volumes:
        - /var/run/docker.sock:/tmp/docker.sock:ro
        - ./certs:/etc/nginx/certs
      restart: always
      depends_on:
        - django

Link the nginx-proxy to django through environmental variables.

django already has an .env file connected to it. Add the following variables. You should do this especially if you are working with a team and you want to keep your local environmen details to yourself.

    # HTTPS
    # ------------------------------------------------------------------------------
    VIRTUAL_HOST=my-dev-env.local
    VIRTUAL_PORT=8000

The services run behind the reverse proxy.

config/settings/local.py

# You should allow the new hostname. :
ALLOWED_HOSTS = ["localhost", "0.0.0.0", "127.0.0.1", "my-dev-env.local"]

Rebuild your docker application. :

 $ docker-compose -f local.yml up -d --build

Go to your browser and type in your URL bar https://my-dev-env.local

.gitignore ***

Add certs/* to the .gitignore file. This allows the folder to beincluded in the repo but its contents to be ignored.

This configuration is for local development environments only. Do not use this for production since you might expose your localrootCA-key.pem.