An error configuring nginx with Angular 2: Failed

Question

I configured nginx.conf to transfer the requests from Angular 2 application to the tomcat application. Still got several problems. My nginx.conf is as follows:

worker_processes  1;
events {
worker_connections  1024;
}
http {
include       mime.types;
default_type  application/octet-stream;
sendfile        on;
keepalive_timeout  65;
server {
    listen          8082;
    root /;
    client_max_body_size 50M;
    location /images {
    root /var/www/rentoptimum;
    }
    location / {
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass http://localhost:4200/;
    }
    location /api/ {
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass http://localhost:8080/rentapp/;
    }
}
server {
    listen       8081;
    server_name  localhost;
    location / {
        root   html;
        index  index.html index.htm;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}
include servers/*;
}

The url localhost:8081 works fine, I see “Welcome to nginx”. Localhost:4200 gives the angular application. Localhost:8082 does not open localhost:4200 and the proxy pass (http://localhost:8080/rentapp/;) to tomcat does not work either.

The error stack on the Chrome is as follows:

Failed to load resource: net::ERR_CONTENT_LENGTH_MISMATCH
inline.bundle.js:53 Uncaught TypeError: Cannot read property 'call' of undefined
 at __webpack_require__ (inline.bundle.js:53)
 at Object.1022 (main.bundle.js:6)
 at __webpack_require__ (inline.bundle.js:53)
 at webpackJsonpCallback (inline.bundle.js:24)
at main.bundle.js:1

Answer 1

First one needs to setup logging, so I commented out error_log in the configuration file:

error_log  logs/nginx_error.log; 

Then in the log I could see:

2017/05/27 22:37:29 [crit] 41617#0: *1 open() "/usr/local/var/run/nginx/proxy_temp/1/00/0000000001" failed (13: Permission denied) while reading upstream, client: 127.0.0.1, server: localhost, request: "GET /vendor.bundle.js HTTP/1.1", upstream: "http://127.0.0.1:4200/vendor.bundle.js", host: "localhost:8082", referrer: "http://localhost:8082/"

The log showed the permission problem on:

/usr/local/var/run/nginx/proxy_temp/1/00/0000000001

Fixing permissions on this path solved the problem