nginx returns index.html content for all Angular files (including scripts)

Question

I have set up a solution of an Angular (v9) application that is being built as a Docker image (with nginx as webserver) and deployed to Kubernetes. Everything works, except that for each request, both for the root application itself as well as its javascript files I receive the content of the index.html.

My nginx configuration file looks as follows (mostly the default one):

pid        /var/run/nginx.pid;

events {
    worker_connections  1024;
}

http {
    types {
        module;
    }

    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;

    add_header X-Content-Type-Options nosniff;

    server {
        location / {
            # First attempt to serve request as file, then
            # as directory, then redirect to index(angular) if no file found.
            try_files $uri $uri/ /index.html;
        }
    }
}

Even if I comment out the location/try_files config lines it is still the same situation. There is a lot of guidance that I found for creating such a rewriting but nowhere did I find anything which would explain why this rewriting happens without me even configuring it.

Can i know how you build the app as Angular Application and as Docker Image? — Fmerco
– Fmerco, Commented Mar 10, 2020 at 13:03

Pharao2k · Accepted Answer · 2020-03-10 13:24:25Z

2

Well, as it turns out, it had nothing to do with nginx. The ingress element was configured incorrectly which rewrote every request to "/" and thus every request returned the default page (= index.html).

In more detail, I had the following configuration in spec.rules (note the last lines)

http:
  paths:
  - backend:
      serviceName: my-app
      servicePort: 80
    path: /

which had to be changed to:

http:
  paths:
  - backend:
      serviceName: my-app
      servicePort: 80
    path: /(.*)

answered Mar 10, 2020 at 13:24

Pharao2k

6955 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

nginx returns index.html content for all Angular files (including scripts)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related