Ubuntu Question posted in
The official Ubuntu documentation can be found here.

Ubuntu – Incorrect vps nginx redirect settings for django app

I use vps, ubuntu 20, nginx, gunicorn for run django project. <my_ip>:8000 runs django app.

I want run <my_ip> react (frontend), <my_ip>/api/ django (backend)

sudo nano /etc/nginx/sites-available/default/:

root /home/ubuntu/client/build;

server {
    listen 80;
    server_name <my_ip>;
    access_log  /var/log/nginx/example.log;

    location /media/ {
        root /home/ubuntu/api;
        expires 30d;
    }

    location /static/ {
        root /home/ubuntu/api;
        expires 30d;
    }

    location /api/ {
        rewrite /api/(.*) /$1 break;
        proxy_pass http://<my_api>:8000;
        proxy_set_header Host $server_name;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }

    location / {
        try files $uri $uri /index.html
    }
}

Frontend, backend works fine, static and media works fine.

But when I get into api/admin page, all my hrefs still point to root directory.

For example, when I press to "orders" href I-ve got link to < a href="/admin/orders/" >Orders</ a > I want get "/api/admin/orders/"

I think about /admin/ redirect, but is it correct decision?

I see a lot of not found errors in gunicorn logs because of incorrect links.

Can I fix it with nginx? Or in django settings?

enter image description here

UPD: just one more issue about conflict static folders. Django app use static files, for it I use:

location /static/ {
        root /home/ubuntu/api;
        expires 30d;
    }

But I noticed that with this settings react build doesn’t run course of /static/ folders conflict. Can I set it in nginx?

UPD2 Find decision to fix front/back conflict:

location /static/ {
        try_files /../../api/$uri /$uri;
        expires 30d;
    }
Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Final solution, maybe it could be helpful for someone:

    server {
    listen 80;
    server_name www.<domain_name>;
    return 301 https://<domain_name>$request_uri;
}

server {
    listen 443 ssl;
    ssl on;
    ssl_certificate /etc/ssl/cred.crt;
    ssl_certificate_key /etc/ssl/cred.key;
    
    server_name <domain_name>;
    access_log  /var/log/nginx/api.log;
    client_max_body_size 100M;
   
    root /home/ubuntu/client/build;
    index index.html;

    location /media/ {
        root /home/ubuntu/api;
        expires 30d;
    }

    location /static/ {
        try files /../../api/$uri /$uri;
        expires 30d;
    }

    location ~* ^/(admin|auth) {
        proxy_pass http://127.0.0.1:8000;
        proxy_set_header Host $server_name;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Photo $scheme;
    }
    
     location / {
        try files $uri $uri /index.html;
    }
}

  2. 0

    you can try to separate admin location in nginx config

    location /admin/ {
    proxy_pass http://<my_api>:8000;
    proxy_set_header Host $server_name;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search