Question

Set up SSL on React frontend with *Django backend*

Posted November 3, 2021 112 views
NginxSecurityDjangoLet's EncryptReactUbuntu 20.04DigitalOcean Droplets

I have two droplets (each with Ubuntu 20.04.3 LTS) on digital ocean which are used for frontend (React 17.0.2) and backend (Django 2.2.5) server, both with Nginx 1.18.0. The frontend is connected to a domain-name while the backend is not.

I was following the tutorial on digitalocean (https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-let-s-encrypt-on-ubuntu-20-04) on how to secure nginx. I succeeded in setting up SSL for the frontend (React App). However, when I finished, the backend (Django 2.2.5) was not connected anymore or at least the frontend failed to get the data it usually got from there.

On stackoverflow I found a related question but with no satisfiable answer. My backend currently has no domain name connected to it (is accessed via IP address) and therefore Let’s encrypt certificate does not work.

My questions:

  1. Do I need to connect my backend to a (sub)domain name as well for this to work?
  2. Is this (adding SSL also to the backend) really the source of this problem or might it be solved by just adjusting a config file on the backend server?

These answers are provided by our Community. If you find them useful, show some love by clicking the heart. If you run into issues leave a comment, or add your own answer to help others.

×
Submit an Answer
1 answer

Problem solved by adding subdomain for backend django server as well, installing LetsEncrypt certificate via certbot (and adjusting backend URL on the frontend to the new https://domain.xyz). After this, enabling HTTPS on the frontend side did not anymore break the connection and website works now flawlessly.

Hope this helps if someone runs into the same issue.