Nginx to serve static files and also proxy to backend server - nginx

Question

I'm using nginx to serve static files, and also proxy to a backend java server. I'm using a templating language in my backend java server, that will eventually replace all html files.
I don't know nginx, so I wanted to ask for some help on the most efficient way to do this.
Files:
/assets // Lots more files in this folder
/index.html
/android-chrome-192x192.png
/android-chrome-512x512.png
/apple-touch-icon.png
/browserconfig.xml
/favicon.ico
/favicon-16x16.ico
/favicon-32x32.ico
/mstile-15x150.png
/safari-pinned-tab.svg
/site.webmanifest
Here is my conf file so far. I'm serving the static files, but not proxying:
server {
listen 80 default_server;
listen [::]:80 default_server;
root /root/web;
index index.html;
server_name _;
location /assets/ {
try_files $uri =404;
sendfile on;
sendfile_max_chunk 512k;
}
location / {
try_files $uri =404;
sendfile on;
sendfile_max_chunk 512k;
}
location ~* \.(jpg|jpeg|png|gif|ico|webp|mp4)$ {
expires 30d;
}
location ~* \.(css|js)$ {
expires 10d;
}
gzip on;
gzip_vary on;
gzip_comp_level 4;
gzip_min_length 256;
gzip_proxied any;
gzip_types application/javascript application/json application/x-font-ttf font/opentype image/* text/plain text/css text/xml text/javascript application/x-javascript application/xml;
gzip_disable "MSIE [1-6]\.";
gunzip on;
# error_log /root/nginx-log.txt debug;
}
My backend server will serve urls with patterns like this:
/basic-url-here // This style will serve html files built with a templating language from the server, so they need to be at the root path
/api/*
What is the right / efficient way to serve all these files with nginx while also proxying to a backend server?

Answer 1

I've found a solution that works, but I don't know how efficient it is. If I remove the /asset location block, and replace the / location block with this, it works:
location / {
try_files $uri $uri/ #backend;
}
location #backend {
proxy_pass http://backend:8080;
}
This is my final file:
server {
listen 80 default_server;
listen [::]:80 default_server;
root /root/web;
index index.html;
server_name _;
access_log off;
sendfile on;
sendfile_max_chunk 512k;
location / {
try_files $uri $uri/ #backend;
}
location #backend {
proxy_pass http://backend:8080;
}
location ~* \.(jpg|jpeg|png|gif|ico|webp|mp4)$ {
expires 30d;
}
location ~* \.(css|js)$ {
expires 10d;
}
gzip on;
gzip_vary on;
gzip_comp_level 4;
gzip_min_length 256;
gzip_proxied any;
gzip_types application/javascript application/json application/x-font-ttf font/opentype image/* text/plain text/css text/xml text/javascript application/x-javascript application/xml;
gzip_disable "MSIE [1-6]\.";
gunzip on;
# error_log /root/nginx-log.txt debug;
}
I'm not sure if this is the proper way to do this though.

Answer 2

You can use another location block to map your api, and say, your Java backend server will run on port 4000:
location /api/ {
proxy_pass http://localhost:4000:
..... <other configurations>
}
You can read more about this plus other configurations in the documentation.
Hope that helps!