Django Nginx Media Folder for User Upload/Download - django

As part of an app I am working on with Django DRF and Vue, I have a section for uploading and downloading files. Files get uploaded to a media folder and are displayed as a list where users can download them. This all works fine in development running 'python manage.py run server' and 'npm run serve' but I am getting mixed results deploying it on Nginx with Docker.
I have tried every configuration possible. Currently, uploading and showing as a list is working without issue. When trying to download the files I am getting a 404 not found error. It is using the correct URL: "[website]/media/[file]". When looking in my Docker folder directory, the file exists at the specified path, so I am not sure what is going on.
This is the server configuration I believe may need to be adjusted.
server {
listen 443 ssl;
server_name [website].com www.[website].com;
root /dist/;
index index.html;
ssl_certificate /etc/letsencrypt/live/keeptrackapp.ca/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/keeptrackapp.ca/privkey.pem;
include /etc/letsencrypt/options-ssl-nginx.conf;
ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
# backend urls
location ~ ^/(admin|api|accounts|media|registration|auth|api-auth) {
proxy_redirect off;
proxy_pass http://backend;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
}
location = /robots.txt { log_not_found off; }
location = /sitemap.xml { log_not_found off; }
location = /favicon.ico { log_not_found off; }
location /media {
alias /media;
}
location /static {
alias /app/static;
}
# frontend
location /index.html {
try_files $uri $uri/ #rewrites;
}
location #rewrites {
rewrite ^(.+)$ /index.html last;
}
}
I have tried a few different variations for the media location including...
location /media {
alias /media;
}
location /media/ {
alias /media/;
}
location /media {
root /media;
}
location /media/ {
root /media/;
}
location ^~ /media {
root /media;
}
This is not an extensive list. I have tried every variation I could think of. Please provide some insight if I am approaching this wrong.
Cheers.

Related

How do I host two servers on NGINX? (Django and Angular PWA)

I want Django to keep all of its defined routes and Angular to be hosted from ip/pwa.
I have these block bodies:
#Angular
server {
listen 123.456.7.89:80;
root /home/pwa/dist/reportpwa;
location /pwa {
try_files $uri $uri/ /index.html;
}
}
#Django Database
server {
listen 123.456.7.89:80;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /home/django-apps/reportdbapi;
}
location / {
include proxy_params;
proxy_pass http://unix:/run/gunicorn.sock;
}
}
The servers seem to run fine on their own but when I put them both up together, the Django server takes over and refuses to recognize the Angular server. Can anyone tell me what kind of configuration I need to make them both work?

NGINX configuration for Django static files and Vue.js statics directory

I have an NGINX configuration for a containerized Django application that does three things:
routes traffic to a container running daphne (on /api/, /admin/ and /ws/ routes)
serves Django static files
serves static files for a Vue.js application that uses Quasar
My Vue.js application includes a few small images that should be served on /statics/ (with an s), and my Django static files are served on /static/. I can either have the /statics/ images from Vue.js working, or the /static/ files from Django working, but no both. Here's the configuration that makes Django static files work but Vue.js /statics/ files fail to load:
# static files
location /static {
autoindex on;
alias /usr/src/app/assets/static;
}
If I change the above to location /static/ {, then the Vue.js statics images will work but the Django static files will fail to load.
Here's my full NGINX configuration file:
user nginx;
worker_processes 1;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
client_max_body_size 100m;
upstream backend {
server backend:9000;
}
server {
listen 80;
charset utf-8;
root /dist/;
index index.html;
# frontend
location / {
try_files $uri $uri/ #rewrites;
}
location #rewrites {
rewrite ^(.+)$ /index.html last;
}
# static files
location /static {
autoindex on;
alias /usr/src/app/assets/static;
}
# backend urls
location ~ ^/(admin|api|ws) {
proxy_redirect off;
proxy_pass http://backend;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header Connection "upgrade";
proxy_set_header Upgrade $http_upgrade;
}
}
}
I would like to keep the route names /static/ and /statics/ in the NGINX configuration the same, I probably need to change the Django /static block.
I'm now trying to change the options described here: https://nginx.org/en/docs/http/ngx_http_core_module.html#alias.
I think I have this working correctly now, I had to add a / to the end of the alias path:
# static files
location /static {
autoindex on;
alias /usr/src/app/assets/static/;
}

How to update css/scss files with NGINX

I am running a Digital Ocean droplet with Gunicorn and NGINX. I am able
to view my web pages but I am not able to update html/css/scss.
I have added include /etc/nginx/mime.types; in /etc/nginx/nginx.conf as suggested in another post. Also tried
python manage.py collectstatic and received the following: 0 static files copied to '/home/ubuntuadmin/pyapps/nomad/static', 177 unmodified
sudo nano /etc/nginx/sites-available/nomad >>>
server {
listen 80;
server_name 157.245.0.153;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /home/ubuntuadmin/pyapps/nomad;
}
location /media/ {
root /home/ubuntuadmin/pyapps/nomad/;
}
location / {
include proxy_params;
proxy_pass http://unix:/run/gunicorn.sock;
include /etc/nginx/mime.types;
}
}```

How to configure nginx for websocket. I have django for REST in backend. The standard configurations i found over net wont work for nginx websocket

I have nginx to server to browser. I want nginx to serve for websocket requests from browser. Nginx has internally proxy to django (gunicorn uwsgi) using proxy configs. I am not able to set up the config in nginx for websocket. Tried different configs from internet but no success. My default file in nginx config file :
server {
listen 80 default_server;
listen [::]:80 default_server;
root /usr/share/gmc/dist;
# Add index.php to the list if you are using PHP
index index.html index.htm index.nginx-debian.html;
server_name _;
location / {
# First attempt to serve request as file, then
# as directory, then fall back to displaying a 404.
try_files $uri $uri/ =404 /index.html index.js;
}
location ~ /redfish.* {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_pass http://localhost:8000;
}
}
These are the basic settings you need to apply for your django-project:
server {
listen 80;
server_name **Server Name or IP**;
#Website LOGO:
location = /favicon.ico { access_log off; log_not_found off;}
#Static Files like CSS, JS
location = /static/ {
root /home/hitshell/website/project/
}
#Media Files like Images, Videos etc.
location = /media/ {
root /home/hitshell/website/project/
}
#proxy
location = / {
include proxy_params;
proxy_pass http://unix:/home/hitshell/website/project/project.sock;
}
}
REFERENCE:
https://www.digitalocean.com/community/tutorials/how-to-install-and-configure-django-with-postgres-nginx-and-gunicorn
https://www.shellvoide.com/hacks/installing-django-application-with-nginx-mysql-and-gunicorn-on-ubuntu-vps/
The First one has some missing configurations in the middle of the tutorial.

Nginx unable to load static files from django

family, Im having a little trouble to make nginx server load static file collected by django. here is my nginx sites-available
server {
listen 80;
server_name <my_ip_address>;
location / {
proxy_pass http://127.0.0.1:8000;
proxy_set_header X-Forwarded-Host $server_name;
proxy_set_header X-Real-IP $remote_addr;
}
location /asset/ {
autoindex on;
alias /var/www/html/dev2_assets/;
}
}
Down here is my Django STATIC_URL and STATIC_ROOT configurations
STATIC_URL = '/assets/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, "assets"),
)
STATIC_ROOT = '/var/www/html/dev2_assets/'
When i run the application with ./manage.py runserver its loads all the static files. Any help. Thanks
Your problem is your Location.
Your not specifying a root for it, also in your settings.py your declaring assets but in your location your declaring asset with a missing s. try changing it to something like this:
location /assets/ {
autoindex on;
root /var/www/html/dev2_assets;
}
Also for debugging purposes try added this above location:
error_log /var/log/nginx/error.log;
Then you will get a specific error message about it not being able to retrive your static files.
Lastly are you sure your utilyzing nginx, django, and gunicorn correct?
Here is a copy of my site file for comparison:
# This redirects all incoming traffic on port 80 to 443
server {
listen 80;
server_name domain.com;
return 301 https://$server_name$request_uri;
}
server {
listen 443;
ssl on;
ssl_certificate /etc/ssl/domain.com.chained.crt;
ssl_certificate_key /etc/ssl/domain.com.key;
server_name helius.dk;
access_log /var/log/nginx/nginx.vhost.access.log;
error_log /var/log/nginx/nginx.vhost.error.log;
#location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /home/user/projectname/static;
}
location / {
include proxy_params;
proxy_pass http://unix:/home/user/projectname/gunicorn.sock;
}
}