Nginx 没有看到 React index.html答案

【问题标题】：Nginx not seeing React index.htmlNginx 没有看到 React index.html
【发布时间】：2022-01-01 15:34:52
【问题描述】：

我正在尝试找出这个 nginx 404 错误：

open() "/etc/nginx/html/index.html" 失败（2：没有那个文件或目录）

我正在使用带有 nginx 映像的 docker 和 docker-compose：

FROM nginx:1.21-alpine

RUN rm /etc/nginx/conf.d/default.conf
COPY nginx.conf /etc/nginx/conf.d

nginx.conf 文件如下所示：

upstream backend {
    server backend:8000;
}

server {
    listen 80;
    server_name digibrain.co
                www.digibrain.co;

    location / {
        root "/var/www/frontend";
    }    

        location ~ \.(html|css|js)(.*)$ {
    expires -1;
    add_header Cache-Control no-store;
    }

    location /api/ {
        proxy_pass http://backend;
        proxy_set_header Host $http_host;
    }

    location /admin/ {
        proxy_pass http://backend;
        proxy_set_header Host $http_host;
    }
    
    location /static/ {
        # In dev we need to proxy_pass to the backend.
        # In prod we don't.
        proxy_pass http://backend;
        proxy_set_header Host $http_host;
        
        alias /backend/static/;
    }
}

当我转到localhost/api/ 时，后端工作正常，但前端不知何故坏了。想法？

【问题讨论】：

确保在您的 Nginx 配置（对于 server backend:8000）中使用正确的 backend service 名称（在 docker-compose 文件中使用的名称)。
后端工作正常。坏掉的是前端。 root "/var/www/frontend";

标签： docker nginx

【解决方案1】：

这里的问题是这部分代码：

location ~ \.(html|css|js)(.*)$ {
    expires -1;
    add_header Cache-Control no-store;
}

我做了一个足够接近的配置文件，所以要得到同样的错误，发现你需要在这个location中定义root

location ~ \.(html|css|js)(.*)$ {
    expires -1;
    add_header Cache-Control no-store;
    root "/var/www/frontend";
}

这将使您能够从设置的文件夹中提供前端服务，但您需要注意一个问题：

如果您尝试从后端提供带有此 *.(html|css|js)(.*) 签名的任何文件，它们将被假定位于设置的前端文件夹中，因此会出错（除非前端名称重复）

你可以找到我的游乐场here

PS：我已经删除了我的其他帖子，因为我假设了一个错误的观点

【讨论】：