Adam
Adam

Reputation: 85

Nginx config for vue app and express server

I have a ubuntu server on which I have a vue app and am trying to add an express app. Everything is working correctly in my vue app but the only route that works for my express location is the index route at /api.

here is my nginx.conf:

server {
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html/vue/family-showdown/client/dist;

    index index.html index.htm index.nginx-debian.html;

    server_name _;

    error_page 404 /;

    location /api {
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_redirect off;
            proxy_pass http://localhost:8080/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection 'upgrade';
            proxy_set_header Host $host;
            proxy_cache_bypass $http_upgrade;
    }


    location / {
            root /var/www/html/vue/family-showdown/client/dist;
    }
}

in my express app.js I have:

app.use('/', _index["default"]);
app.use('/users', _users["default"]);

Navigating to /api works correctly so I would expect that navigating to /api/users should work but instead I get a 404 that says Cannot GET //users

Upvotes: 0

Views: 553

Answers (1)

SefaUn
SefaUn

Reputation: 1220

there is no any location in your nginx configuration for /users path. you can try this configuration.

location / {
    root /var/www/html/vue/family-showdown/client/dist;
    index index.html;
    include  /etc/nginx/mime.types;
    try_files $uri $uri/ /index.html;
}

location /api/ {
    proxy_pass  http://localhost:8080;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection keep-alive;
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
}

location /users/ {
    proxy_pass  http://localhost:8080;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection keep-alive;
    proxy_set_header Host $host;
    proxy_cache_bypass $http_upgrade;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
}

and delete these configurations

root /var/www/html/vue/family-showdown/client/dist;

index index.html index.htm index.nginx-debian.html;

server_name _;

error_page 404 /;

location / {
    root /var/www/html/vue/family-showdown/client/dist;
}

Upvotes: 2

Related Questions