Nginx cofig 无法读取带有 404 的静态 ERR_ABORTED

Question

系统：ubuntu 18.04.5 LTS
nginx: nginx/1.14.0 (Ubuntu)

你好，我正在尝试使用 Nginx 代理反向服务（doccano）到我的产品路径，需要一些帮助，下面是配置文件

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;
  }
}

当我在 chrome 上打开 link 时，它显示 404 和浏览器控制台错误消息 GET https://<my prod name>/_nuxt/08b13b1.js net::ERR_ABORTED 404

curl 似乎可以获取服务内容：

 ➜ 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>

有没有人遇到过同样的错误？

Answer 1

我已经解决了问题。由于我使用的doccano的服务是由docker-compose部署的，静态文件绑定在doccano项目内的docker_nginx_1容器中。只需将我的生产 nginx 配置 /doccano 修改为 root，将 proxy_pass 路径更改为 link 到 docker_nginx_1，最后它应该可以工作，例如：

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;
  }
}

注意这里不需要加try_files

Nginx cofig 无法读取带有 404 的静态 ERR_ABORTED

Nginx cofig can't read the static with 404 ERR_ABORTED

nginx

nginx-reverse-proxy

doccano