Question

我尝试在nginx上设置React应用程序，但是在从子目录提供静态文件时遇到了问题

我的文件树是这样的：

/var/www/
  antoinedeveyrac.io/
    ...
  react/
    ...
    build/
      index.html
      static/
        js
          *.js
        css
          *.css

我的conf文件是：

server {
    listen 443 ssl http2;
    listen [::]:443 ssl http2;
    include snippets/ssl-antoinedeveyrac.io.conf;
    include snippets/ssl-params.conf;

    root /var/www/antoinedeveyrac.io/html;
    index index.html index.htm index.nginx-debian.html;

    server_name antoinedeveyrac.io www.antoinedeveyrac.io;

    location / {
        # First attempt to serve request as file, then
        # as directory, then fall back to displaying a 404.
        try_files $uri $uri/ =404;
    }

    location ~ /.well-known {
        allow all;
    }

    location /react {
        alias /var/www/react/build;
        try_files $uri $uri/ =404;
        autoindex off;
        index index.html;
    }
}

因此，当我点击https://antoinedeveyrac.io/react时，我遇到了404错误，这意味着nginx无法理解我要从https://antoinedeveyrac.io/react/static/...而不是https://antoinedeveyrac.io/static/...提供文件

如何修复配置文件以匹配子目录中的静态文件？非常感谢：）

Answer 1

您是否在/var/www/react/build/index.html或index.html页面本身上引用的资产上获得了404？我会在评论中问这个问题，但代表还不够高。

根据您发布的目录输出，您的nginx root配置指向一个似乎不存在的html目录。

root /var/www/antoinedeveyrac.io/html;

尝试将根配置更改为...

root /var/www/antoinedeveyrac.io/

在index.html中，您应该引用这样的资源（如果您还没有这样做）

<link href="scripts/somefile.css" rel="stylesheet">

静态文件上的Nginx 404（反应应用程序）

1 个答案: