宝塔面板WebP图片自动转换设置方法

想让网站图片加载更快、带宽更省，又不想手动替换每一张JPEG或PNG？本文手把手教你利用宝塔面板实现WebP图片的智能按需转换——无需修改源文件，通过启用Nginx WebP模块、配置Accept头协商重写规则、批量生成静态.webp副本，甚至可选升级支持WebP的定制Nginx，轻松为现代浏览器自动提供体积减少30%~50%、画质更优的WebP图片，同时完美兼容不支持WebP的老设备，兼顾性能、体验与运维简易性。

如果您在宝塔面板中部署的网站需要为访问者提供更小体积、更高画质的图片资源，但原始上传的仍是JPEG或PNG格式，可通过配置WebP自动转换实现按需响应。以下是实现此功能的具体步骤：

一、启用Nginx的WebP支持模块

Nginx需编译或加载ngx_http_image_filter_module及额外WebP解码能力，宝塔默认未开启WebP识别与响应协商。需手动确认模块存在并启用WebP MIME类型声明。

1、登录宝塔面板，进入【软件商店】→ 找到已安装的Nginx → 点击【设置】→【配置修改】。

2、在http块内（即server块之外、大括号包围的全局区域）查找是否存在types段，若无则添加以下内容：

types { image/webp webp; }

3、在http块末尾追加以下map指令，用于根据Accept请求头判断客户端是否支持WebP：

map $http_accept $webp_suffix { "~*webp" ".webp"; }

二、配置站点的WebP重写规则

该步骤通过location匹配图片路径，并结合try_files尝试返回同名.webp文件；若.webp不存在，则回退原图，确保兼容性。

1、在宝塔面板中，进入【网站】→ 找到目标站点 → 点击【设置】→【配置文件】。

2、在server块内、location ~ .*\.(jpg|jpeg|png|gif)$ { ... } 区域前插入以下配置：

location ~ .*\.(jpg|jpeg|png|gif)$ { add_header Vary Accept; try_files $uri$webp_suffix $uri =404; }

3、保存配置文件后，点击【重载配置】使Nginx生效。

三、使用宝塔插件生成WebP静态文件

依赖运行时动态转换可能增加CPU负载，推荐预先批量生成WebP副本并存放于相同路径，提升响应速度与稳定性。

1、在宝塔【软件商店】中搜索并安装【ImageMagick】或【GraphicsMagick】插件（任选其一）。

2、进入【终端】，切换至网站根目录，执行批量转换命令（以ImageMagick为例）：

find ./ -type f \( -iname "*.jpg" -o -iname "*.jpeg" -o -iname "*.png" \) -exec convert {} -quality 85 {}.webp \;

3、执行完成后，将所有生成的*.webp文件重命名去除重复后缀（如xxx.jpg.webp → xxx.jpg.webp），可使用sed或rename命令批量处理：

rename 's/\.jpg\.webp$/.webp/; s/\.jpeg\.webp$/.webp/; s/\.png\.webp$/.webp/' *.webp

四、启用Nginx第三方WebP模块（可选高级方案）

使用openresty或编译nginx_with_webp模块可实现无损条件转发与自动压缩，无需预生成文件，适合动态图床类站点。

1、备份当前Nginx配置，卸载宝塔内置Nginx，通过【编译安装】方式部署含webp支持的定制版Nginx。

2、在编译参数中加入--add-module=/path/to/nginx-webp-module。

3、配置中启用webp_filter on; 并设定webp_filter_quality 82; 等指令控制输出质量。

注意：此操作将替换宝塔托管的Nginx服务，可能导致面板部分功能异常，须谨慎操作并保留快照。

今天关于《宝塔面板WebP图片自动转换设置方法》的内容介绍就到此结束，如果有什么疑问或者建议，可以在golang学习网公众号下多多回复交流；文中若有不正之处，也希望回复留言以告知！