Nginx 动静分离详解

原创 于 2025-11-15 12:04:25 发布 · 835 阅读 · 15 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#nginx #前后端分离

一、什么是动静分离？

动静分离（Separation of Dynamic and Static Content）指的是让 Nginx 针对动态请求（如 PHP、Java、Python 等后端生成的页面或接口）和静态资源（如图片、JS、CSS、HTML 等文件）分别采用不同的处理方式和后端，提高性能和可扩展性。

核心目标：

  • 静态资源直接由 Nginx 高效处理，减轻后端压力。
  • 动态请求转发到后端应用服务器（如 PHP-FPM、Tomcat、Gunicorn 等）。
  • 可结合 CDN、缓存进一步优化静态资源访问。

二、典型动静分离架构

                +-----------------------+
                |       用户浏览器       |
                +-----------------------+
                          |
                          v
                +-----------------------+
                |        Nginx          |
                |-----------------------|
                | 静态资源 | 动态请求    |
                +-----------------------+
                   |           |
         +-------------+   +-----------------+
         |  静态文件   |   |  后端应用服务器 |
         +-------------+   +-----------------+

三、Nginx 动静分离配置详解

1. 基本配置模板

假设你的静态资源都在 /var/www/static/，动态请求以 .php 结尾。

server {
    listen 80;
    server_name www.example.com;

    # 静态资源处理
    location /static/ {
        root /var/www;
        expires 30d;
        add_header Cache-Control public;
    }

    location ~* \.(jpg|jpeg|png|gif|css|js|ico|woff|svg|html)$ {
        root /var/www/static;
        expires 7d;
        add_header Cache-Control public;
    }

    # 动态请求转发到后端
    location ~ \.php$ {
        root /var/www/html;
        fastcgi_pass unix:/run/php-fpm.sock;
        fastcgi_index index.php;
        include fastcgi_params;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
    }

    # 其他动态后端如 Java、Python
    # location /api/ {
    #     proxy_pass http://127.0.0.1:8080;
    # }
}

2. 动静分离的关键点

  • 静态资源用 root/alias，直接由 Nginx 处理，不经过后端。
  • 动态请求通过 fastcgi_pass 或 proxy_pass 转发到后端应用。
  • 可以用正则 location 匹配静态文件扩展名。
  • 静态资源可设置 expires/cache-control 头，提升缓存命中率。

3. 进阶配置：防止静态资源被动态处理

有时候静态资源目录和动态目录有交集，要防止误处理：

location / {
    try_files $uri $uri/ /index.php?$query_string;
}
  • try_files 优先尝试静态文件，找不到时再走动态后端。

4. 多后端动静分离

适合微服务或多语言后端：

server {
    listen 80;
    server_name www.example.com;

    # 静态资源
    location /assets/ {
        root /data/static;
        expires 30d;
    }

    # PHP 动态
    location ~ \.php$ {
        fastcgi_pass unix:/run/php-fpm.sock;
        root /data/php;
        ...
    }

    # Java 动态
    location /javaapi/ {
        proxy_pass http://127.0.0.1:8081;
    }
}

四、动静分离优化建议

  1. 静态资源建议部署在独立目录甚至独立域名（如 static.example.com），方便 CDN 加速和缓存。
  2. 静态资源开启 gzip 压缩： 
    gzip on;
gzip_types text/css application/javascript image/svg+xml;
  3. 合理设置缓存头，提高前端和 CDN 命中率。
  4. 动态内容建议关闭缓存，防止数据串号。
  5. 可以结合 OpenResty/Lua 动态控制缓存和后端分流。

五、动静分离常见问题排查

  1. 静态资源 404？
    • 检查 root/alias 路径，文件是否存在，权限是否正确。
  2. 动态请求被当成静态处理？
    • 检查 location 优先级，正则 location 要在普通 location 后面。
  3. 缓存未生效？
    • 检查 expires、cache-control 头部是否正确设置。
  4. 静态资源未走 CDN？
    • 检查静态资源是否分离至独立域名，CDN 配置是否正确。

六、动静分离与 CDN、微服务结合

  • 静态资源可以通过 CDN 分发，进一步提升全球访问速度。
  • 动态请求可以根据 URI、参数、Cookie 等分流到不同后端服务，支持微服务架构。
  • 结合缓存和动静分离，可极大提升网站性能和稳定性。

七、动静分离完整示例（含 CDN）

server {
    listen 80;
    server_name www.example.com;

    # 静态资源独立域名
    location /static/ {
        root /data/static;
        expires 30d;
        add_header Cache-Control "public";
    }

    # 动态（PHP）
    location ~ \.php$ {
        root /data/php;
        fastcgi_pass unix:/run/php-fpm.sock;
        ...
    }

    # 动态（API微服务）
    location /api/ {
        proxy_pass http://127.0.0.1:9000;
    }

    # 主页优先静态，找不到再转动态
    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }
}

八、参考资料

九、更复杂的目录结构与 alias 用法

有时静态资源和动态文件目录结构复杂，alias 能灵活映射请求路径到实际文件系统路径。

示例：alias 映射

location /assets/ {
    alias /data/project/static/;  # 注意 alias 结尾要加斜杠
    expires 30d;
    add_header Cache-Control public;
}
  • /assets/logo.png 实际访问 /data/project/static/logo.png
  • alias 用于将请求路径和磁盘目录做非线性映射，适合多项目或多版本场景。

注意事项

  • alias 和 root 不能混用，配置时要确保路径拼接正确。
  • 用 alias 时，fastcgi_param SCRIPT_FILENAME 需手动拼接真实路径。

十、静态资源版本管理（防止缓存脏数据）

前端常用文件名加 hash（如 main.abc123.js），Nginx 动静分离时建议：

  • 静态资源路径 /static/v1.0.1/main.abc123.js
  • 每次发布新版本，路径或文件名变化，自动绕过 CDN 或浏览器缓存。

Nginx 配置建议

location ~* /static/.+\.(js|css|png|jpg|jpeg|gif|svg|woff|ttf)$ {
    root /data/static;
    expires 30d;
    add_header Cache-Control public;
}

这样每次文件名变化，缓存自动失效，无需手动刷新。

十一、CDN集成动静分离

1. 静态资源走 CDN

  • 静态资源建议用独立域名，如 static.example.com
  • CDN 配置只回源 Nginx 的静态资源路径

2. 动态请求不走 CDN

  • 动态接口、页面走主域名，Nginx反向代理到后端应用

3. Nginx 配置示例

# 静态资源
server {
    listen 80;
    server_name static.example.com;
    location / {
        root /data/static;
        expires 30d;
        add_header Cache-Control public;
    }
}

# 动态站点
server {
    listen 80;
    server_name www.example.com;

    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }
    location ~ \.php$ {
        root /data/php;
        fastcgi_pass unix:/run/php-fpm.sock;
        ...
    }
}

CDN只配置static.example.com，动静彻底分离，资源缓存和加速效果最佳。

十二、动静分离自动化与监控

1. 自动化部署

  • 前端构建后自动上传静态资源到 Nginx 静态目录或对象存储/CDN
  • 后端代码独立部署，Nginx配置不需频繁调整

2. 监控建议

  • 监控静态资源访问量、404率、缓存命中率
  • 监控动态接口响应时间、后端健康状态
  • 用 Nginx access.log 分别记录静态与动态请求，便于分析

3. 日志分流示例

access_log /var/log/nginx/static_access.log main if=$is_static;
access_log /var/log/nginx/dynamic_access.log main if=$is_dynamic;

需要在 Lua 或 map 中动态设置 $is_static、$is_dynamic

十三、性能调优建议

  1. 静态资源开启多进程和 sendfile

    sendfile on;
tcp_nopush on;
aio on;

  2. 开启 HTTP/2 支持静态资源多路复用

    listen 443 ssl http2;

  3. 静态资源开启 gzip 压缩和 brotli（如支持）

    gzip on;
gzip_types text/css application/javascript image/svg+xml;

    Brotli 需安装模块。

  4. 合理配置 worker_processes、worker_connections

    worker_processes auto;
worker_connections 10240;

  5. 静态资源用 CDN，动态接口用缓存（如 Redis）优化后端性能

十四、动静分离常见问题进阶分析

  • alias 配置错误导致 404？
    • 检查 alias 路径，确保请求路径和文件系统路径拼接正确。
  • 静态资源被动态 location 捕获？
    • location 匹配顺序：精确 > 正则 > 通配，正则 location 放最后。
  • 静态资源更新后 CDN 仍返回旧文件？
    • 文件名加 hash，或配置 CDN 强制刷新。
  • 动态接口被缓存导致数据串号？
    • 动态 location 禁止缓存，或用缓存键区分用户、参数。

十五、动静分离与微服务、API网关结合

  • Nginx 可作为 API 网关，动静分离后，动态接口可进一步按 URI、Header、参数分流到不同微服务后端。
  • 静态资源可统一走 CDN，动态接口支持灰度发布、限流、鉴权等高级功能。

十六、完整动静分离生产配置模板

# 静态资源独立域名
server {
    listen 80;
    server_name static.example.com;
    location / {
        root /data/static;
        expires 30d;
        add_header Cache-Control public;
        gzip on;
        gzip_types text/css application/javascript image/svg+xml;
    }
}

# 动态站点
server {
    listen 80;
    server_name www.example.com;

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

    location ~ \.php$ {
        root /data/php;
        fastcgi_pass unix:/run/php-fpm.sock;
        fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
        include fastcgi_params;
    }

    location /api/ {
        proxy_pass http://127.0.0.1:9000;
        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;
    }
}

十七、多站点动静分离

如果你有多个业务站点（如主站、博客、活动页等），可以用 Nginx 的 server_name 和多 server 块实现动静分离：

# 静态资源统一域名
server {
    listen 80;
    server_name static.example.com;
    location / {
        root /data/static;
        expires 30d;
        add_header Cache-Control public;
    }
}

# 主站
server {
    listen 80;
    server_name www.example.com;
    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }
    location ~ \.php$ {
        root /data/php;
        fastcgi_pass unix:/run/php-fpm.sock;
        ...
    }
}

# 博客
server {
    listen 80;
    server_name blog.example.com;
    location / {
        try_files $uri $uri/ /index.php?$query_string;
    }
    location ~ \.php$ {
        root /data/blog;
        fastcgi_pass unix:/run/php-fpm.sock;
        ...
    }
}

优势：

  • 静态资源统一管理和缓存
  • 各业务站点独立，易于维护和扩展

十八、前端 SPA 和 SSR 场景动静分离

现代前端（Vue/React/Angular）项目常用 SPA（单页应用）或 SSR（服务端渲染），动静分离方式略有不同：

SPA 场景

  • 所有静态资源（HTML、JS、CSS、图片等）由 Nginx 静态目录或 CDN 提供
  • 路由全部由前端 JS 控制，Nginx 配置如下：
location / {
    try_files $uri $uri/ /index.html;
}

这样所有未命中的路径都返回 index.html，由前端路由处理。

SSR 场景

  • 静态资源仍由 Nginx 或 CDN 提供
  • 动态页面请求转发到 Node.js/Go/PHP 等后端服务：
location /api/ {
    proxy_pass http://127.0.0.1:3000;
}
location ~* \.(js|css|png|jpg|svg)$ {
    root /data/static;
    expires 30d;
    add_header Cache-Control public;
}

十九、静态资源高可用与回源

1. 多机部署静态资源

  • 静态资源目录同步到多台 Nginx 服务器（用 rsync、CI/CD、对象存储等）
  • 结合负载均衡和健康检查，确保高可用

2. CDN 回源配置

  • CDN 首选缓存静态资源，缓存失效时自动回源 Nginx
  • Nginx 配置合理的 expires 和 cache-control，提升 CDN 命中率

3. 回源防盗链

location / {
    valid_referers none blocked *.example.com;
    if ($invalid_referer) {
        return 403;
    }
}

防止第三方盗链静态资源，保护带宽和版权

二十、动静分离安全加固

  1. 静态资源目录禁止执行脚本 
    location /static/ {
    root /data/static;
    location ~ \.php$ {
        deny all;
    }
}
  2. 防止目录遍历 
    autoindex off;
  3. 限制静态资源上传类型和大小（如用于图片直传） 
    client_max_body_size 2M;

二十一、动静分离与对象存储结合

  • 前端构建产物上传到 OSS、COS、S3 等对象存储
  • CDN 配置对象存储为源站，Nginx 仅做动态接口反向代理
  • 资源更新自动同步到对象存储，彻底解耦静态与动态

典型架构：

用户 -> CDN -> 对象存储(静态) + Nginx(动态)

二十二、企业级运维与自动化建议

  1. 静态资源自动发布脚本
    • 前端构建后自动上传到 Nginx 静态目录或对象存储
    • 自动刷新 CDN 缓存
  2. 灰度发布静态资源
    • 采用版本号或 hash 路径，支持灰度和回滚
  3. 日志分流与监控
    • access.log 分静态、动态，分析性能和异常
    • 配合 ELK/Prometheus 监控 QPS、响应时间、错误率
  4. 高可用架构
    • 静态多机部署+负载均衡，动态多后端+健康检查
    • 自动化同步和故障切换
  5. 安全审计
    • 定期扫描静态资源目录，防止上传恶意脚本
    • Nginx 配置严格访问控制

二十三、动静分离实战总结

  • 静态资源建议独立域名+CDN+对象存储，极致加速和高可用
  • 动态接口建议反向代理到后端，关闭缓存，配合微服务架构
  • 复杂场景用 alias、try_files、正则 location 灵活配置
  • 自动化运维和安全加固是大规模动静分离架构的必备
网站开发动静分离实践
DADADIE的专栏
02-29 6234
转自：http://blog.brucefeng.info/post/static-backend-asolate 于 2015 年 12 月 13 日 1627次阅读 1. 动静分离的实现思路 1.1 静态资源部署至CDN上1.2 后端API提供数据1.3 前后端域名 2. 动静分离的实现优缺点 2.1 优点2.2 缺点 3. 实现案例Reference
21-前端与后端动静分离
彼岸舞的博客
09-06 347
动静分离 特点 分布式, 因为将前端和后端分开了, 不再由后端返回页面, 可以减少服务器的压力 前后端解耦, 可以独立开发, 前后端并行 静态归于Nginx发布 接口服务化, 统一只提供数据 数据特点 静态数据 css/js/html/images/audios/videos 动态数据 得到的数据可能会和上一次不一样 实现方式 CDN 很多的大型网站都是采用了CD...
【网络编程】利用Nginx实现动静分离--分离动态请求和静态请求（Nginx+Tomcat）
AnChenliang_1002的博客
06-19 3588
动静分离指的是将动态请求和静态请求分隔开，然后分别路由到相应的后端服务器。通常用户的请求中，一部分需要后台程序处理，例如查询数据库或者进行一些数据运算，这类请求我们称之为动态请求；还有一部分不需要后台程序处理，如请求 css、html、js、图片等静态资源，这类请求我们称之为静态请求。Nginx 实现动静分离的基础是它可以根据配置对不同的请求做不同的转发，动静分离有利于提高整个服务器系统的性能。为了提高网站的响应速度，减轻程序服务器（Tomcat，Jboss等）的负载，对于静态资源，如图片、js、css等文
Web 架构之动静分离
最新发布
懂搬砖
05-07 2429
动静分离是指将 Web 应用中的动态资源（如 PHP、JSP、ASP 等动态脚本生成的页面）和静态资源（如 HTML、CSS、JavaScript、图片等）分开处理和部署。通过将静态资源和动态资源分别部署在不同的服务器或存储系统上，可以充分发挥各自的优势，提高网站的性能和可扩展性。动静分离是一种有效的 Web 架构优化策略，它可以显著提高网站的性能和可维护性。通过将静态资源和动态资源分开处理和部署，可以充分发挥各自的优势，减少服务器的负载，提高资源的访问速度。
Nginx动静分离详解
Yosigo_的博客
05-25 1657
Nginx动静分离基本概述 动静分离，通过中间件将动态请求和静态请求进行分离 那为什么要通过中间件将动态请求和静态请求进行分离？减少不必要的请求消耗，同时能减少请求的延时。 Nginx动静分离场景实践 实验架构 实验环境 主机 服务 服务 地址 lb01 负载均衡 Nginx Proxy 192.168.15.5 Web01 静态资源 Nginx Static 192.168.15.7 Web02 动态资源 Tomcat Serve
Nginx+Tomcat实现负载均衡、动静分离集群部署（图文详解）
愿你成为自己喜欢的模样，不抱怨，不将就，有自由，有光芒！
01-16 8005
文章目录一、Nginx实现负载均衡原理1、Nginx静态处理优势2、Nginx动静分离原理二、Nginx配置反向代理主要参数三、实验(图文详解)环境配置1.部署Nginx 负载均衡器2.部署2台Tomcat 应用服务器3.动静分离配置Tomcat Server1 配置Tomcat Server2 配置Nginx server 配置4.测试效果 一、Nginx实现负载均衡原理 Nginx实现负载均衡是通过反向代理实现 如图所示： Nginx服务器作为前端，Tomcat服务器作为后端，web页面请求由Ngin
nginx动静分离配置_详解Nginx的动静分离及高可用集群
weixin_39545269的博客
11-25 249
动静分离1. 什么是动静分离Nginx 动静分离简单来说就是把动态跟静态请求分开，不能理解成只是单纯的把动态页面和 静态页面物理分离。严格意义上说应该是动态请求跟静态请求分开，可以理解成使用 Nginx 处理静态页面，Tomcat 处理动态页面。动静分离从目前实现角度来讲大致分为两种：一种是纯粹把静态文件独立成单独的域名，放在独立的服务器上，也是目前主流推崇的方案；另外一种方法就是动态跟静态文件混...
nginx详解-动静分离
Andy's Blog
11-12 902
Nginx 动静分离简单来说就是把动态跟静态请求分开，不能理解成只是单纯的把动态页面和静态页面物理分离。严格意义上说应该是动态请求跟静态请求分开，可以理解成使用 Nginx处理静态页面， Tomcat 处理动态页面。动静分离从目前实现角度来讲大致分为两种，一种是纯粹把静态文件独立成单独的域名，放在独立的服务器上，也是目前主流推崇的方案；另外一种方法就是动态跟静态文件混合在一起发布，通过 nginx...
Nginx实现动静分离
Lzcsfg的博客
06-18 3377
为了加快网站的解析速度，可以把动态页面和静态页面由不同的服务器来解析，加快解析速度。在动静分离的tomcat的时候比较明显，因为tomcat解析静态很慢，其实这些原理的话都很好理解，简单来说，就是使用正则表达式匹配过滤，然后交个不同的服务器，动态资源交给动态服务器，静态资源交给静态服务器。动态资源则需要每次请求时动态生成，较难进行缓存，需要更多的服务器计算资源。静态资源的特点是不依赖于用户的请求动态生成，服务器直接将文件内容发送给客户端，通常由Web服务器（如Nginx、Apache）直接提供。
nginx使用详解--动静分离
liulanba的博客
02-29 1754
为了提高网站的响应速度，减轻程序服务器（Tomcat，Jboss等）的负载，对于静态资源，如图片、js、css等文件，可以在反向代理服务器中进行缓存，这样浏览器在请求一个静态资源时，代理服务器就可以直接处理，而不用将请求转发给后端服务器。对于用户请求的动态文件，如servlet、jsp，则转发给Tomcat，Jboss服务器处理，这就是动静分离。即动态文件与静态文件的分离。
nginx负载均衡
z07121的博客
06-30 1112
反向代理与负载均衡 nginx通常被用作后端服务器的反向代理，这样就可以很方便的实现动静分离以及负载均衡，从而大大提高服务器的处理能力。 nginx实现动静分离，其实就是在反向代理的时候，如果是静态资源，就直接从nginx发布的路径去读取，而不需要从后台服务器获取了。 但是要注意，这种情况下需要保证后端跟前端的程序保持一致，可以使用Rsync做服务端自动同步或者使用NFS、MFS分布式共享存储。 Http Proxy模块，功能很多，最常用的是proxy_pass和proxy_cache 如果要使用proxy
nginx：在Nginx中如何实现动静分离
weixin_43290370的博客
04-17 1855
✔ 提升静态资源访问速度（Nginx处理静态文件性能是Tomcat的5-10倍）内容更新但URL未变时，浏览器可能继续使用旧缓存。✔ 降低后端负载（减少30%~50%的无效请求）当Nginx或后端服务宕机时，需避免全站不可用。✔ 便于CDN加速（静态资源可独立缓存）Tomcat/Spring处理。（浏览器缓存 + CDN加速）（正则匹配 + 前缀区分）（集群化 + 灾备方案）
nginx动静分离
2401_86544677的博客
11-26 9986
在现代Web应用架构中，动静分离已成为一种广泛采用的优化策略。这种技术的核心理念是。
前端动静分离实践
云原生devsecops
03-28 1324
前端动静分离可操作方法 1.内部服务器，内存较大，主要作用是内部BI系统，将静态资源实时load至/dev/shm路径下
Nginx+Tomcat实现动静分离
a rookie的博客
02-27 2033
本篇主要讲述Nginx+Tomcat动静分离的原理、架构、并实现
动静分离和前后端分离
weixin_52236586的博客
09-24 326
动静分离和前后端分离
秒杀系统架构关键技术-动静分离
kingSolider的博客
04-07 309
何为动静数据 “动态数据”和“静态数据”的主要区别就是看页面中输出的数据是否和 URL、浏览者、时间、地域相关，以及是否含有 Cookie 等私密数据。 静态数据，不能仅仅理解为传统意义上完全存在磁 盘上的 HTML 页面，它也可能是经过 Java 系统产生的页面，但是它输出的页面 本身不包含上面所说的那些因素。也就是所谓“动态”还是“静态”，并不是说 数据本身是否动静，而是数据中是否含有和访问者相关的个性化数据。 缓存静态数据策略 第一，你应该把静态数据缓存到离用户最近的地方。 第二.
Nginx搭配负载均衡和动静分离：构建高性能Web应用的完美组合
weixin_74268571的博客
11-02 1812
Nginx简介，以及负载均衡和动静分离的介绍。Nginx安装并搭载负载均衡并提供前后端分离后台接口数据，及负载均衡后台项目发布。前端项目打包并在Linux中将项目部署到Nginx服务器实现动静分离，添加IP与域名的对应关系
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

猩火燎猿

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值