issue with loading React static files from NGINX web server - nginx

NGINX web server takes about 3 minutes to load a React static file of about 3MB. and that slow download the performance of load the application
I have tried zipping the static file on my React file
this is my current configuration in NGINX
upstream app1{
# Use ip_hash algo for session affinity
least_conn;
server 192.168.1.7:3000;
server 192.168.3.7:3000;
}
location /app1 {
# Force timeouts if the backend dies
#proxy_next_upstream error timeout invalid_header http_500 http_502 http_503;
# Set timeouts
proxy_connect_timeout 3600;
proxy_send_timeout 3600;
proxy_read_timeout 3600;
send_timeout 3600;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_redirect off;
proxy_set_header Host $http_host;
proxy_set_header X-Forwarded-Host $http_host;
#proxy_set_header X-Forwarded-Proto $scheme;
proxy_pass https://app1/;
proxy_buffering off;
}
location ~* ^/static {
proxy_pass https://app1$request_uri;
proxy_buffering off;
}
location ~ ^/build {
proxy_pass https://app1$request_uri;
}
I want to be able to serve the static content within the NGINX sever without haven't fetch from the application server. also I want to be able to compress the file to the minimum size like 10 kilobyte.

Related

NGINX use the main upstream server when it is marked as temporary disabled

I set up two upstream servers as failover in my nginx
upstream backend {
server 10.0.0.10 fail_timeout=48h max_fails=1;
server 10.0.0.20 backup;
keepalive 25;
}
server {
listen 80;
server_name _;
client_body_buffer_size 500M;
client_max_body_size 500M;
location / {
proxy_http_version 1.1;
proxy_pass http://backend;
proxy_next_upstream timeout invalid_header http_500 http_403;
proxy_cache_bypass $http_upgrade;
proxy_set_header Upgrade $http_upgrade;
#proxy_set_header Connection "";
proxy_set_header Connection "upgrade";
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-Host $host;
proxy_set_header X-Forwarded-Port $server_port;
}
}
From what I understand the main server works until it becomes unavailable. If it is not available, the backup server will be used. The main server will be used only after 48h according to the configuration. So much for theory.
Everything was fine until the main server was unavailable for a few seconds. Unfortunately, according to logs, backup is used but sometimes the main as well.
I'll try to modify fail_timeout and max_fails variables but no luck.
Ideally, after switching to backup, all requests would be executed there. Only after the time set in fail_timeout elapsed, it returned to the main server.
The process performed by the my API is multi-stage and must be started and completed on the same server.

nginx is not able to detect when service goes down and comes up

We have an UI application deployed using Nginx.
when any services go down, the response changes to 504 gateway timeout, which is fine, however when the service comes back up this is not detected and 504 gateway timeout is still returned to the UI.
I have tried a bunch of Nginx config but none seems to work.
some of the configs tried are:
location ~ ^/(hub/note|rest/api/note) {
proxy_pass http://localhost:8011;
proxy_buffering off;
proxy_http_version 1.1;
proxy_set_header Host $http_host;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_cache_bypass $http_pragma;
proxy_no_cache $http_pragma;
proxy_cache off;
proxy_cache_use_stale off;
proxy_connect_timeout 180s;
proxy_read_timeout 180s;
proxy_send_timeout 180s;
}
did someone face a similar issue?
UPDATE: if I reload Nginx using nginx -s reload, connections are successful.

WebSocket connection to 'ws://<ip>..failed: Error during WebSocket handshake: Unexpected response code: 502

I'm using node,socket.io,nginx for socket connections for a http based simple application. below is my nginx.conf where i configured the websockets, my socket io is present in socket/socket.io. Strange thing is that the same config works perfectly when I run the node application in localhost and nginx with port 80. Not sure why it is failing in linux which real IP addresses.
http {
upstream io_nodes {
ip_hash;
server IP:PORT; --> My application's IP and port
server IP:PORT;
}
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 1000;
# HTTP Server
server {
listen 80;
server_name IP;
server_tokens off;
#proxy_ssl_verify off;
# prevents 502 bad gateway error
large_client_header_buffers 8 32k;
location /dummy/ {
root html;
index dummy/index.html;
}
location /socket/socket.io {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
# prevents 502 bad gateway error
proxy_buffers 8 32k;
proxy_buffer_size 64k;
proxy_pass http://io_nodes/;
proxy_redirect off;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
}
#location /socket.io/ {
# proxy_pass http://io_nodes/socket.io/;
#}
location /assistlog/socket.io {
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $http_host;
proxy_set_header X-NginX-Proxy true;
# prevents 502 bad gateway error
proxy_buffers 8 32k;
proxy_buffer_size 64k;
proxy_pass http://10.73.52.187:4444/;
proxy_redirect off;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header Host $host;
}
}
}
and this is the console error in chrome
WebSocket connection to 'ws://IP/socket/socket.io/?pathName=%2FDEMOUI%2Findex.html&EIO=3&transport=websocket' failed: Error during WebSocket handshake: Unexpected response code: 502
Please suggest a solution.
Check list:
First check whether your browser is supporting web sockets using https://websocket.org/echo.html
Then, if you are under organisation proxy, then you need to by pass proxy for local addresses.
Let us say, your organisation proxy IP is some x.x.x.x. You need to by pass some addresses(from the application where you need wss/ws connecctions) to NOT to use your org proxy.
Example in Mac, Chrome: Settings, search for proxy, and there you can see "bypass proxy settings for these hosts&domains". Add your application IP there

nginx proxy doesn't wait for slow meteor app

I have a meteor app running at meteor:3000, but some files are served to the client very slow (up to 10s), because the server isn't powerful.
It works when accessing the meteor app directly, but using the nginx reverse proxy the files that need long to serve don't get served at all, they result in a 404.
This is my proxy configuration
location / {
proxy_pass http://meteor:3000;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forward-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forward-Proto http;
proxy_set_header X-Nginx-Proxy true;
proxy_redirect off;
proxy_connect_timeout 100000000s; # these values seem to not affect nginx at all
proxy_send_timeout 150000000s;
proxy_read_timeout 200000000s;
}
Loading the site using reverse proxy
Loading the site directly

serving nginx static files from a subdomain (remove server)

I'm using nginx to route all incoming requests for a subdomain to a specific server. How do I configure nginx to also serve the static files from that same server?
server {
server_name subdomain.XYZ.com;
location / {
proxy_http_version 1.1;
proxy_redirect off;
proxy_pass http://10.123.456.78:8000;
proxy_pass_header Server;
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_read_timeout 864000;
}
location /static/ {
autoindex on;
alias /static/;
}
}
In this case, all incoming requests to subdomain.XYZ.com are rerouted to 10.123.456.78:8000. But all requests for static files are still on the local server (the one running nginx).
How do I route the static files to the remote server? And then how do I enable both caching and gzip compression of those static files?
It's quite simple:
gzip on;
gzip_types text/plain application/json;
# or gzip *; for all
proxy_cache_path /data/nginx/cache keys_zone=one:10m;
location /static/? {
proxy_cache one;
proxy_pass http://10.123.456.78:8000/path/to/static/files;
}
I would recommend gzipping them from the source instead however (on server 10.123.456.78).

Resources