Nginx not redirecting to Django - django

I am setting up a production server with Angular serving the front end and Django on the back. I got Nginx serving Angular properly but any requests to the backend dont go through and just time out.
I have Nginx serving Angular on port 80 and then Django on port 8800
This is the code I have in place for Django
server {
listen 8800;
server_name ADDRESS;
location = /favicon.ico {access_log off;log_not_found off;}
location = /static/ {
root /home/ubuntu/django/dbsystem;
}
location = /media/ {
root /home/ubuntu/django/dbsystem;
}
location = / {
include proxy_params;
proxy_pass http://unix:/home/ubuntu/django/dbsystem/dbsystem.sock;
}
}
This is the code I have in place for Angular
server {
listen 80 default_server;
listen [::]:80 default_server;
root /var/www/html;
index index.html index.htm index.nginx-debian.html;
server_name _;
location / {
try_files $uri $uri/ /index.html;
}
}
This is the code for Gunicorn
[Unit]
Description=gunicorn service
After=network.target
[Service]
User=ubuntu
Group=www-data
WorkingDirectory=/home/ubuntu/django/dbsystem/
ExecStart=/home/ubuntu/django/bin/gunicorn --access-logfile - --workers 3 -- bind unix:/home/ubuntu/django/dbsystem/dbsystem.sock dbsystem.wsgi:application
[Install]
WantedBy=multi-user.target
If I go to ADDRESS it pulls up Angular which is expected
If I go to ADDRESS/suburl it pulls up the appropriate Angular Route as expected
If I go to ADDRESS:8800 it loads up the Django (Not found) page since its in debug mode which is expected
If I go to ADDRESS:8800/suburl it waits a bit and goes into timeout which is the issue I am trying to solve. This is for both the /media route and all other routes. I dont have/use the static folder route I defined

There is a problem with location = in you nginx configuration. Please remove = and it would work.

Related

Moving a Django app into production using Nginx and Gunicorn, there are no errors but the page doesn't show

I'm trying to setup an app on my Digital Ocean production server, I've followed these instructions, testing gunicorn and nginx,I could access the app in gunicorn and both services start fine with no errors logged. However when I go to the site it does not show anything. This is a subdomain of my main site. Mostly I'm looking to find a place to start troubleshooting this especially since everything looks fine.
Configs:
Nginx config for subdomain (Django) site:
server {
# use 'listen 80 deferred;' for Linux
# use 'listen 80 accept_filter=httpready;' for FreeBSD
listen 80;
# set the correct host(s) for your site
server_name subdomain.domain_name.com www.subdomain.domain_name.com;
location = /favicon.ico {access_log off; log_not_found off;}
location /static/ {
root /path/to/static/files;
}
location / {
include proxy_params;
proxy_pass http://unix:/path/to/.sock/file;
}
}
Nginx config for main (static) site:
server {
listen 80 default_server;
listen [::]:80 default_server;
root /var/www/main_site_folder;
index index.html index.htm index.nginx-debian.html;
server_name domain_name www.domain_name;
location / {
try_files $uri $uri/ =404;
}
}
[Unit]
Description=Description of the app
After=network.target
[Service]
User=MyUserName
Group=www-data
WorkingDirectory=/var/www/app_directory/
ExecStart=/path/to/venv/and/gunicorn --access-logfile - --workers 3 --bind unix:/var/www/app_dir/.sock_filename app_name.wsgi:application
[Install]
WantedBy=multi-user.target
You could start by changing ALLOWED_HOSTS = ["*"] in settings.py. Also try accessing your URL through CURL.
Solved by adding an A record for the sub-domain 🙄, this was a classic case of not being able to find the answer because it was right in front of my face. 😅

Need help on connecting django to react using nginx and gunicorn

I'm trying to connect Django back-end to a React build provided to me by the front-end developer. I'm using Gunicorn for Django and Web server is Nginx.
The below config file is a result of extensive Googling.
Currently Django back-end works on port 80/8000 but whenever I change the port to anything else like 8001 below, the server does not respond.
The complete thing is running on Google Ubuntu VM.
I've executed sudo ufw disable for testing purposes.
server {
#listen 80;
listen 8001;
listen [::]:8001;
server_name xx.xx.7.xx;
location = /favicon.ico {
access_log off;
log_not_found off;
}
location /static/ {
root /home/username/cateringm;
}
location / {
include proxy_params;
proxy_pass http://unix:/run/gunicorn.sock;
}
#location / {
# try_files $uri $uri/cm_react_build/build/index.html; # this is where you serve the React build
# }
}
server {
listen 8002;
listen [::]:8002;
server_name xx.xx.7.xx;
root /home/username/cm_react_build/build;
index index.html index.htm;
location /static/ {
root /home/username/cm_react_build/build;
}
location /test {
root /home/username/cm_react_build/build;
index index.html;
try_files $uri $uri/ /index.html?$args;
}
}
I'm new to configuring web servers. Help would be appreciated.
I found the problem. Google by default blocks all ports except port 80. I updated the firewall rules for different ports and the requests were going through.

Why sites served with nginx have no styling applied

I try to put build of react app on localhost/ using nginx. As far as i understand this, i need to build app with "npm run build" and then serve build dir with static content. After many hours i managed to get it into work with docker and my django service as a api under localhost/api/. But what is not working is css and js on this sites. On any page neither is it react or django endpoints there is only raw html with attached css but not working. After many attempts with changing configs etc. I ended with same raw html. Why on nginx there is no styling on sites even if with inspecting these pages there is linked css to them.
This is my nginx.conf
http {
server {
listen 80;
listen [::]:80;
root /var/www/html;
server_name localhost;
index index.html index.htm;
location /api/ {
proxy_pass "http://web:8000/";
}
location / {
include /etc/nginx/mime.types;
try_files $uri $uri/ /index.html;
}
location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
root /var/www/html;
expires 1M;
access_log off;
add_header Cache-Control "public";
}
}
}
This is part of docker-compose
nginx:
image: nginx:latest
ports:
- 80:80
- 443:443
volumes:
- ./nginx_conf/:/etc/nginx/
- ./frontend/build/:/var/www/html/
depends_on:
- web
When i run this app with npm start : image
When i enter localhost/ with nginx running : image
Ok i don't understand why. But i was messing with inspector and i clicked by accident disable http cache AND bootstrap loaded!? I really have no idea how but now it works.
i add 2 include into server and it's worked:
include /etc/nginx/mime.types;
include /etc/nginx/conf.d/*.conf;

Accessing a Django app on a servers private IP/vpn tunnel

I am trying to access a django app via a private ip, i configured a vpn site to site with another server (server2) so that the server2 could access the app via a private ip i created (192.xx.xx.xx) on server1. Now the tunnel is up and running but when server2 try to reach the django app on server1 through the private ip, the django app is not reached.
The app uses nginx as a web server and gunicorn as the application server.
Below are both config files
nginx.conf
server {
listen 80;
server_name 197.xxx.xx.xx 192.xxx.xx.xx;
access_log /var/log/nginx/access.log;
error_log /var/log/nginx/error.log;
client_max_body_size 20M;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /var/www/project_folder/project/settings;
}
location /media/ {
root /var/www/project_folder;
}
location / {
include proxy_params;
proxy_pass http://unix:/var/www/project_folder/project.sock;
}}
gunicorn.service
[Unit]
Description=gunicorn daemon
After=network.target
[Service]
User=root
Group=www-data
WorkingDirectory=/var/www/project_folder
ExecStart=/var/www/env/bin/gunicorn --workers 3 --bind unix:/var/www/project_folder/project.sock project.wsgi:application
[Install]
WantedBy=multi-user.target
settings.py
ALLOWED_HOSTS = ['197.xxx.xx.xx','192.xxx.xx.xx']
In the above snippets the 197.xxx.xx.xx is the server1's public ip while 192.xxx.xx.xxis the server1's private ip. So server to is not able to call the django app through server1 private ip. I can see that serve2 is reaching server1 through nginx access logs but nothing in the nginx error logs.
1) I am not sure how to get around this since is my first time accessing a django app through private ip (vpn tunnels). Any advice or directions on how i can get server2 to reach the django app on server1 would be highly welcome.
2) suppose i have 2 apps in one django project, and i want app1 to be accessible through the server1's public IP, and app2 to be accessed through server1's private IP. is this something possible? if so how can i make it happen.
Thank you in advance, i would appreciate someone reaching out with the directions on how i can achieve the above
Also is it
I managed to fix this, the issue was my understanding of how the vpn tunnel works and i was also giving a wrong port in Nginx to app that is on a private IP.
I fixed this by assigning port 80 and creating a separate Nginx conf file for the app i want on a private IP, and i kept the also the one conf for the public IP app, they both listen to same port but different IPs.
ie
private ip app conf
server {
listen 80;
server_name 192.xxx.xx.xx;
access_log /var/log/nginx/access_ussd.log postdata;
error_log /var/log/nginx/error_ussd.log;
client_max_body_size 20M;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /var/www/IPH_USSD/iph_ussd/settings;
}
location /media/ {
root /var/www/IPH_USSD;
}
location / {
include proxy_params;
proxy_pass http://192.168.10.10:9000;
}}
public IP app conf
server {
listen 80;
server_name xxx.xxx.xx.xx;
access_log /var/log/nginx/access.log;
error_log /var/log/nginx/error.log;
client_max_body_size 20M;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /var/www/IPH_Dashboard_App/ingabo/settings;
}
location /media/ {
root /var/www/IPH_Dashboard_App;
}
location / {
include proxy_params;
proxy_pass http://unix:/var/www/IPH_Dashboard_App/ingabo.sock;
}}
I hope this helps anyone facing a similar issue in the future

Django+gunicorn+nginx site runs perfect when using example.com:8000 but not when using example.com

I have a site on Digital Ocean VPS.
But I get a bad gateway when accessing example.com but not when example.com:8000.
Also when visiting the django-admin at example.com:8000/admin the default formatting is not coming. I guess nginx is not being able to serve the static content.
Below is the service file for gunicorn:
[Unit]
Description=gunicorn daemon
After=network.target
[Service]
Group=www-data
WorkingDirectory=/FINlit
ExecStart=/FINlit/venvforfinlit/bin/gunicorn --access-logfile - --workers 3 --bind unix:/FINlit/Finlit.sock Finlit.wsgi:application
[Install]
WantedBy=multi-user.target
and the nginx config:
server {
listen 80;
server_name my_ip;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /FINlit;
}
location / {
include proxy_params;
proxy_pass http://unix:/FINlit/Finlit.sock;
}
}
Thanks
After almost searching for a couple of hours, my instincts led me to replace the IP with the domain name in the nginx config and now it works fine.
Actually I don't know, there might be a possibility that something else did the job for me but anyways.