Refactor Nginx configuration for frontend and load balancer; remove default site, enhance SPA handling, and improve caching headers. #30

Author: nitin27may

frontend/Dockerfile

@@ -21,14 +21,14 @@ RUN npm run build
 # Use official nginx image as the base image
 FROM nginx:alpine
 
-# Remove default Nginx website
-RUN rm -rf /usr/share/nginx/html/*
+# Remove default Nginx website and configuration
+RUN rm -rf /usr/share/nginx/html/* /etc/nginx/conf.d/default.conf
 
 # Copy the build output to replace the default nginx contents.
 COPY --from=builder /app/dist/contact-portal/browser /usr/share/nginx/html
 
 # Copy the nginx file to fix fallback issue on refreshing.
-COPY /nginx.conf /etc/nginx/conf.d/default.conf
+COPY /nginx.conf /etc/nginx/nginx.conf
 
 # Expose port 80
 EXPOSE 8080

frontend/nginx.conf

@@ -1,21 +1,47 @@
-server {
-    listen 8080;
-    server_name localhost;
+events {
+    worker_connections 1024;
+}
 
-    root /usr/share/nginx/html;
-    index index.html;
+http {
+    include       /etc/nginx/mime.types;
+    default_type  application/octet-stream;
 
-    location / {
-        # Handles Angular routing
-        try_files $uri $uri/ /index.html;
-    }
+    sendfile        on;
+    keepalive_timeout  65;
 
-    # Optional: Static file caching
-    location ~* \.(?:ico|css|js|gif|jpg|jpeg|png|svg|woff|woff2|ttf|otf|eot|ttf|ttc|map)$ {
-        expires 6M;
-        access_log off;
-        add_header Cache-Control "public";
-    }
+    server {
+        listen 8080;
+        server_name localhost;
+        
+        # Disable automatic trailing slash redirects
+        server_name_in_redirect off;
+        port_in_redirect off;
+
+        root /usr/share/nginx/html;
+        index index.html;
 
-    error_page 404 /index.html;
+        location / {
+            # Handles Angular routing
+            try_files $uri $uri/ /index.html;
+            
+            # Additional headers for SPA
+            add_header Cache-Control "no-cache, no-store, must-revalidate";
+            add_header Pragma "no-cache";
+            add_header Expires "0";
+        }
+        
+        # Handle Angular routes without trailing slash
+        location ~ ^/([^/]+)$ {
+            try_files $uri $uri/ /index.html;
+        }
+
+        # Optional: Static file caching
+        location ~* \.(?:ico|css|js|gif|jpg|jpeg|png|svg|woff|woff2|ttf|otf|eot|ttf|ttc|map)$ {
+            expires 6M;
+            access_log off;
+            add_header Cache-Control "public";
+        }
+
+        error_page 404 /index.html;
+    }
 }

loadbalancer/nginx.conf

@@ -18,14 +18,16 @@ http {
     listen 80;
     # Route all other requests to the Angular frontend
     location / {
-            proxy_pass http://frontend/;
+            proxy_pass http://frontend;
             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;
-
-            # Serve Angular routes correctly
-           # try_files $uri /index.html;
+            
+            # Additional headers for SPA
+            add_header Cache-Control "no-cache, no-store, must-revalidate";
+            add_header Pragma "no-cache";
+            add_header Expires "0";
     }
 
     location /swagger/ {