Nginx proxy_pass не переправляет на бекенд

У меня бекэнд расположен на 5500 порту локального компьютера, при переходе на /api идет в корень сайта и иногда выдает ошибку 502. Как можно это решить? Вот конфиг:

server {
    listen 80;
    server_name example.com www.example.com;
    root /var/www/chat/dist;
    index index.html;
    charset utf-8;

    location /api {
        proxy_pass  http://127.0.0.1:5500/;
        proxy_set_header    Host    localhost;
    }
    location / {
        root /var/www/chat/dist;
        try_files $uri $uri/ /index.html;
    }
}

Ответы (2 шт):

Автор решения: Alexey Ten

http://nginx.org/ru/docs/http/ngx_http_proxy_module.html#proxy_pass

Если директива proxy_pass указана с URI, то при передаче запроса серверу часть нормализованного URI запроса, соответствующая location, заменяется на URI, указанный в директиве

В вашем случае /api заменяется на / и из запроса /api/messages получается //messages. Подозреваю, что vue на этом ломается.

В общем, нужно просто добавить слеш в location.

location /api/ {
    proxy_pass  http://127.0.0.1:5500/;
    proxy_set_header    Host    localhost;
}
→ Ссылка
Автор решения: Сергей Елпашев

Сделал upstream и заменил root на alias, исправил в соответствии с вашими предложениями. А так же оказалось, что у меня 5500 порт был занят) Теперь всё работает. Получилось вот так:

upstream backend {
    server 127.0.0.1:8080;
}
server {
    listen 80;
    server_name example.com www.example.com;
    charset utf-8;
    location / {
        alias /var/www/chat/dist/;
        try_files $uri $uri/ /index.html;
    }
    location /api/ {
        proxy_pass http://backend/;
    }
}
→ Ссылка