Nginx与CDN协同配置的最佳实践_Php

引言

在现代 web 架构中，静态资源的分发效率直接决定了用户体验的流畅度、服务器负载的均衡性以及整体系统的可扩展性。无论是前端的 javascript、css 文件，还是图片、字体、视频等媒体资产，它们都构成了用户访问网站的第一印象。当用户遍布全球，访问高峰频发，单靠一台 nginx 服务器直接提供静态资源，早已无法满足高并发、低延迟、高可用的业务需求。

此时，cdn（content delivery network，内容分发网络）成为不可或缺的基础设施。cdn 通过在全球多个边缘节点缓存静态资源，使用户从地理上最近的节点获取内容，大幅降低网络延迟，减轻源站压力，提升访问速度与稳定性。

然而，cdn 并非“开箱即用”的魔法棒。它与源站 nginx 的协同配置，决定了缓存命中率、资源更新时效、安全策略有效性等关键指标。一个配置不当的 cdn + nginx 组合，可能导致缓存穿透、缓存污染、资源版本错乱、甚至被恶意利用进行 ddos 攻击。

本文将系统性地剖析 nginx 与主流 cdn（如 cloudflare、阿里云 cdn、腾讯云 cdn）的协同配置策略，涵盖缓存控制头、静态资源路径规划、缓存刷新机制、安全加固、日志分析、java 后端动态生成资源的缓存策略，以及如何通过 mermaid 图表清晰呈现架构流转。我们将结合真实业务场景，提供可落地的 nginx 配置片段、java 代码示例与最佳实践，帮助你构建一个高性能、高安全、高可维护的静态资源分发体系。

一、cdn 工作原理与 nginx 的角色定位

在深入配置之前，我们必须厘清 cdn 与 nginx 在架构中的分工。

1.1 cdn 是什么？

cdn 是一种分布式网络服务，通过在全球部署大量边缘节点（edge nodes），将源站的静态资源（如图片、js、css、html、字体等）缓存到离用户更近的服务器上。当用户请求资源时，dns 会智能解析到最近的边缘节点，若该节点已有缓存，则直接返回；若无，则回源（origin pull）到你的 nginx 服务器获取最新内容，并缓存至本地。

cdn 的核心价值：就近访问 + 缓存复用 + 带宽卸载 + 抗攻击能力

1.2 nginx 在 cdn 架构中的角色

nginx 在此架构中扮演**源站服务器（origin server）**的角色。它的职责包括：

提供静态资源的原始访问入口
设置正确的 http 缓存控制头（cache-control, etag, last-modified）
处理动态请求（如 api）与静态请求的分流
实现访问控制、防盗链、限流等安全策略
为 cdn 提供稳定、可预测的响应行为

关键认知：cdn 不是取代 nginx，而是增强 nginx。nginx 是“地基”，cdn 是“屋顶”。地基不稳，屋顶再美也会坍塌。

1.3 典型请求流程图示（mermaid）

下面是一个标准的 cdn + nginx 请求流程图，清晰展示数据流转：

这个流程图揭示了两个核心点：

缓存命中：90% 以上的静态请求应被 cdn 缓存直接响应，无需回源。
缓存控制权：nginx 必须通过响应头明确告诉 cdn：“这个资源能缓存多久？”、“是否可被代理缓存？”、“何时需要重新验证？”

二、nginx 缓存控制头配置：cdn 的“指挥棒”

cdn 无法“猜”你希望缓存多久。它完全依赖你通过 http 响应头传递的指令。nginx 必须精准设置以下关键头部：

头部	作用	推荐值
`cache-control`	控制缓存行为的核心指令	`public, max-age=604800, s-maxage=604800`
`expires`	http/1.0 兼容过期时间	`thu, 31 dec 2030 23:59:59 gmt`
`etag`	资源唯一标识，用于 304 验证	开启
`last-modified`	资源最后修改时间	开启
`vary`	指示缓存是否因请求头不同而不同	`accept-encoding`

2.1 基础配置：为静态资源设置长缓存

假设你的静态资源位于 /var/www/html/assets/，我们配置 nginx 为这些路径设置强缓存：

location ~* \.(jpg|jpeg|png|gif|ico|css|js|woff|woff2|ttf|svg|eot|json|xml)$ {
    root /var/www/html;
    expires 1y;
    add_header cache-control "public, max-age=31536000, s-maxage=31536000";
    add_header etag "";
    add_header last-modified "";
    add_header vary "accept-encoding";
    gzip on;
    gzip_vary on;
    gzip_types text/css application/javascript image/svg+xml application/json;
}

✅ 说明：

expires 1y;：设置过期时间为 1 年（31536000 秒）
cache-control: public：允许中间代理（如 cdn）缓存
s-maxage=31536000：专门针对 cdn 等共享缓存的缓存时间（优先于 max-age）
关闭 etag 和 last-modified 是为了减少响应头体积，提高缓存一致性（见下文）

2.2 为什么关闭 etag 和 last-modified？

虽然 etag 和 last-modified 是 http 标准，用于“条件请求”（304 not modified），但在 cdn 场景下，它们可能带来副作用：

缓存不一致：不同源站节点生成的 etag 可能不同（如基于 inode 或时间戳），导致 cdn 缓存多个版本
增加回源概率：cdn 在缓存过期后会发送 if-none-match 或 if-modified-since 请求，若源站返回 304，cdn 仍需重新缓存，效率降低
性能损耗：每次验证都需要回源，违背 cdn 降低源站压力的初衷

✅ 最佳实践：对静态资源关闭 etag 和 last-modified，依靠文件名版本控制（如 style.v2.1.3.css）实现缓存失效

2.3 带版本号的静态资源命名策略（java 实现）

在 java web 应用中，我们可以通过构建工具（如 maven、gradle）或 spring boot 的 resourceurlencodingfilter 实现资源版本化。

示例：spring boot + maven 实现资源版本化

在 application.yml 中启用资源版本化：

spring:
  web:
    resources:
      cache:
        period: 31536000
      chain:
        strategy:
          content:
            enabled: true
            paths: /**

然后在 thymeleaf 模板中使用：

<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <link rel="stylesheet" th:href="@{/css/style.css}" rel="external nofollow"  />
    <script th:src="@{/js/app.js}"></script>
</head>
<body>
    <img th:src="@{/assets/logo.png}" alt="logo" />
</body>
</html>

spring boot 会自动将请求路径转换为：

/css/style.css?v=abc123
/js/app.js?v=def456
/assets/logo.png?v=ghi789

其中 v=abc123 是文件内容的哈希值（如 sha-256 前 6 位），内容不变则哈希不变，内容一变则哈希变，完美实现缓存强制刷新。

为什么这样设计？
cdn 缓存是基于完整 url 的。/css/style.css?v=abc123 和 /css/style.css?v=def456 是两个不同的 url，因此 cdn 会分别缓存。当你发布新版本时，前端模板生成新的带哈希的 url，cdn 自动拉取新资源，旧资源在缓存过期后自动淘汰。

java 工具类：手动计算资源哈希（用于自定义系统）

package com.example.cdn.util;
import org.springframework.core.io.classpathresource;
import org.springframework.core.io.resource;
import java.io.ioexception;
import java.nio.file.files;
import java.security.messagedigest;
import java.security.nosuchalgorithmexception;
import java.util.base64;
public class resourcehashutil {
    /**
     * 计算资源文件的 sha-256 哈希值（base64 编码，取前8位）
     */
    public static string calculateresourcehash(string resourcepath) {
        try {
            resource resource = new classpathresource(resourcepath);
            if (!resource.exists()) {
                return "00000000"; // 默认值，避免崩溃
            }
            byte[] filebytes = files.readallbytes(resource.getfile().topath());
            messagedigest digest = messagedigest.getinstance("sha-256");
            byte[] hashbytes = digest.digest(filebytes);
            string hash = base64.getencoder().encodetostring(hashbytes);
            return hash.substring(0, math.min(8, hash.length())); // 取前8位
        } catch (ioexception | nosuchalgorithmexception e) {
            return "errorhash";
        }
    }
    public static void main(string[] args) {
        // 测试：计算 /static/css/main.css 的哈希
        string hash = calculateresourcehash("/static/css/main.css");
        system.out.println("css hash: " + hash); // 输出类似: a1b2c3d4
    }
}

在模板中使用：

// 在 controller 中传递版本号
@getmapping("/index")
public string index(model model) {
    string csshash = resourcehashutil.calculateresourcehash("/static/css/main.css");
    string jshash = resourcehashutil.calculateresourcehash("/static/js/app.js");
    model.addattribute("cssversion", csshash);
    model.addattribute("jsversion", jshash);
    return "index";
}

thymeleaf 模板：

<link rel="stylesheet" th:href="@{/css/main.css(v=${cssversion})}" rel="external nofollow"  />
<script th:src="@{/js/app.js(v=${jsversion})}"></script>

✅ 优势：完全自动化，无需手动改名；部署即刷新；兼容所有 cdn；无缓存污染风险。

三、cdn 配置关键项：如何与 nginx 对齐？

cdn 控制台配置往往比 nginx 更复杂，但只要理解其与 nginx 的“对话逻辑”，就能轻松对齐。

3.1 缓存规则配置（以阿里云 cdn 为例）

在阿里云 cdn 控制台中，你需要设置“缓存规则”：

规则类型	模式	缓存时间	说明
所有文件	自定义	365 天	适用于 `.jpg`, `.css`, `.js` 等静态资源
动态文件	自定义	0 秒	适用于 `/api/`, `/user/` 等动态路径
html 文件	自定义	1 小时	避免缓存过久导致页面不更新

重要：不要缓存 html 页面，除非你有完善的版本发布机制（如 ssr + cdn 刷新）。否则用户可能看到旧页面。

3.2 回源配置：nginx 必须“友好”响应

cdn 回源时，会发送以下请求头：

host: yourdomain.com
user-agent: alibaba cloud cdn
x-forwarded-for: cdn节点ip

你需要在 nginx 中：

允许 cdn 回源 ip 访问（安全加固）
忽略 cdn 的缓存头干扰
记录真实客户端 ip

nginx 防盗链 + cdn 回源白名单

# 只允许 cdn 回源和合法用户访问静态资源
map $http_user_agent $block_static {
    default 0;
    "~*alibabacloud" 0;
    "~*qiniu" 0;
    "~*cloudflare" 0;
    "~*akamai" 0;
    "~*amazon cloudfront" 0;
    "~*fastly" 0;
}
# 白名单 cdn ip（示例，需替换为真实 ip 段）
geo $cdn_ip {
    default 0;
    101.226.10.0/24 1;    # 阿里云 cdn
    101.226.11.0/24 1;
    103.245.222.0/24 1;   # cloudflare
    104.16.0.0/12 1;
}
location ~* \.(jpg|jpeg|png|css|js|woff2|ttf|svg)$ {
    root /var/www/html;
    expires 1y;
    add_header cache-control "public, max-age=31536000, s-maxage=31536000";
    add_header vary "accept-encoding";
    # 防盗链：仅允许来自本域名和 cdn 的 referer
    valid_referers none blocked server_names
                   *.yourdomain.com
                   *.alibabacloud.com
                   *.cloudflare.com;
    if ($invalid_referer) {
        return 403;
    }
    # 仅允许 cdn 回源和合法用户访问
    if ($block_static = 0) {
        return 403;
    }
    # 记录真实客户端 ip
    set_real_ip_from 101.226.10.0/24;
    set_real_ip_from 103.245.222.0/24;
    real_ip_header x-forwarded-for;
    real_ip_recursive on;
}

注意：cdn 提供商的回源 ip 段是公开的，务必定期更新

3.3 缓存刷新与预热机制

即使你设置了 1 年缓存，发布新版本时仍需主动刷新 cdn 缓存。

方法一：url 版本化（推荐）✅

如前文所述，使用 style.v2.1.3.css，无需刷新，新 url 自动生效。

方法二：cdn 控制台手动刷新

在阿里云/腾讯云/cloudflare 控制台中，你可以：

刷新单个文件：https://cdn.yourdomain.com/css/style.css
刷新整个目录：https://cdn.yourdomain.com/css/
刷新通配符：https://cdn.yourdomain.com/assets/*

方法三：api 自动刷新（java 实现）

在 ci/cd 流程中，部署新版本后，自动调用 cdn 刷新 api：

package com.example.cdn.service;
import org.springframework.beans.factory.annotation.value;
import org.springframework.http.*;
import org.springframework.stereotype.service;
import org.springframework.web.client.resttemplate;
import java.util.arrays;
import java.util.list;
@service
public class cdncacheservice {
    @value("${cdn.api.url}")
    private string cdnapiurl;
    @value("${cdn.api.key}")
    private string cdnapikey;
    @value("${cdn.api.secret}")
    private string cdnapisecret;
    private final resttemplate resttemplate = new resttemplate();
    /**
     * 刷新 cdn 缓存（以阿里云为例）
     */
    public boolean refreshcache(list<string> urls) {
        httpheaders headers = new httpheaders();
        headers.setcontenttype(mediatype.application_json);
        headers.set("x-acs-accesskey-id", cdnapikey);
        headers.set("x-acs-accesskey-secret", cdnapisecret);
        string jsonbody = "{ \"action\": \"refreshcdnobjectcaches\", \"objectpath\": " + 
                         new objectmapper().writevalueasstring(urls) + ", \"objecttype\": \"file\" }";
        httpentity<string> request = new httpentity<>(jsonbody, headers);
        try {
            responseentity<string> response = resttemplate.postforentity(cdnapiurl, request, string.class);
            return response.getstatuscode().is2xxsuccessful();
        } catch (exception e) {
            system.err.println("cdn 刷新失败: " + e.getmessage());
            return false;
        }
    }
    // 使用示例：在部署脚本中调用
    public void ondeploymentcomplete() {
        list<string> filestorefresh = arrays.aslist(
            "https://cdn.yourdomain.com/css/main.css",
            "https://cdn.yourdomain.com/js/app.js",
            "https://cdn.yourdomain.com/assets/logo.png"
        );
        boolean success = refreshcache(filestorefresh);
        if (success) {
            system.out.println("✅ cdn 缓存刷新成功");
        } else {
            system.out.println("❌ cdn 缓存刷新失败，建议手动操作");
        }
    }
}

四、安全加固：防止 cdn 被滥用

cdn 虽好，但若配置不当，可能成为攻击入口：

风险	防御策略
ddos 攻击放大	启用 cdn 的 ddos 防护、限速、waf
缓存污染	禁止缓存带参数的 url（如 `?id=123`）
源站暴露	限制回源 ip，关闭源站公网访问
敏感文件缓存	禁止缓存 `/admin/`, `/config/`, `/secret/`
cors 配置错误	明确设置 `access-control-allow-origin`

4.1 防止缓存污染：禁止缓存带查询参数的资源

cdn 默认会缓存 style.css?v=123 和 style.css?v=456 为两个资源 —— 这是正确行为。但若用户访问：

/style.css?utm_source=xxx
/style.css?random=123

cdn 会为每个不同参数缓存一份，导致缓存碎片化，浪费存储，降低命中率。

✅ 解决方案：在 nginx 中剥离无用参数

location ~* \.(css|js|png|jpg|jpeg|gif|woff2|ttf|svg)$ {
    root /var/www/html;
    expires 1y;
    add_header cache-control "public, max-age=31536000, s-maxage=31536000";
    # 去除查询参数，只保留文件名
    if ($args != "") {
        rewrite ^(.*)$ $1? permanent;
    }
    # 或者更安全地：只保留特定参数（如 v=）
    if ($args ~* "^(v=[^&]+)&?(.*)$") {
        set $args $1;
    }
    if ($args != "" && $args !~ "^v=") {
        rewrite ^(.*)$ $1? permanent;
    }
}

更优雅的做法：在前端构建时，只允许 v= 参数，其他参数在 nginx 层直接 301 重定向。

4.2 限制源站访问：关闭公网，只允许 cdn 回源

你的 nginx 服务器不应直接暴露在公网。应：

关闭公网 80/443 端口
仅允许 cdn 回源 ip 访问
使用私有网络（vpc）或内网 dns

# 仅允许 cdn 回源 ip 访问
allow 101.226.10.0/24;
allow 103.245.222.0/24;
deny all;
# 此配置应放在 server 块最顶部

4.3 waf 与安全头设置

在 nginx 中添加安全头，增强整体防护：

add_header x-frame-options "sameorigin" always;
add_header x-content-type-options "nosniff" always;
add_header x-xss-protection "1; mode=block" always;
add_header referrer-policy "strict-origin-when-cross-origin" always;
add_header content-security-policy "default-src 'self'; script-src 'self' https://cdn.yourdomain.com; style-src 'self' https://cdn.yourdomain.com; img-src 'self' data: https:; font-src 'self' https://cdn.yourdomain.com;" always;
add_header strict-transport-security "max-age=63072000; includesubdomains; preload" always;

csp 策略说明：明确允许脚本、样式、图片、字体仅从你的域名和 cdn 加载，防止 xss 注入。

五、动静分离与 nginx 路径规划

在真实项目中，nginx 通常同时服务动态请求（java spring boot）和静态资源。必须清晰划分路径。

5.1 推荐目录结构

/var/www/html/
├── assets/          # 静态资源根目录（cdn 缓存）
│   ├── images/
│   ├── css/
│   ├── js/
│   └── fonts/
├── static/          # 本地静态文件（用于回源）
│   └── ...          # 与 assets 同步
└── index.html       # 动态页面（不缓存）

5.2 nginx 路由配置

server {
    listen 80;
    server_name yourdomain.com;
    # 动态请求：转发给 java 后端
    location /api/ {
        proxy_pass http://localhost:8080;
        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;
    }
    # 动态页面：不缓存
    location / {
        root /var/www/html;
        try_files $uri $uri/ /index.html;
        add_header cache-control "no-cache, no-store, must-revalidate";
        add_header pragma "no-cache";
        add_header expires "0";
    }
    # 静态资源：强缓存 + cdn
    location ~* \.(jpg|jpeg|png|gif|ico|css|js|woff|woff2|ttf|svg|json|xml)$ {
        root /var/www/html/assets;
        expires 1y;
        add_header cache-control "public, max-age=31536000, s-maxage=31536000";
        add_header vary "accept-encoding";
        gzip on;
        gzip_vary on;
        gzip_types text/css application/javascript image/svg+xml application/json;
    }
}

关键设计：

/api/ → 转发 java
/ → 返回动态 html（不缓存）
/assets/* → 强缓存（cdn 缓存）

5.3 java 后端与静态资源部署同步

在 spring boot 项目中，静态资源默认放在 src/main/resources/static/，但为了与 nginx /assets/ 对齐，建议：

构建时复制资源：

<!-- maven 插件：构建时复制 static 到 target/assets -->
<plugin>
    <groupid>org.apache.maven.plugins</groupid>
    <artifactid>maven-resources-plugin</artifactid>
    <version>3.3.1</version>
    <executions>
        <execution>
            <id>copy-assets</id>
            <phase>prepare-package</phase>
            <goals>
                <goal>copy-resources</goal>
            </goals>
            <configuration>
                <outputdirectory>${project.build.directory}/assets</outputdirectory>
                <resources>
                    <resource>
                        <directory>src/main/resources/static</directory>
                    </resource>
                </resources>
            </configuration>
        </execution>
    </executions>
</plugin>

部署脚本：

#!/bin/bash
# deploy.sh
# 1. 构建 jar
mvn clean package
# 2. 复制静态资源到 nginx 目录
cp target/assets/* /var/www/html/assets/
# 3. 重启 nginx
sudo systemctl reload nginx
# 4. 调用 cdn 刷新 api（如上 java 示例）
java -jar cdn-refresh-tool.jar

六、监控与日志分析：你知道 cdn 命中率吗？

配置完 cdn 后，你是否知道缓存命中率是多少？

💬 多数团队配置了 cdn，但从未查看过命中率 —— 这是最大的误区。

6.1 nginx 日志格式增强

修改 nginx 日志格式，记录 cdn 是否命中：

log_format cdn_combined '$remote_addr - $remote_user [$time_local] "$request" '
                        '$status $body_bytes_sent "$http_referer" '
                        '"$http_user_agent" "$http_x_forwarded_for" '
                        '$upstream_cache_status';
access_log /var/log/nginx/access.log cdn_combined;

$upstream_cache_status 是关键字段，可能值：

值	含义
`hit`	cdn 缓存命中
`miss`	cdn 未缓存，回源
`expired`	缓存过期，回源验证
`stale`	缓存过期但允许使用（cdn 配置了 stale-while-revalidate）
`updating`	缓存正在更新中
`bypass`	被绕过（如设置了 no-cache）

6.2 日志分析脚本（python）

#!/usr/bin/env python3
# analyze_cdn_hits.py
import re
from collections import counter
log_file = '/var/log/nginx/access.log'
hit_count = 0
miss_count = 0
total = 0
pattern = r'"\s+" \d+ \d+ ".*" ".*" "(.*?)" (\w+)'
with open(log_file, 'r') as f:
    for line in f:
        match = re.search(pattern, line)
        if match:
            upstream_status = match.group(2)
            total += 1
            if upstream_status == 'hit':
                hit_count += 1
            elif upstream_status == 'miss':
                miss_count += 1
if total > 0:
    hit_rate = (hit_count / total) * 100
    print(f"📊 cdn 缓存分析报告")
    print(f"总请求: {total}")
    print(f"命中: {hit_count} ({hit_rate:.2f}%)")
    print(f"未命中: {miss_count} ({(miss_count/total)*100:.2f}%)")
    print(f"✅ 建议目标: >95% 命中率")
else:
    print("❌ 无日志数据")

运行结果：

📊 cdn 缓存分析报告
总请求: 12450
命中: 11873 (95.37%)
未命中: 577 (4.63%)
✅ 建议目标: >95% 命中率

理想值：静态资源 cdn 命中率应 ≥95%。若低于 90%，检查：

是否设置了 s-maxage？
是否缓存了动态参数？
是否频繁刷新？

6.3 cdn 控制台监控面板

阿里云 cdn：控制台 → 数据监控 → 缓存命中率
cloudflare：analytics → cache hit ratio
腾讯云 cdn：监控中心 → 缓存命中统计

建议：设置告警：当命中率 < 90% 持续 10 分钟，发送钉钉/企业微信通知。

七、cdn 与 https：ssl 证书与 hsts 配置

cdn 支持 https 是基本要求。但配置不当会导致：

混合内容警告（http 资源加载在 https 页面）
ssl 握手失败
hsts 未生效

7.1 nginx https 配置

server {
    listen 443 ssl http2;
    server_name yourdomain.com;
    ssl_certificate /etc/ssl/certs/fullchain.pem;
    ssl_certificate_key /etc/ssl/private/privkey.pem;
    ssl_protocols tlsv1.2 tlsv1.3;
    ssl_ciphers ecdhe-rsa-aes256-gcm-sha512:dhe-rsa-aes256-gcm-sha512;
    ssl_prefer_server_ciphers off;
    # 强制 https
    add_header strict-transport-security "max-age=63072000; includesubdomains; preload" always;
    # 静态资源缓存（同前）
    location ~* \.(jpg|css|js)$ {
        root /var/www/html/assets;
        expires 1y;
        add_header cache-control "public, max-age=31536000, s-maxage=31536000";
    }
}

7.2 cdn 侧 ssl 配置

在 cdn 控制台中：

上传证书：将你的证书（.crt + .key）上传到 cdn
启用 https：选择“强制跳转 https”
开启 http/2：提升多路复用性能
开启 ocsp stapling：加快证书验证速度

7.3 避免混合内容（mixed content）

确保前端所有资源使用 https：

<!-- ❌ 错误 -->
<script src="http://cdn.yourdomain.com/app.js"></script>
<!-- ✅ 正确 -->
<script src="https://cdn.yourdomain.com/app.js"></script>
<!-- ✅ 更佳：协议相对 -->
<script src="//cdn.yourdomain.com/app.js"></script>

在 java 后端，可通过 @value 注入 cdn 域名：

@value("${cdn.protocol}://${cdn.domain}")
private string cdnbaseurl;
// 在模板中使用
model.addattribute("cdnurl", cdnbaseurl);

thymeleaf：

<img th:src="${cdnurl} + '/assets/logo.png'" />

八、实战案例：一个电商网站的 cdn 优化之路

假设你负责一个电商网站，日 pv 500 万，静态资源占 70% 带宽。

8.1 优化前问题

首页加载时间：4.2s
源站 cpu 峰值：90%
cdn 命中率：65%
用户反馈：图片加载慢，尤其海外用户

8.2 优化方案

措施	效果
1. 静态资源迁移到 `/assets/` 目录	✅
2. nginx 设置 `expires 1y` + `s-maxage=31536000`	✅
3. 资源路径加入哈希版本：`style.a1b2c3.css`	✅
4. 禁用 etag / last-modified	✅
5. cdn 缓存规则：`.css`、`.js`、`*.png` 缓存 1 年	✅
6. 限制源站访问：仅允许 cdn 回源 ip	✅
7. 启用 gzip + brotli 压缩	✅
8. 部署脚本自动调用 cdn 刷新 api	✅
9. 设置监控告警：命中率 < 90% 发送告警	✅

8.3 优化后结果（1 周后）

指标	优化前	优化后	提升
首页加载时间	4.2s	1.1s	↓74%
源站 cpu 峰值	90%	15%	↓83%
cdn 命中率	65%	98.2%	↑33%
海外用户加载时间	6.8s	1.9s	↓72%
月带宽成本	¥8,200	¥2,100	↓74%

结论：cdn + nginx 协同优化，不仅能提升体验，还能直接节省成本。

九、常见陷阱与避坑指南

陷阱	正确做法
❌ 缓存 html 页面	✅ 仅缓存静态资源，html 设置 `no-cache`
❌ 使用 `cache-control: no-cache` 但没设 `max-age`	✅ `no-cache` 表示需验证，但可以缓存；若不想缓存，用 `no-store`
❌ cdn 缓存带参数的 url	✅ 剥离 `utm_`, `random`, `t=` 等参数
❌ 没有设置 `vary: accept-encoding`	✅ 否则 cdn 可能缓存未压缩版本，返回给支持 gzip 的用户
❌ nginx 与 cdn 缓存时间不一致	✅ nginx 设置 `s-maxage`，cdn 设置相同值
❌ 使用 `etag` 做版本控制	✅ 使用文件名哈希，避免 etag 不一致
❌ 没有监控命中率	✅ 每周分析日志，设置告警

十、未来展望：cdn + edge computing 的演进

随着 cloudflare workers、aws lambda@edge、阿里云边缘函数的普及，cdn 已不再只是“缓存服务器”，而是边缘计算平台。

你可以：

在边缘节点动态修改响应头
根据用户地理位置返回不同语言的 css
在 cdn 层做 a/b 测试
拦截恶意请求，无需回源

趋势：nginx 逐步退居“核心源站”，cdn 成为“智能边缘网关”。

未来架构可能演变为：

用户 → cdn (edge function) → [可选：nginx 原站] → java 微服务

此时，nginx 的角色从“全能服务器”变为“可靠后端”，而 cdn 承担了更多智能路由与安全过滤职责。

结语：构建高性能静态分发体系，是每个工程师的必修课

静态资源分发，看似是“前端小事”，实则是影响用户体验、系统稳定性、运维成本的核心基础设施。

你今天配置的每一个 expires、每一个 cache-control、每一个回源 ip 白名单，都在为千万用户节省毫秒级的等待时间。

记住：

cdn 不是“可选”，而是“必须”
nginx 不是“转发器”，而是“指挥官”
缓存不是“越久越好”，而是“越准越好”

通过本文的系统性梳理，你已掌握：

✅ nginx 缓存头的精准配置
✅ java 动态版本化资源的实现
✅ cdn 回源安全加固
✅ 缓存命中率监控与分析
✅ 防盗链、https、csp 安全加固
✅ 架构演进方向

现在，是时候回到你的项目，检查 /assets/ 目录的缓存策略了。

别再让用户的浏览器，等你 3 秒加载一张 200kb 的图片了。

你的一行配置，可能改变千万人的体验。

静水流深，cdn 无声，但用户感知一切。

以上就是nginx与cdn协同配置的最佳实践的详细内容，更多关于nginx与cdn协同配置的资料请关注代码网其它相关文章！


验证码：

Nginx与CDN协同配置的最佳实践

2026年07月22日 • Php •我要评论

引言