Static files not loading for deployed django rest framework - django

I have built and successfully deployed a django rest framework using gunicorn and nginx on Ubuntu 18.04. However, the static files are not being pulled up.
Django web app without loaded static files
Here is my nginx configuration:
server {
listen 80 default_server;
listen [::]:80 default_server;
server_name [my_server_domain_or_IP];
#root /var/www/html;
location = /favicon.ico { access_log off; log_not_found off; }
location = /static/ {
root /home/ubuntu/myprojectdir;
}
location / {
include proxy_params;
proxy_pass http://unix:/run/gunicorn.sock;
}
}
And in my settings.py file:
STATIC_URL = '/static/'
import os
STATIC_ROOT = os.path.join(BASE_DIR, 'static/')
I have checked that DEBUG is set to False.
I have also already run collectstatic and the static files are located in a folder called static in: /home/ubuntu/myprojectdir/static.
Every change I tried to make in the nginx configuration, I restarted nginx with the following command: sudo systemctl restart nginx.
I mainly followed this tutorial, the only difference is that I edited the default nginx configuration instead of creating a new one because it wasn't deploying my django application this way.
I can't seem to figure out what's wrong and have been trying to solve it for days. Am I missing something here?

You don't need equals sign here:
location = /static/ {
root /home/ubuntu/myprojectdir;
}
Instead try this:
location /static/ {
root /home/ubuntu/myprojectdir;
}

Try to giving permissions to your home folder
chmod a+x /home/ubuntu -R

Related

Unable to serve static file in Django deployed to production in Digital ocean

Currently I deployed my django app in Digital ocean droplet. In localhost it works well but it cant serve js/css files in static folder when deployed to prod. Here are configs:
server {
server_name keywordprocessor.prodsite.com www.keywordprocessor.prodsite.com>
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
root /root/projects/backend/crawler;
}
location / {
include proxy_params;
proxy_pass http://unix:/run/gunicorn.sock;
}
...
}
BY digital oceans default, the project resides inside root directory
`cd projects` `pwd` returns /root/projects/
Settings
# Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/4.0/howto/static-files/
STATIC_URL = "/static/"
STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")]
STATIC_ROOT = os.path.join(BASE_DIR, "/")
THis is how the project folder looks like
backend/
crawler/
static/
templates
.gitignore
requirements.txt
/etc/systemd/service/gunicorn.service
[Unit]
Description=gunicorn daemon
Requires=gunicorn.socket
After=network.target
[Service]
User=root
Group=root
WorkingDirectory=/root/projects/backend/crawler
ExecStart=/usr/local/bin/gunicorn \
--access-logfile - \
--workers 3 \
--bind unix:/run/gunicorn.sock \
crawler.wsgi:application
[Install]
WantedBy=multi-user.target
All js and css files cant be served
`Failed to load resource: the server responded with a status of 404 (Not Found)`
It does load the page but css messed up. I did some googling for possible solutions, nothing works for me.
copy your static files to /var/www/static and change your nginx conf
1.Copy command in project directory cp -r ./static /var/www/static/
2.Permission to static folder which is in /var/www/static/command
sudo chmod 755 static
3.Change your nginx.conf like
server {
listen 80;
server_name Your-IP;
location = /favicon.ico { access_log off; log_not_found off; }
location /static/ {
alias /var/www/static/;
}
location / {
include proxy_params;
proxy_pass http://unix:/run/gunicorn.sock;
}
}
4.Do this commands for nginx and gunicorn
a) sudo nginx -t
b) sudo systemctl restart nginx
c) sudo systemctl restart gunicorn
5.If you will get any error check logs using sudo tail -F /var/log/nginx/error.log and try again.

Django on nginx ubuntu server static files in admin not found

I have setup my django project on a ubuntu server with nginx webserver.
In my django settings.py file i set:
STATIC_URL = '/static/'
STATIC_ROOT = '/static/images/'
STATICFILES_DIRS = [
'/var/www/core/frontend/static',
'/.venv/lib/python3.6/site-packages/django/contrib/admin/static',
]
whell, in my nginx.conf file i write:
server {
listen 80 default_server;
listen [::]:80 default_server;
}
# Load configuration files for the default server block.
include /etc/nginx/default.d/*.conf;
location /static/ {
alias /var/www/core/frontend/static/;
}
location / {
proxy_pass http://127.0.0.1:8000;
}
but when i open the admin part of my project i get a lot of 404 error about css and js not found.
Where i have to implement my code for correctly manage static admin file?
So many thanks in advance

Django+Nginx gives 404 while serving static files

Whenever I load my site it gives me a 404 error while loading the images and css.
My nginx config:
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /usr/share/nginx/html;
index index.html index.htm;
client_max_body_size 4G;
server_name _;
keepalive_timeout 5;
# Your Django project's media files - amend as required
location /media {
alias /home/django/django_project/django_project/media;
}
# your Django project's static files - amend as required
location /static/ {
alias /home/django/django_project/csite/static/csite/;
autoindex on;
}
# Proxy the static assests for the Django Admin panel
location / {
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
proxy_redirect off;
proxy_buffering off;
proxy_pass http://app_server;
}
}
My settings.py:
STATIC_ROOT = os.path.join(BASE_DIR, "csite/static")
STATIC_URL = '/static/'
You can view the directory structure here
My app name is csite.
Try this one
location /static/ {
root /home/django/django_project/csite/;
}
This is an answer according to my case, but you should find an answer to your issue. In my case, I have :
My Django IP server : 172.30.10.92
My Nginx IP server : 172.30.10.93
1- Install and Configure wsgi (located on Django server)
WSGI is a file created with your Django project.
The file is located in /path/to/your/project/Myproject/wsgi.py
We have to edit this file like this :
import os
from django.core.wsgi import get_wsgi_application
import sys sys.path.append('/var/www/html/Myproject')
os.environ.setdefault("DJANGO_SETTINGS_MODULE", "Myproject.settings")
application = get_wsgi_application()
2- Install and Configure gunicorn/supervisor (located on Django server)
In order to install gunicorn/supervisor, you have to execute in your shell :
pip install gunicorn
pip install supervisor
Then, you have to create a new file in /etc/supervisor/conf.d/Myproject.conf which looks like this :
[program:Myproject]
command = /home/valentin/.virtualenvs/MyprojectEnv/bin/gunicorn Myproject.wsgi:application --name "Myproject" --workers=4 --bind=0.0.0.0:8080 -- user="valentin" --group="valentin" ; Command to start app
user = username #You have to replace by your username
stdout_logfile = /var/log/supervisor/supervisor.log
redirect_stderr = true
log
environment=LANG=fr_FR.UTF-8,LC_ALL=fr_FR.UTF-8
I specified port 8080 which is the communication port between my application server and my web server.
3- Edit hosts file on nginx server (located on nginx server)
You have to edit your hosts file located to /etc/hosts and add a new entry to your Django server :
127.0.0.1 localhost
127.0.1.1 valentin
172.30.10.92 Myproject
# The following lines are desirable for IPv6 capable hosts ::1 localhost ip6-localhost ip6-loopback
ff02::1 ip6-allnodes
ff02::2 ip6-allrouters
4- New config file in nginx repository (located on nginx server)
This new file should be placed in /etc/nginx/sites-available/Myproject.conf
server {
listen 8080;
server_name Myproject;
root /var/www/html/Myproject/;
location /static/ {
root /var/www/html/;
}
location / {
include proxy_params;
proxy_pass http://172.30.10.92:8080;
}
}
The IP address corresponds to my Django server address. I specified the listen port (8080), the path to my Django project & static directory.
Then, you have to create a symbolic link to sites-enabled.
After ths operation, restart nginx service :
sudo service nginx restart
5- Allow nginx IP address in Django (located on Django server)
You have to edit your settings.py file in order to allow nginx IP address in ALLOWED_HOSTS :
ALLOWED_HOSTS = ['localhost', '172.30.10.93', '127.0.0.1', '[::1]']
6- Finally execute gunicorn (located on Django server)
Finally, you have to start gunicorn. You should be inside your Django root project and execute :
gunicorn Myproject.wsgi:application --bind 172.30.10.92:8080
Now, in your browser, try to connect to your nginx server with the port :
http://172.30.10.93:8080
It works !
EDIT
Your static directory haven't be placed in the same directory than your django project.
Create a new static directory, specify the path in your settings.py file and then, make python manage.py collectstatic.
Don't forget to edit your nginx files.

django + Nginx + Gunicorn - 404 for Static file when debug is false

I dont know how nginx serves the static files
/etc/nginx/site-available/default :
upstream example.com {
server unix:/home/www/example/env/run/gunicorn.sock fail_timeout=0;
}
server {
listen 80;
server_name example.com;
client_max_body_size 4G;
access_log /home/www/example/logs/nginx-access.log;
error_log //home/www/example/logs/nginx-error.log;
location /static/ {
alias /home/www/example/codeab/static/;
}
location /uploads/ {
alias /home/www/example/codeab/uploads/;
}
location / {
include proxy_params;
proxy_pass http://unix:/home/www/example/env/run/gunicorn.sock;
}
# Error pages
error_page 500 502 503 504 /500.html;
location = /500.html {
root /home/www/example/templates/;
}
error_page 404 /401.html;
location = /401.html {
root /home/www/example/codeab/templates/;
internal;
}
}
Django setting.py
STATIC_URL = '/static/'
STATICFILES_DIRS = (
os.path.join(BASE_DIR, 'static_content/'),
)
STATIC_ROOT = os.path.join(BASE_DIR,'static/')
Also , I did collectstatic before DEBUG = False
It seems that nginx is not considering the above config file, as for 404 page it is not showing my custom 401.html page.
After editing the config, I linked it to site-enabled by
sudo ln -s /etc/site-available/default /etc/site-enabled/default
service nginx reload
sudo service nginx restart
Please help, or let me know If I am missing any things.
I dont know the exact solution, but it started working on changing my gunicorn binding from xxx.xxx.xx.xx:80 to xxx.xx.xx.xx:8000
and editing config as -
location / {
include proxy_params;
#proxy_pass http://unix:/home/www/example/env/run/gunicorn.sock;
proxy_pass http://xxx.xxx.xx.xx:8000;
}
I commented proxy_pass of sock file and added the new line as you can see above.
Nginx serves static files from the dir defined in nginx config file under location /static/ and redirects to custom 404 html page as defined in nginx config by you when it does not find such static resource in the defined dir.
Django displays the custom 404 html page when it does not find given url in any of the urls.py files of Django, provided you set Debug = False in settings.py and also point the 'TEMPLATES'-'DIRS' setting to the dir containing your custom 404 html file as explained in the Django documentation.
So, effectively the way nginx and Django displays the same 404 html page is different and independent of each other.
Just change your the configuration in the nginx server block from
location /static/ {
alias /home/www/example/codeab/static/;
}
To
location /static/ {
alias /home/www/example/codeab/static_content/;
}
Reason, after the command python manage.py collectstatic has executed
the static files are been placed inside of the static_content folder.

django nginx configuration issue

I am encountering an issue with my nginx django setting.
Well, when I load the project using their development server everything is ok.
When I load it from nginx, it looks it's not really loading good project.
I made a test, I edited the settings.py file leaving a syntax error and well it didn't load on the internal server of django, but, it loaded with nginx. So I guess nginx isn't linked to the right config but I can't get why as I only created one project.
Config file is the following (nginx):
server {
listen 80;
server_name sub.example.com;
access_log /var/www/sub.example.com/log/access.log;
error_log /var/www/sub.example.com/log/error.log;
## Default location
location / {
include fastcgi_params;
fastcgi_pass 127.0.0.1:8888;
fastcgi_split_path_info ^()(.*)$;
}
location /static/ { # STATIC_URL
alias /var/www/sub.example.com/static/; # STATIC_ROOT
expires 30d;
}
location /media/ { # MEDIA_URL
alias /var/www/sub.example.com/media/; # MEDIA_ROOT
expires 30d;
}
}