Nginx 为 Nodejs API 意外返回 404

Question

I'm trying to setup an VueJS frontend and a NodeJS api backend server with Nginx on Digital Ocean. I have been having trouble setting up Nginx to work correctly.

In more details what I'm trying to achieve:

• Accessing http://ipaddressordomain/ - returns Vuejs app.
• VueJS apps needs to send and pull data from backend which would be at http://ipaddressordomain/api, the Nodejs api works on port 3333 on the same server.

What actually happens:

• Accessing http://ipaddressordomain/ - returns Vuejs app without issue. VueJS seems to work ok.
• Vuejs cannot connect to backend api. Also accessing http://ipaddressordomain/api returns 404 via browser or Postman.

CONFIGURATION :

NodeJS api routes available routes should be http://myaddress/api on port 3333:

router.route("/api/:sid").get(getUrlShorten);
router.route("/ai").post(postUrlShorten);

Nginx configuration:

Default server configuration
#
server {
        listen 80 default_server;
        listen [::]:80 default_server;

        # SSL configuration
        #
        # listen 443 ssl default_server;
        # listen [::]:443 ssl default_server;
        #
        # Note: You should disable gzip for SSL traffic.
        # See: https://bugs.debian.org/773332
        #
        # Read up on ssl_ciphers to ensure a secure configuration.
        # See: https://bugs.debian.org/765782
        #
        # Self signed certs generated by the ssl-cert package
        # Don't use them in a production server!
        #
        # include snippets/snakeoil.conf;


        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;

        server_name lien.to;
        location / {
                root /var/www/html/liento-fe/dist;
        }

        location /api/ {
                proxy_pass http://localhost:3333/;
                # as directory, then fall back to displaying a 404.
                try_files $uri $uri/ =404;
        }

        # pass PHP scripts to FastCGI server
        #
        #location ~ \.php$ {
        #       include snippets/fastcgi-php.conf;
        #
        #       # With php-fpm (or other unix sockets):
        #       fastcgi_pass unix:/var/run/php/php7.4-fpm.sock;
        #       # With php-cgi (or other tcp sockets):
        #       fastcgi_pass 127.0.0.1:9000;
        #}

        # deny access to .htaccess files, if Apache's document root
        # concurs with nginx's one
        #
         

Firewall (UFW):

Status: active

To                         Action      From
--                         ------      ----
Nginx HTTP                 ALLOW       Anywhere                  
OpenSSH                    ALLOW       Anywhere                  
Nginx HTTP (v6)            ALLOW       Anywhere (v6)             
OpenSSH (v6)               ALLOW       Anywhere (v6)             

Also side-question: on DO the location proxy address should be localhost or the actual IP of the DO server?

What can I try next? Is there something I'm missing?

Answer 1

Try to remove the try_files $uri $uri/ =404; :

location /api/ {
  proxy_pass http://localhost:3333/;
}

This works for me: https://github.com/gabrielwillemann/fast-help/blob/master/nginx/sites-avaible-examples.md#for-mutiple-proxies