可通过nginx的map指令根据user-agent、referer等请求头动态映射清晰度变量，结合try_files实现多级降级分发，并通过vary头和独立缓存键保障不同清晰度资源正确缓存。
可以通过 Nginx 的 map 指令，根据请求头（如 User-Agent、Referer 或自定义 Header）动态映射出不同清晰度的图片路径或后缀，再结合 try_files 或 rewrite 实现资源分发。
定义清晰度映射规则
在 http 块中使用 map 根据来源特征设定变量，例如区分移动端、PC 端或特定域名引用：
- 用
$http_user_agent判断是否为移动设备，映射为mobile或desktop - 用
$http_referer匹配白名单域名，决定是否启用高清资源 - 支持多条件组合，例如：
~* (iPhone|Android)→2x，~* example\.com→hd
构造带清晰度标识的资源路径
将 map 得到的变量拼入图片路径。常见做法有：
- 后缀区分：
/img/logo.png→ 实际尝试/img/logo@2x.png（若存在）或回退原图 - 目录区分：
/img/desktop/logo.png和/img/mobile/logo.png - 查询参数透传：
/img/logo.png?dpr=2配合后端或 CDN 动态生成
在 location 中应用映射结果
在 server 或 location 块中，用 try_files 优先查找高清晰度版本，不存在则降级：
location /img/ {
try_files /img/$quality/$uri /img/$quality/${uri}.webp /img/$uri /img/${uri}.webp =404;
}
其中 $quality 是 map 定义的变量（如 2x、hd、default），确保目录结构与之对应。
配合 MIME 类型与缓存优化
清晰度切换不应影响响应头一致性：
- 用
add_header Vary "User-Agent, Referer"告知缓存层需按来源区分缓存 - 对
.webp等现代格式，检查浏览器支持（通过$http_accept映射）再决定是否替换后缀 - 静态资源建议开启
expires，但不同清晰度版本需独立缓存键，避免混用
