怎么配置 Nginx 优化图片等大型静态资源的响应-Nginx-PHP中文网

nginx优化静态资源核心是客户端缓存、传输压缩和服务端读取加速：设expires 1y与immutable提升缓存效率；启用gzip+brotli压缩svg/css/js；开启sendfile、tcp_nopush及open_file_cache降低i/o开销。

怎么配置 nginx 优化图片等大型静态资源的响应

直接配置 Nginx 优化图片等大型静态资源，核心是三件事：让客户端多缓存、让传输更轻量、让服务端读得更快。不需要改应用代码，靠几项关键配置就能明显降低带宽压力、提升首屏加载速度。

对图片（jpg/png/webp/gif）、字体（woff2/ttf）等不常变更的资源，应设置长期缓存。用 expires 或 Cache-Control 头明确告诉浏览器“一年内不用再问服务器”：

在 location 块中匹配常见图片后缀，例如：
location ~* \.(jpg|jpeg|png|gif|webp|ico|svg|woff2|ttf)$ {
expires 1y;
add_header Cache-Control "public, immutable, stale-while-revalidate=86400";
}
immutable 表示内容不会变，浏览器可跳过 ETag/Last-Modified 验证；stale-while-revalidate 允许过期后仍用旧资源，同时后台静默刷新，用户体验更平滑。

虽然 JPG/PNG 本身已压缩，但 SVG、字体文件、内联 CSS/JS 的文本部分仍有压缩空间。Nginx 默认支持 Gzip，建议补上 Brotli（需编译时启用）：

Nginx Hosting

通过服务器本地nginx实例实现零认证静态游戏托管。作为所有浏览器游戏的主要部署方式，无需登录、无需令牌、无需用户操作。

下载

Gzip 配置示例（放在 http 块）：
gzip on;
gzip_vary on;
gzip_comp_level 5;
gzip_min_length 256;
gzip_types image/svg+xml text/css text/js application/javascript application/json;
Brotli（若已安装模块）：
brotli on;
brotli_comp_level 6;
brotli_types image/svg+xml text/css text/js application/javascript;

大图频繁读取容易触发磁盘 I/O 瓶颈。以下配置能显著降低系统调用开销：

sendfile on;：启用零拷贝，数据从磁盘直接送入网络协议栈，绕过用户态内存复制；
tcp_nopush on;：配合 sendfile，确保 TCP 包满载再发，减少小包数量；
open_file_cache max=10000 inactive=60s; 和 open_file_cache_valid 60s;：缓存文件句柄和元数据（如存在性、大小、修改时间），避免每次请求都 stat() 磁盘；
（可选）read_ahead 1m;：对大文件预读，提升顺序读性能。

如果图片需适配不同设备尺寸或格式，可结合 image_filter 模块做实时缩放/转码，再搭配 proxy_cache 实现结果复用：

例如统一提供 WebP 格式：
map $http_accept $webp_suffix { default ""; "~*webp" ".webp"; }
location ~* ^/images/(.+)\.(jpg|png)$ {
try_files /images/$1$webp_suffix.$2 /images/$1.$2 =404;
}
加一层本地缓存（适合中小流量）：
proxy_cache_path /data/cache/image levels=1:2 keys_zone=img_cache:20m max_size=5g;
location /images/ { proxy_cache img_cache; proxy_cache_valid 200 30d; }