How can I use Nginx server blocks and Django?

Question

I'm following the guide from this article However, when I link my home.html file in my django app's template folder, it doesn't load the css files and it doesn't understand any of the "{% %}" syntax.

How can I configure my nginx server block to load my django app properly?
My /etc/nginx/sites-available/myonlinefp.com file:

server {

    root /home/stelity/myonlinefp/foodpantry/templates/;
    index index.html index.htm index.nginx-debian.html home.html;

    server_name myonlinefp.com www.myonlinefp.com;

    location / {
        try_files $uri $uri/ =404;
    }
    location /media {
        alias /home/stelity/myonlinefp/foodpantry/media/;
    }

    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/myonlinefp.com/fullchain.pem; # managed by
    Certbot
    ssl_certificate_key /etc/letsencrypt/live/myonlinefp.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot
}

server {

    if ($host = www.myonlinefp.com) {
        return 301 https://$host$request_uri;
        } # managed by Certbot


        if ($host = myonlinefp.com) {
            return 301 https://$host$request_uri;
            } # managed by Certbot


            listen 80;
            listen [::]:80;

            server_name myonlinefp.com www.myonlinefp.com;
}

Updated, this is the edited file for a reply below:

server {

root unix:://run/gunicorn.sock;

server_name myonlinefp.com www.myonlinefp.com;

location / {
    try_files $uri $uri/ =404;
}
location /media {
    alias /home/stelity/myonlinefp/foodpantry/media/;
}

listen [::]:443 ssl ipv6only=on; # managed by Certbot
listen 443 ssl; # managed by Certbot
ssl_certificate /etc/letsencrypt/live/myonlinefp.com/fullchain.pem; # managed by

Certbot ssl_certificate_key /etc/letsencrypt/live/myonlinefp.com/privkey.pem; # managed by Certbot include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot }

server {

if ($host = www.myonlinefp.com) {
    return 301 https://$host$request_uri;
    } # managed by Certbot


    if ($host = myonlinefp.com) {
        return 301 https://$host$request_uri;
        } # managed by Certbot


        listen 80;
        listen [::]:80;

        server_name myonlinefp.com www.myonlinefp.com; }

Does your application working properly in your local machine because I think Django not rendering your template properly this may happen because of invalid syntax — Ankit Tiwari
– Ankit Tiwari, Commented Aug 12, 2022 at 5:18
It works properly on local machine. It works on nginx as well, but once I installed server block for nginx, I don't know how to configure the server block to go to my app. Right now, it's pointed to my home.html page in my templates folder and it opens exactly that file and doesn't understand syntax that django does. — stelity
– stelity, Commented Aug 12, 2022 at 13:55
Yes, it's working perfectly fine. It works perfectly fine for 159.223.177.51 but it doesn't work when I use the domain name because the server block is pointed to open the .html file and just the .html file without using django. — stelity
– stelity, Commented Aug 12, 2022 at 20:50
Did you created sock file for your service ? if yes then inside your server{} block set root to path/to/sockfile and remove index becouse you don't need that else evrything is fine I think — Ankit Tiwari
– Ankit Tiwari, Commented Aug 13, 2022 at 5:40

Ankit Tiwari · Accepted Answer · 2022-08-16 05:21:47Z

0

Here is updated nginx configuration

server {

    root unix:://run/gunicorn.sock;
    server_name myonlinefp.com www.myonlinefp.com;

    location / {
        try_files $uri $uri/ =404;
    }

    location /media {
        alias /home/stelity/myonlinefp/foodpantry/media/;
    }

    location /static {
        autoindex on;
        alias /home/stelity/myonlinefp/foodpantry;
    }

    listen [::]:443 ssl ipv6only=on;
    listen 443 ssl;
    ssl_certificate /etc/letsencrypt/live/myonlinefp.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/myonlinefp.com/privkey.pem;
    include /etc/letsencrypt/options-ssl-nginx.conf;
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
}

server {

    if ($host = www.myonlinefp.com) {
        return 301 https://$host$request_uri;
    }

    if ($host = myonlinefp.com) {
        return 301 https://$host$request_uri;
    }

    listen 80;
    listen [::]:80;
    server_name myonlinefp.com www.myonlinefp.com;
}

after adding this you've to run

python manage.py collectstatic

command & make sure you've configured your static files in settings.py like this

STATIC_URL = '/static/'

STATICFILES_DIR = ['/path/to/static/dir/']

STATIC_ROOT = '/path/to/static_root/dir/'

an make sure your STATIC_ROOT must be same as your nginx location name. For more information you can check Serving Static Content

edited Aug 16, 2022 at 5:21

answered Aug 15, 2022 at 14:24

Ankit Tiwari

4,7654 gold badges21 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

stelity Over a year ago

That didn't work, but adding the location worked: location / { proxy_pass unix:/run/gunicorn.sock; proxy_set_header Host $host; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header X-Forwarded-Proto $scheme; }

Ankit Tiwari Over a year ago

But it didn't solved your static issue when you navigate to admin your static content will not serve to serve static files you've to configure your nginx so check static part in nginx configuration

stelity Over a year ago

well, going to myonlinefp.com/admin doesn't load static, but the static files work in myonlinefp.com. I can see my custom fonts. My media files work too. I tried your solution, but it gave me a 404 error.

Ankit Tiwari Over a year ago

Hello @stelity 404 where it'sgiving you did you run collectstatic and STATICFILES_DIR, STATIC_ROOT should be your path and all other stuf is same as your nginx conf. I've just added static part check i've edited my answer little bit

Collectives™ on Stack Overflow

How can I use Nginx server blocks and Django?

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related