Nginx cofig can't read the static with 404 ERR_ABORTED

system: ubuntu 18.04.5 LTS
nginx: nginx/1.14.0 (Ubuntu)

Hi, I am trying Nginx to proxy reverse a service(doccano) to my prod path and need some help, below is the config file

log_format  main_ext '$remote_addr - $remote_user [$time_local] "$request" '
                    '$status $body_bytes_sent "$http_referer" '
                    '"$http_user_agent" "$http_x_forwarded_for" '
                     '"host" sn="$server_name" ';

server {
  listen 8080 default_server;
  listen [::]:8080 default_server;

  access_log /var/log/nginx/access.log main_ext;
  error_log /var/log/nginx/error.log crit;

  
  index index.html index.htm index.nginx-debian.html;
  server_name <my prod name>;
  
  location / {
    try_files $uri $uri/ $uri/index.html $uri.html =404;
  }

  location /audience {
    ...
  }

  location /doccano {
    stub_status on;
    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;
    proxy_pass  http://127.0.0.1;
    proxy_connect_timeout   1800s;
    proxy_send_timeout      1800s;
    proxy_read_timeout      1800s;
    send_timeout            1800s;
  }
}

and when I open the the link on chrome it shows 404 with the browser console error message GET https://<my prod name>/_nuxt/08b13b1.js net::ERR_ABORTED 404

the curl seems OK to get the content of the service:

 ➜ curl http://127.0.0.1

<!doctype html>
<html>
  <head>
    <title>doccano - doccano</title><meta data-n-head="1" charset="utf-8"><meta data-n-head="1" name="viewport" content="width=device-width,initial-scale=1"><meta data-n-head="1" data-hid="description" name="description" content="doccano is an open source annotation tools for machine learning practitioner."><link data-n-head="1" rel="icon" type="image/x-icon" href="/favicon.ico"><link rel="preload" href="/_nuxt/14b976a.js" as="script"><link rel="preload" href="/_nuxt/08b13b1.js" as="script"><link rel="preload" href="/_nuxt/ac0f9d4.js" as="script"><link rel="preload" href="/_nuxt/7d3a60f.js" as="script">
  </head>
  <body>
    <div id="__nuxt"><style>#nuxt-loading{background:#fff;visibility:hidden;opacity:0;position:absolute;left:0;right:0;top:0;bottom:0;display:flex;justify-content:center;align-items:center;flex-direction:column;animation:nuxtLoadingIn 10s ease;-webkit-animation:nuxtLoadingIn 10s ease;animation-fill-mode:forwards;overflow:hidden}@keyframes nuxtLoadingIn{0%{visibility:hidden;opacity:0}20%{visibility:visible;opacity:0}100%{visibility:visible;opacity:1}}@-webkit-keyframes nuxtLoadingIn{0%{visibility:hidden;opacity:0}20%{visibility:visible;opacity:0}100%{visibility:visible;opacity:1}}#nuxt-loading>div,#nuxt-loading>div:after{border-radius:50%;width:5rem;height:5rem}#nuxt-loading>div{font-size:10px;position:relative;text-indent:-9999em;border:.5rem solid #f5f5f5;border-left:.5rem solid #fff;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0);-webkit-animation:nuxtLoading 1.1s infinite linear;animation:nuxtLoading 1.1s infinite linear}#nuxt-loading.error>div{border-left:.5rem solid #ff4500;animation-duration:5s}@-webkit-keyframes nuxtLoading{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes nuxtLoading{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}</style><script>window.addEventListener("error",function(){var e=document.getElementById("nuxt-loading");e&&(e.className+=" error")})</script><div id="nuxt-loading" aria-live="polite" role="status"><div>Loading...</div></div></div><script>window.__NUXT__={config:{_app:{basePath:"/",assetsPath:"/_nuxt/",cdnURL:null}}}</script>
  <script src="/_nuxt/14b976a.js"></script><script src="/_nuxt/08b13b1.js"></script><script src="/_nuxt/ac0f9d4.js"></script><script src="/_nuxt/7d3a60f.js"></script></body>
</html>

have anyone get the same error before?

Solution

I have solved the problem. Since the service of doccano I used is deployed by docker-compose, and the static files are bind in the docker_nginx_1 container inside the doccano project. Just modify my production nginx config /doccano to root with the change of the proxy_pass path to link to docker_nginx_1 and finally it shall work, for example:

log_format  main_ext '$remote_addr - $remote_user [$time_local] "$request" '
                     '$status $body_bytes_sent "$http_referer" '
                     '"$http_user_agent" "$http_x_forwarded_for" '
                     '"host" sn="$server_name" ';

server {
  listen 8080 default_server;
  listen [::]:8080 default_server;

  access_log /var/log/nginx/access.log main_ext;
  error_log /var/log/nginx/error.log crit;
  
  index index.html index.htm index.nginx-debian.html;
  server_name <path>;

  location /audience {
    ...
  }

  location / {
    stub_status on;
    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;
    proxy_pass  http://127.0.0.1:80;
    proxy_connect_timeout   1800s;
    proxy_send_timeout      1800s;
    proxy_read_timeout      1800s;
    send_timeout            1800s;
  }
}

Noted that it is no need to add try_files here.