静态文件的问题 - 使用 nginx 在子目录下托管 PHP 应用程序答案

【问题标题】：Issues with static files - hosting PHP app under subdirectory using nginx静态文件的问题 - 使用 nginx 在子目录下托管 PHP 应用程序
【发布时间】：2020-04-01 12:22:48
【问题描述】：

我是现有产品的新团队的一员，PO 希望在 domain.com/demo 下提供演示版本。网络服务器有前一个团队配置的 nginx 设置。

我对 nginx 不是很熟悉，但为了设置演示环境，我遵循了 this 教程。除了静态文件（图像、css）仍然从生产环境中提供之外，它似乎工作正常。

我们在 /var/www/app/current 和 /var/www/demoapp/current 下使用符号链接的自动部署系统。 nginx 配置如下所示：

server {
    server_name www.domain.com;
    return 301 $scheme://domain.com$request_uri;
}
server {
    server_name domain.com [IP_ADDRESS];
    root /var/www/app/current/public;

    add_header X-Frame-Options "SAMEORIGIN";
    add_header X-XSS-Protection "1; mode=block";
    add_header X-Content-Type-Options "nosniff";

    index index.html index.htm index.php;

    charset utf-8;

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }

    location = /favicon.ico { access_log off; log_not_found off; }
    location = /robots.txt  { access_log off; log_not_found off; }

    error_page 404 /index.php;

    location ~ \.php$ {
        fastcgi_pass unix:/var/run/php/php7.3-fpm.sock;
        fastcgi_index index.php;
        fastcgi_param SCRIPT_FILENAME $realpath_root$fastcgi_script_name;
        include fastcgi_params;
    }

    location ~ /\.(?!well-known).* {
        deny all;
    }

    # Media: images, icons, video, audio, HTC
    location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
        expires 1M;
        access_log off;
        add_header Cache-Control "public";
    }

    # CSS and Javascript
    location ~* \.(?:css|js|woff|woff2|ttf|otf|eot)$ {
        expires 1y;
        access_log off;
        add_header Cache-Control "public";
    }

    location ^~ /demo {
        alias /var/www/demoapp/current/public;
        try_files $uri $uri/ @demo;

        location ~ \.php$ {
            fastcgi_pass unix:/var/run/php/php7.3-fpm.sock;
            fastcgi_index index.php;
            fastcgi_param SCRIPT_FILENAME $request_filename;
            include fastcgi_params;
        }
        # Media: images, icons, video, audio, HTC
        location ~* \.(?:jpg|jpeg|gif|png|ico|cur|gz|svg|svgz|mp4|ogg|ogv|webm|htc)$ {
            expires 1M;
            access_log off;
            add_header Cache-Control "public";
        }
        # CSS and Javascript
        location ~* \.(?:css|js|woff|woff2|ttf|otf|eot)$ {
            expires 1y;
            access_log off;
            add_header Cache-Control "public";
        }
    }

    location @demo {
        rewrite /demo/(.*)$ /demo/index.php?/$1 last;
    }
    ...gzip & certbot configuration
}

当我通过 SSH 连接到服务器时，我可以看到我们的自动部署系统正在运行，并且应该在网站上可用的新 CSS 编译在 /var/www/demoapp/current/public/css/ 下。但是，当我访问 domain.com/demo 时，它会显示与实时版本相同的 CSS 样式表。

还有一个问题是演示版在部署到服务器时没有更新 PHP 和 HTML。我通过在每次部署时重新加载 FPM 服务来解决这个问题，但我怀疑它也可能与 nginx 配置有关。

我们将不胜感激任何对这些问题的帮助。

【问题讨论】：

您的演示应用应生成所有资产链接为/demo/...（或使用相对链接）。例如，<img src="/demo/some/path/file.jpg"> 而不是 <img src="/some/path/file.jpg">。
@IvanShatsky 据我所知，我们使用的是相对链接。我们使用 mix 来加载资产，但 f.e.未更新的样式表是这样加载的：<link rel="stylesheet" href="{{ mix('css/app.css') }}">
试试：location ^~ /demo
@RichardSmith 感谢您的建议。已经这样做了，但遗憾的是没有效果，所以我再次删除了它。
好吧，没有^~ 运算符，server 上下文中的location ~* \.(?:css|js|woff|woff2|ttf|otf|eot)$ 块用于处理所有以.css 结尾的URI，当然，它继承了root 的生产应用程序。

标签： php nginx static subdirectory

【解决方案1】：

这个问题最终与 nginx 无关。通过更改

的每次出现来修复它

<link href="{{ mix('css/dashboard.css') }}" rel="stylesheet">

到

<link href="{{ asset('css/dashboard.css') }}" rel="stylesheet">.

【讨论】：