How to Use Cloudflare SSL in Nginx (2020)

This has to be hands down the most asked question it comes through our contact form: “How do I use CloudFlare SSL in NGINX?”

Needless to say, this quick guide is more towards the DIY WordPress/App hosting on their own VPS.

Requirements

There are only a few requirements, this shouldn’t take you more than 10 minutes to do:

  • Be logged in as a sudo user.
  • Know where your NGINX installation is.
  • Obviously set up your domain in CloudFlare and enable the “orange cloud”.

Step One: Generate an SSL Certificate

Head over to the SSL tab and then to the Origin Server tab, then hit the create certificate button.

Cloudflare ssl in nginx

Then it will popup a window, in which you can make some changes, but we’ll leave it default. Then hit the next blue button.

Cloudflare ssl in nginx

Right after hitting next, you’ll be presented with the cert and it’s key. Make sure not to close this since this window does not show up again. Otherwise, you’d have to do all of it again.

Step two: Copy, paste, and config Nginx

While having the previous windows open, open up your terminal/putty and make a directory where you’d want to save the certificate and the key.

In my case, I went ahead and created an SSL folder in /etc/nginx/, at the end it looks like this /etc/nginx/ssl/.

Now, after you have created the folder, let’s create copy and paste the cert and key. I went ahead and used nano to create and edit the hostreport-cert.pem and the hostreport-key.pem. Make sure the extension is .pem.

nano hostreport-cert.pem
nano hostreport-key.pem

Make sure you change hostreport for your domain’s name. Feel free to change the whole name as well.

After you have created, edited, and saved both files, let’s head over to the site’s Nginx vHost. In my case, it is located in /etc/nginx/sites-available/.

Then, using your favourite editor, edit it and paste the following bit of code:

listen 443 ssl http2;
listen [::]:443 ssl http2;
ssl_certificate     /etc/nginx/ssl/hostreport-cert.pem;
ssl_certificate_key    /etc/nginx/ssl/hostreport-key.pem;

Again, make sure you edit the code to ensure the location and the file name is the correct one.

Lastly, let’s check and reload nginx’s config so that the changes take effect.

nginx -t && service nginx reload

If everything is okay, then this should come up:

nginx: the configuration file /etc/nginx/nginx.conf syntax is ok
nginx: configuration file /etc/nginx/nginx.conf test is successful

Step three: Config CloudFlare

There are a few configs that you might want to change, the first one, which is the most important one, change the SSL mode to Full(Strict).

This can be located on the Overview tab on the SSL tab.

Cloudflare ssl in nginx

Whilst on the SSL tab, head over to the “Edge Certificates” tab and activate the “Always use SSL” option, this will redirect http to https automatically, so no nginx config required.

Cloudflare ssl in nginx

Also, you might find useful to activate the “Automatic HTTPS Rewrites” option, under the same tab. This will rewrite HTTP to HTTPS, hence it helps with mixed content.

Cloudflare ssl in nginx

Summary

In this quick guide, you have (hopefully) learned how to use CloudFlare SSL in NGINX. It honestly doesn’t take more than 10 minutes to get this going.

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.