CODEWITHSUNDEEP
nginxnginx-reverse-proxynginx-config
spierce7
spierce7

Reputation: 15766

Nginx to serve static files and also proxy to backend server

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?

Upvotes: 1

Views: 4890

Answers (2)

spierce7
spierce7

Reputation: 15766

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.

Upvotes: 3

johnsing
johnsing

Reputation: 141

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!

Upvotes: 1

Related Questions