0

Have more than 1 angular application served by single nginx reverse proxy. Here is my config I tried.

worker_processes 1;

error_log <%= ENV["APP_ROOT"] %>/nginx/logs/error.log;
events { worker_connections 1024; }

http {

    client_max_body_size 3G;
    
    
    log_format upstream_time '$remote_addr - $remote_user [$time_local] '
                             '"$request" $status $body_bytes_sent '
                             '"$http_referer" "$http_user_agent" '
                             'rt="$request_time" uct="$upstream_connect_time" uht="$upstream_header_time" urt="$upstream_response_time" ua="$upstream_addr" ';
                             
    access_log <%= ENV["APP_ROOT"] %>/nginx/logs/access.log upstream_time;  
        
    server {
        listen       <%= ENV["PORT"] %>;
        server_name  localhost;
        root <%= ENV["APP_ROOT"] %>/public;
        
        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_http_version 1.1;
        
        #springboot microservices
        location /monitoringserv/details/ {
            <% if ENV["FORCE_HTTPS"] %>
                if ($http_x_forwarded_proto != "https") {
                return 301 https://$host$request_uri;
                }
            <% end %>           
            proxy_pass https://monitoring-c-serv.apps-dev.net;
            }
        
        location /dashboardserv/queue/ {
            <% if ENV["FORCE_HTTPS"] %>
                if ($http_x_forwarded_proto != "https") {
                return 301 https://$host$request_uri;
                }
            <% end %>           
            proxy_pass https://dashboard-c-serv.apps-dev.net;
            }
                
        #default UI landing page
        location ~ .(html|js|css|eot|svg|ttf|woff|woff2|png|gif|ico|jpg|jpeg)$ {                                    
            proxy_pass https://dashboard.apps-dev.net;
        }
                                
        location ~ ^/admin/.*\.(html|js|css|eot|svg|ttf|woff|woff2|png|gif|ico|jpg|jpeg)$ {
                try_files $request_uri $request_uri/ =404;  
        }

        location ~ ^/monitoring/.*\.(html|js|css|eot|svg|ttf|woff|woff2|png|gif|ico|jpg|jpeg)$ {    
                try_files $request_uri $request_uri/ =404;  
        }
                        
        #1-Default UI URL.
        location / {            
            proxy_pass https://dashboard.apps-dev.net;
        }
        
        location /admin/ {          
            proxy_pass https://admin.apps-dev.net;;
        }
        
        location /monitoring/ {         
            proxy_pass https://monitoring.apps-dev.net;;
        }
    }
}

Also build angular applications with

ng build --prod --base-href /admin/
ng build --prod --base-href /monitoring/

When I launch the application dashboard app opened fine and when I load admin or monitoring, I got error saying static files missing.

3
  • 1
    Please add full nginx configuration as shown by nginx -T. Commented Jan 8, 2022 at 6:19
  • @TeroKilkanen added full config code. Commented Jan 9, 2022 at 2:13
  • This is not the output of nginx -T. nginx does not have <% %> tags in its configuration. Please provide the output of nginx -T. Commented Jan 9, 2022 at 7:47

1 Answer 1

1

Problem with the regexes, try

location ~ ^/admin/.*\.(html|js|css|eot|svg|ttf|woff|woff2|png|gif|ico|jpg|jpeg)$ {
    try_files $request_uri $request_uri/ =404;  
}
location ~ ^/monitoring/.*\.(html|js|css|eot|svg|ttf|woff|woff2|png|gif|ico|jpg|jpeg)$ {    
    try_files $request_uri $request_uri/ =404;  
}

oh, and don't forget to restart nginx and clear browser cache.

4
  • @gerard-h-pille Thanks, tried above regex and the same issue - "Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec." Also i updated the complete code in question. Commented Jan 9, 2022 at 2:15
  • To me that sounds different from "static file missing". I don't see anything in your config regarding mime types. Commented Jan 9, 2022 at 3:36
  • @gerard-h-pille, my bad, static file is gone after regex fix. But strict MIME type error is coming after i added baseHref in angular. Also i found that from browser console NGINX is expecting the resource file requests (such as JS files) on URLs configured like the baseHref values and it could not found. Also in sources tab of Browser Developer tools, i see only index.html (blank file) with no other files for apps "admin" or "monitoring". So I am missing some config in nginx? Commented Jan 10, 2022 at 3:14
  • Nginx never "expects" requests. If the browser doesn't make requests, there's a problem with the browser or - more likely - your html. With an empty index.html, the browser has no reason to make further requests. Please address Tero's remarks first: what is that config you added? Commented Jan 10, 2022 at 4:03

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.