0

Here is my nginx server block where reverse proxy is configured:

 server {
    root /var/www/portfolio/build;
    index index.html;
    server_name somesite.com;

    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/somesite.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/somesite.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot


      }
      server {
      if ($host = www.somesite.com) {
     return 301 https://$host$request_uri;
     } # managed by Certbot


    if ($host = somesite.com) {
    return 301 https://$host$request_uri;
    } # managed by Certbot


    #listen 80;
    server_name somesite.com www.somesite.com;
    return 404; # managed by Certbot


    location / {
       try_files $uri $uri/ /index.html?q=$uri&$args;
       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 X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-Proto $scheme;
       proxy_set_header   Host $host;
       proxy_http_version 1.1;
       proxy_cache_bypass $http_upgrade;
       proxy_pass         "https://localhost:3000";

this only happens when i go to page, click on the subpage then refresh it --

nginx error log:

2020/11/12 20:32:09 [error] 595#595: *8 open() "/var/www/portfolio/build/portfolios" failed (2: No such file or directory), client: 192.168.1.1, server: somesite.com, request: "GET /portfolios HTTP/1.1", host: "somesite.com"
2020/11/12 20:36:28 [error] 595#595: *15 open() "/var/www/portfolio/build/portfolios" failed (2: No such file or directory), client: 192.168.1.1, server: somesite.com, request: "GET /portfolios HTTP/1.1", host: "somesite.com"
2020/11/12 20:36:30 [error] 595#595: *15 open() "/var/www/portfolio/build/portfolios" failed (2: No such file or directory), client: 192.168.1.1, server: somesite.com, request: "GET /portfolios HTTP/1.1", host: "somesite.com"
Ivan Shatsky
  • 13,267
  • 2
  • 21
  • 37
DevOps_N_Training
  • 83
  • 8
  • I already checked permissions and they are good – DevOps_N_Training Nov 12 '20 at 21:05
  • You should **never** use `try_files` and `proxy_pass` within the same location. Both are considered as *content handlers* and only one content handler should exist within the every single location. – Ivan Shatsky Nov 13 '20 at 16:05
  • Your proxy configuration looks like it was written to handle the WebSockets protocol. Does your react app really use WebSockets? – Ivan Shatsky Nov 13 '20 at 16:08
  • Thanks Ivan, but I added the try_files per a post I read... I will remove it. And no my react app does not use websockets. Is there an issue in the config? – DevOps_N_Training Nov 14 '20 at 08:09
  • Yes, as far as I understand this configuration supposed to support WebSockets only. You need to remove `proxy_set_header Upgrade $http_upgrade;`, `proxy_set_header Connection 'upgrade';`, `proxy_http_version 1.1;` and `proxy_cache_bypass $http_upgrade;` lines. However there is a way to support both HTTP and WebSockets, see the second example in the [official guide](http://nginx.org/en/docs/http/websocket.html). – Ivan Shatsky Nov 14 '20 at 20:18
  • Additionally, as far as I understand (I'm not very familiar with React so I can be wrong here) unless you react app uses server site rendering you can serve it with the nginx only using the `try_files` directive (see the example [here](https://stackoverflow.com/questions/43951720/react-router-and-nginx)). The other way is to serve the app via NodeJS proxying the requests to the NodeJS backend with the `proxy_pass`. – Ivan Shatsky Nov 14 '20 at 20:29

0 Answers0