Using HTTPS is extremely important for your web applications. It has become even more important now that browsers like Chrome and services like Google are starting to shame websites that don't use it. If you are receiving data from users (e.g. emails, password, credit card information), you must use HTTPS if you want to provide them with some peace of mind.

If you want to learn more about HTTPS as a technology, you can read this.

This article shows how to enable HTTPS for your Flask applications running in a Linux server using nginx.

The domain name

The first step is to get a domain name. I recommend using Namecheap because they have good prices and generally seem like a nice bunch.

Decide on a domain name that you like, and purchase it! You can (or should) use WHOIS protection so your details are not available to the public.

Setting up Cloudflare

Once you've purchased the domain, we can set up Cloudflare.

Cloudflare is a service that sits in front of your domain. Whenever a user tries to access your domain, they will first go through Cloudflare. This means Cloudflare can do things like protect against denial of service attacks, speed things up via caches, and more.

One of the things it can do it allow you to use SSL by providing an SSL certificate if you use them.

When you log into Namecheap, you can manage your existing domain. Here you can change DNS settings. You'll need to use Cloudflare's DNS servers for Cloudflare to work.

Setting up DNS

  1. Log into Cloudflare.
  2. Select your domain.
  3. Go to the DNS tab in the menu.
  4. Halfway down the page, you'll see a section called "Cloudflare Nameservers".
  5. Keep the page open and log into Namecheap.
  6. Select "Manage" your domain.
  7. Under the "Domain" tab, find the "Nameservers" section.
  8. In the dropdown, select "Custom DNS".
  9. Enter there the addresses found in the Cloudflare page, one per field.

What we've done now is told Namecheap that we won't be using them at all for any domain-level traffic. Instead, we're going to use Cloudflare's servers for that.

We must now go back to the page we had open in Cloudflare, and in the "DNS Records" section, we will add our server.

Add an A record. The Name must be equal to your domain (e.g. jslvtr.com). The IPv4 Address must be equal to your server's IP address (which you can get from DigitalOcean if you are hosting there). Leave the TTL as Automatic, and you're ready to go!

You should now be able to access your server at http://yourdomain.tld. For this to work, it may take up to a few hours while DNS caches expire and changes propagate.

If you want to enable http://www.yourdomain.tld, all you have to do is add another record: CNAME, Name should be www and Domain name should be your domain name (e.g. jslvtr.com).

We still don't have HTTPS enabled though. Let's do that now.

Getting an SSL certificate

Before setting up for HTTPS, make sure your domain and associated web application works well. Access your domain name, and test the app using Postman if necessary.

When you're confident it is all working, go to the Cloudflare page and select the "Crypto" tab in the menu.

You may have to access this page using Google Chrome, as other browsers may not be able to generate the SSL certificates.

In the section "Origin Certificates", press the "Create Certificate" button. Here, you should see your domain name and a validity period (by default, 15 years). Press "Next", and you'll see your certificate created.

Don't close the window, and open a console that lets you log in to your server where you are hosting the web application.

Create a directory (e.g. /var/www/ssl/) where to store your SSL certificate. Here, create two files:

  • yourdomain.tld.key
  • yourdomain.tld.pem

In them, paste each of the contents of the fields in Cloudflare as they suggest in their instructions.

Setting up nginx

Now that you've got the SSL certificate (signed by Cloudflare) and you've created the files in your server, we are ready to tell Nginx to use them to encrypt the communications with the clients.

All we have to do is go to the web application's nginx config file (which currently might look like this):

server {  
    listen 80;

    server_name localhost;
    .
    .
    .

And we are going to change those lines to the following:

server {  
    listen 443 default_server;

    server_name jslvtr.com; # Replace with your domain

    ssl on;
    ssl_certificate /var/www/ssl/yourdomain.tld.pem;
    ssl_certificate_key /var/www/ssl/yourdomain.tld.key;

At the bottom of the file, we are also going to add another block, to make sure that port 80 is still accessible (that is, your site without HTTPS):

server {  
    listen 80;
    server_name jslvtr.com;
    rewrite ^/(.*) https://jslvtr.com/$1 permanent;
}

Remember to change jslvtr.com to your domain name where appropriate.

What this will do is allow users to connect to your domain using port 80 (HTTP), but then will immediately redirect them to the HTTPS version (port 443), for added security.


Make sure to test now that your site works well using HTTPS! If you encounter any problems, you can always revert the nginx changes and go back to using port 80. That way, your site will be accessible as normal, without using HTTPS.