核心是用map将UA归一化为mobile/weapp/tablet/desktop四类稳定标识,再通过proxy_cache_key包含$device_type、add_header X-Device-Type $device_type和Vary X-Device-Type实现多端缓存隔离,避免缓存污染。

Nginx 适配不同客户端设备的核心不是“识别后跳转”,而是让缓存系统能区分并分别存储 PC、移动端、小程序等返回的内容,避免一个设备的响应被另一个设备错误复用(即缓存污染)。关键不在 UA 判断本身,而在如何让这个判断结果参与缓存决策。
用 map 归类 User-Agent,生成稳定设备标识
User-Agent 字符串太长、变体太多,直接拿它做缓存依据会极大降低命中率。正确做法是用 map 指令把它压缩成几个确定值:
map $http_user_agent $device_type {
~*"(iPhone|Android|Mobile|BlackBerry|Opera Mini)" "mobile";
~*"(MiniProgram|MicroMessenger|miniip|mp-weixin)" "weapp";
~*"(iPad|Tablet|Nexus 7|Kindle)" "tablet";
default "desktop";
}这段配置放在 http { } 块里,全局生效。它把千差万别的 UA 映射为 mobile/weapp/tablet/desktop 四个稳定字符串,后续所有逻辑都基于 $device_type,而不是原始 UA。
给响应打标,并告诉缓存系统“按设备分存”
光有变量还不够,得让浏览器、CDN、Nginx 自身的 proxy_cache 都知道:这个资源的内容会因设备而异。
add_header X-Device-Type $device_type; add_header Vary X-Device-Type;
这两行加在 server 或 location 块里。X-Device-Type 是你自定义的标识头,Vary 则明确告诉所有中间缓存:“请把 X-Device-Type 的值纳入缓存键计算”。这样,X-Device-Type: mobile 和 X-Device-Type: desktop 就会命中两个完全独立的缓存项。
让 proxy_cache_key 包含设备类型
如果你启用了 proxy_cache(反向代理缓存),必须确保缓存键里包含 $device_type,否则 Vary 头形同虚设:
proxy_cache_key "$scheme$request_method$host$uri$is_args$args$device_type"; # 或更推荐(避免 args 干扰): proxy_cache_key "$scheme$request_method$host$uri$device_type";
只要 key 里有 $device_type,Nginx 就会为每个设备类型创建独立缓存条目。
按设备类型设置差异化缓存策略
不同终端对内容更新敏感度不同。比如移动端用户网络不稳定,可适当延长静态资源缓存;PC 端 HTML 可能更频繁更新,缓存时间就该短些:
- 移动端 HTML:
Cache-Control: public, max-age=1800 - PC 端 HTML:
Cache-Control: public, max-age=600 - 静态资源(JS/CSS/图片):统一
public, max-age=31536000, immutable,且不加 Vary——它们本就不因设备而变
实现方式可用 if + add_header,或更清晰的 map + add_header 组合:
map $device_type $html_cache_control {
mobile "public, max-age=1800";
weapp "public, max-age=1800";
default "public, max-age=600";
}
add_header Cache-Control $html_cache_control;验证是否真正生效
上线前务必检查三点:
- 用
curl -I -H "User-Agent: Mozilla/5.0 (iPhone..." https://yoursite.com/,确认响应头含X-Device-Type: mobile和Vary: X-Device-Type - 同一 URL,换 PC UA 请求,
X-Device-Type应为desktop,且X-Cache(或你自定义的缓存命中头)显示MISS或HIT独立于移动端 - 查看 Nginx error log 或用
log_format记录$device_type和$upstream_cache_status,确认不同设备请求确实走了不同缓存路径
不复杂但容易忽略


















