宝塔面板 Nginx 部署 华夏ERP 后切换主题色失败，less.min.js 返回 404

如题，在根据 通过宝塔面板安装华夏ERP 教程部署好前后端的服务之后，开始访问正常，但在顶部导航切换主题色时失败。打开控制台，发现 less.min.js 文件访问失败，返回 404。该文件为即时访问，一般的页面渲染都没有用到。

对比 华夏ERP 公开版本，它对应的 less.min.js 文件是可以访问的。查看部署站的源代码发现，static 目录干脆就没有可访问的资源。怀疑是目录涉及到一些规则被屏蔽了。

检查站点设置中的网站目录，取消访跨站访问（因为 static 是在根目录下，所以其实防跨站访问并不影响该目录的资源访问，只是在做原因排出）。

检查站点的配置文件，并没有匹配到 static 关键词。挨个注释掉一些配置，保存再查看是否恢复访问。最终筛选出了目标配置项：

    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
    {
        expires      30d;
        error_log /dev/null;
        access_log /dev/null;
    }

    location ~ .*\.(js|css)?$
    {
        expires      12h;
        error_log /dev/null;
        access_log /dev/null;
    }

这两项配置是设置浏览器的一些静态资源，比如 js、css 和图片等资源的缓存时长。

通过宝塔面板安装华夏ERP 里推荐的 server 配置：

 server {
        listen 3000;
        server_name  localhost;
        gzip on;
        gzip_min_length 100;
        gzip_types text/plain text/css application/xml application/javascript;
        gzip_vary on;
        location / {
            root   /home/jshERP/jshERP-web;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }
location /jshERP-boot/ {
    proxy_pass http://localhost:9999/jshERP-boot/;
    proxy_set_header Host $host:$server_port;
        }
 }

原来的 nginx 默认配置：

server
{
    listen 80;
    server_name 127.0.0.1;
    index index.php index.html index.htm default.php default.htm default.html;
    root /www/wwwroot/127.0.0.1;

    #SSL-START SSL相关配置，请勿删除或修改下一行带注释的404规则
    #error_page 404/404.html;
    #SSL-END

    #ERROR-PAGE-START  错误页配置，可以注释、删除或修改
    #error_page 404 /404.html;
    #error_page 502 /502.html;
    #ERROR-PAGE-END

    #PHP-INFO-START  PHP引用配置，可以注释或修改
    include enable-php-00.conf;
    #PHP-INFO-END

    #REWRITE-START URL重写规则引用,修改后将导致面板设置的伪静态规则失效
    include /www/server/panel/vhost/rewrite/127.0.0.1.conf;
    #REWRITE-END

    #禁止访问的文件或目录
    location ~ ^/(\.user.ini|\.htaccess|\.git|\.env|\.svn|\.project|LICENSE|README.md)
    {
        return 404;
    }

    #一键申请SSL证书验证目录相关设置
    location ~ \.well-known{
        allow all;
    }

    #禁止在证书验证目录放入敏感文件
    if ( $uri ~ "^/\.well-known/.*\.(php|jsp|py|js|css|lua|ts|go|zip|tar\.gz|rar|7z|sql|bak)$" ) {
        return 403;
    }

    location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
    {
        expires      30d;
        error_log /dev/null;
        access_log /dev/null;
    }

    location ~ .*\.(js|css)?$
    {
        expires      12h;
        error_log /dev/null;
        access_log /dev/null;
    }
    access_log  /www/wwwlogs/127.0.0.1.log;
    error_log  /www/wwwlogs/127.0.0.1.error.log;
}

两者结合，就变成了：

server
{
    listen 3000;
    server_name localhost;
    # root   /www/jar/jshERP-web/;
    gzip on;
    gzip_min_length 100;
    gzip_types text/plain text/css application/xml application/javascript;
    gzip_vary on;
    
    location / {
        root   /www/jar/jshERP-web/;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }
    
    location /jshERP-boot/ {
          proxy_pass http://localhost:9999/jshERP-boot/;
          proxy_set_header Host $host:$server_port;
    }
...

通过搜索关键词 location expires 文件无法访问 查到了原因：

有网友认为，这不是语法错误，而是逻辑错误。Nginx 的 location 是单独的，所以上例里静态文件没有 root 指向，这个时候 root 会被认为是默认的路径( /etc/nginx/html 或其他)，这样，当然就没有这些文件了，图片当然也不会有显示了。

所以真正的问题不是 Nginx 设置缓存 expires 后导致的 404 找不到文件，而是 root 根目录设置存在的逻辑错误导致的。因为没有正确的为所有项设置 root 根目录，导致了规则无法匹配，进而造成了这样的错误。

修改后的正确版本：

server
{
    listen 3000;
    server_name localhost;
    root   /www/jar/jshERP-web/;
    gzip on;
    gzip_min_length 100;
    gzip_types text/plain text/css application/xml application/javascript;
    gzip_vary on;
    
    location / {
        # root   /www/jar/jshERP-web/;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }
    
    location /jshERP-boot/ {
          proxy_pass http://localhost:9999/jshERP-boot/;
          proxy_set_header Host $host:$server_port;
    }
...

这确实是差之毫厘，谬以千里。比如 try_files $uri $uri/ /index.html; 就非常重要，它做了前端的路由适配，如果没有页面访问刷新会 404。