CODEWITHSUNDEEP
vue.jsnginxdjango-rest-frameworkgunicornnginx-reverse-proxy
sotizerie
sotizerie

Reputation: 23

Nginx not redirecting to my DRF backend (Vue js frontend)

I am trying to deploy a Vue app with DRF as backend. I am using Nginx and gunicorn.

Gunicorn is running and serving http://127.0.0.1:8000. For example if i do curl http://127.0.0.1:8000/api/posts from the vps i actually get and empty array (no posts yet but meaning it is working). However if i run https://mywebsite.com/api/posts I just get the frontend vue loaded. The thing is I want to access to my django panel. So the goal is having '''https://mywebsite.com/admin''' allowing me to access the Django admin panel.

I have tried to implement location redirection in my nginx file in sites-available.

Here is the nginx conf file :

    listen 80;
    server_name mywebsite.com www.mywebsite.com;

    # Redirect all HTTP traffic to HTTPS
    return 301 https://$host$request_uri;
}

server {
    listen 443 ssl http2;
    server_name mywebsite.com www.mywebsite.com;

    # SSL configuration
    ssl_certificate /etc/letsencrypt/live/mywebsite.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/mywebsite.com/privkey.pem;

    # Optional security settings
    ssl_protocols TLSv1.2 TLSv1.3;
    ssl_prefer_server_ciphers off;
    ssl_ciphers "FHFHFOK-JDJFFJKKFF-JFDJFFKFKFK">

    location /admin/ {
        proxy_pass http://127.0.0.1:8000;  # Address where Gunicorn is running
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

    root /var/www/mywebsite/dist;
    index index.html;

    location /static/ {
        alias /var/www/mywebsite/blogproject/staticfiles/;
    }

    location /api/ {
        proxy_pass http://127.0.0.1:8000;  
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }

Checking the logs from nginx every request to /admin/is processed by vue js and not gunicorn... Any suggestion? Thanks a lot

Upvotes: 0

Views: 23

Answers (1)

sotizerie
sotizerie

Reputation: 23

Ok found the issue was that I had the default conf nginx with location / that was overlapping my location /admin/

Might help anyone stuck

Upvotes: 0

Related Questions