介绍

有段时间我发现博客访问速度很慢，经过排查后发现卡顿的原因是由于文章上的图片太大，在访问时需要很高的带宽。我们这种个人使用的服务器，一般情况下带宽也不会很高，又不愿意花钱提升带宽，所以就搭建了WebP Server。

WebP Server是github上的一个开源项目，它有用java写的webp_server_java，也有用Go写的webp_server_go，还有些其他语言就不再说明，我这边使用的是webp_server_go。

webp_server_go的功能是将图片的格式转换成webp格式。webp格式是google建议使用的一种图片格式，google表示在相同图片质量的情况下，webp格式要比JPEG小40%，和其他格式相比，也会小很多。

因此，我们如果使用webp_server_go服务将网站上的所有图片转换成webp格式，那么在访问系统时，图片大小缩小了，对带宽的要求也就降低了，系统的访问速度也就自然提升了。

安装

由于webp_server_go要求依赖的版本较高，如果是CentOS 8的系统，就可以使用DNF(YUM)进行安装，但我这里是CentOS 7，想安装这些高版本的依赖，就只能通过编译。这些依赖包含make、gcc这些涉及到底层的，使用编译安装的话比较复杂，并且出错的风险也高，所以就直接使用Docker安装了。

CentOS 7安装Docker就不在本篇文档上写了，如有需要，请访问：CentOS7安装Docker

1、拉取镜像并运行

对于我这种云服务器来说，有外网就可以直接拉去Docker Hub中的镜像。如果你的环境是没有外网的，则需要找台有外网的将镜像拉取下来，再上传到服务器中。

由于我这里是有外网就直接运行了，run命令会检查系统中是否有镜像，如果没有镜像，则直接去Docker Hub上拉去；如果有镜像，则直接运行。

[root@VM-8-8-centos ~]# docker run -d -p 3333:3333 -v /home/halo/.halo:/opt/pics  -v /home/halo/.halo/cache:/opt/exhaust --name webps webpsh/webps

说明：

-d 后台允许容器并将容器ID打印到控制台
-p 容器的端口映射到主机
-v 绑定容器的卷，可以简单理解为将宿主机的目录指定到容器中，冒号左边是宿主机的目录，冒号右边是容器中的目录
–name 容器的名称

2、查看运行的Docker容器

在运行容器后，我们就需要查看容器的ID，因为无论是进入容器中，还是运行或停止容器，都需要容器的ID。

[root@VM-8-8-centos ~]# docker ps

3、进入到容器中

得到容器的ID后，我们就可以使用命令进入到容器内部。

[root@VM-8-8-centos ~]# docker exec -it 09ef30c5c1f8 /bin/sh

4、修改config.json文件

进入到容器内后，我们就需要配置webp_server_go服务的参数文件了。镜像中默认位置是在/etc目录下，名为config.json。

/opt # vi /etc/config.json

  "HOST": "0.0.0.0",
  "PORT": "3333",
  "QUALITY": "80",
  "IMG_PATH": "/opt/pics",
  "EXHAUST_PATH": "./exhaust",
  "ALLOWED_TYPES": ["jpg","png","jpeg","bmp"],
  "ENABLE_AVIF": false
}

说明：

HOST 服务的主机名(IP),"0.0.0.0"表示所有，无特殊需求不需要修改
PORT 服务的端口号,默认即可，无特殊需求不需要修改
QUALITY 转换的的质量，默认80，根据实际需要修改
IMG_PATH 需要转换的文件存储目录，docker下默认存储到/opt/pics，无法修改，非docker请根据实际环境修改
EXHAUST_PATH 转换后的文件目录，docker下默认存储到/opt/pics，无法修改，非docker请根据实际环境修改
ALLOWED_TYPES 需要转换的文件格式
ENABLE_AVIF 是否开启转换成AVIF，默认关闭(false)，暂不建议开启。开启后转换成AVIF会消耗CPU，并且我简单测试发现，同样转换的质量(80)，webp格式比AVIF格式要小很多。

5、查看容器的IP

配置好服务后，我们需要查看当前容器的IP地址，为配置NGINX做准备。

/opt # ifconfig

6、退出容器并配置nginx

记录IP地址后，我们就可以退出容器了。

/opt # exit

在退出容器后，我们进入到nginx的目录，然后配置nginx.conf文件。将文章中的text文件部分，复制到nginx.conf中的server部分。

[root@VM-8-8-centos conf]# vim nginx.conf

location ^~ /upload/ {
        proxy_pass http://172.17.0.2:3333;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_hide_header X-Powered-By;
        proxy_set_header HOST $http_host;
        expires 7d;
}

说明：

proxy_pass 设置代理服务器的协议和地址，以及位置应该映射到的URI。作为协议时，可以指定“http”或“https”。地址可以指定为域名或IP地址，并可选端口。
proxy_set_header 允许重新定义或追加字段到传递给代理服务器的请求头。
proxy_hide_header 指定不会被传递的附加字段。默认情况下，nginx不会传递报头字段"Date"、“Server”、"X-Pad"和"X-Accel"从代理服务器到客户端的响应中。
expires 指定过期时间

7、重启容器

在配置完成后，需要重新启动一次容器。

[root@VM-8-8-centos conf]# docker restart 09ef30c5c1f8

结果

所有访问都是在禁用google浏览器缓存的情况下：

启用webp_server_go前

从下图可以看到文件都是在几MB的大小
Before_optimization

优化webp_server_go后

从下图可以看到文件都在100-200KB左右
After_optimization

目录CONTENT

使用Docker安装WebP Server

介绍

安装