express and nginx - loads html file but can't serve assets - express

Question

I'm trying to run an express server at port 3000. When I visit my server's IP, I'm able to get the html page to load, however it doesn't seem to be able to find the assets (have a .js and .css file that I link to - this is in the same directory as the index.html inside of public). Am I missing something in my configs?
express setup
const express = require('express');
const path = require('path');
const app = express();
const PORT = 3000;
app.use('*',
express.static(path.join(__dirname, '..', 'public', 'index.html')));
app.get('*', (req, res) => {
res.sendFile((path.join(__dirname, '..', 'public', 'index.html')));
});
app.listen(PORT, () => {
console.log(`Listening on http://localhost:${PORT}...`)
});
nginx setup
server {
listen 80 default_server;
listen [::]:80 default_server;
root /var/www/my_site/public;
index index.html index.htm index.nginx-debian.html;
server_name _;
location / {
try_files $uri $uri/ =404;
proxy_pass http://127.0.0.1:3000;
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;
}
}

Answer 1

In your nginx configuration,
try_files $uri $uri/ =404;
Means nginx will try to find a static resource in your root folder, then try it with a / at the end, if it hasn't found anything yet will give out a 404 (Not Found).
It never reaches the proxy_pass.
The proper way to configure it would be like this:
server {
listen 80 default_server;
listen [::]:80 default_server;
root /var/www/my_site/public;
index index.html index.htm index.nginx-debian.html;
server_name _;
location / {
try_files $uri $uri/ #nodejs;
}
location #nodejs {
proxy_pass http://127.0.0.1:3000;
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;
}
}
Now, it will look for static files in your root folder, then pass it on to the node server.