用轻量服务器搭建imgproxy来获取不同尺寸的图片

现在很多站长都喜欢搭建一个自己的私有图床来管理图片,使用的一般都是第三方的开源图床程序。有时候可能第三方的图床程序不能完全满足我们的需要,比如说,我们上传了一张图片以后,在不同的页面下,会要求显示不同的分辨率。常见的在图片列表页面显示的64*64的小缩略图,在瀑布流模式下显示的中型尺寸图片,以及原图模式下显示的完全尺寸的原图。除此之外,我们也可能会想对图片进行压缩来节省流量,比如上传的png图片,但是显示的时候来显示jpeg图片来加快用户的访问速度。针对这些需求,要怎么办呢?

经过我的谷歌搜索,终于发现了这么一款神奇的应用imgproxy,官方网站是imgproxy.net/。通过名字就知道,这是一个图片代理服务,简单的来说,这个软件会反代真正的图片地址,当请求图片的时候,请求的是imgproxy的图片地址,然后imgproxy再去请求原始图片,将其转换为要求的尺寸和格式以后,再发送给用户。除了这些以外,imgproxy还可以对原始图片进行模糊化、旋转、亮度调节、加水印等很多功能,具体可以去看官方的文档说明。

官方也给了一个其工作的原理图。从下图中可以看出,可以在imgproxy前面再配一层CDN来缓存已经配置好的图片。

QQ截图20211127140122.png

话不多说,下面开始教程,有需要的小伙伴可以跟着部署一下。

购买服务器

如果没有服务器的话,需要先购买一台腾讯云的轻量服务器。

轻量应用服务器(TencentCloud Lighthouse)是新一代开箱即用、面向轻量应用场景的云服务器产品,助力中小企业和开发者便捷高效的在云端构建网站、小程序/小游戏、电商、云盘/图床以及各类开发测试和学习环境,相比普通云服务器更加简单易用,提供高带宽流量包并以套餐形式整体售卖基础云资源,将热门开源软件融合打包实现一键构建应用,是您使用腾讯云的最佳入门途径。为了方便安装应用,我们需要准备Docker环境。

Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的Linux或Windows操作系统的机器上,也可以实现虚拟化,容器是完全使用沙箱机制,相互之间不会有任何接口。使用docker来部署应用是非常简单的,一般情况下,只需要一行命令即可完成。

腾讯云经常举办各种活动,可以点击这里进入他们的活动页面进行购买,可以选择距离最近的区域购买,不过不想备案的话,可以选择境外的服务器(比如香港区域)进行购买。镜像的话,选择【官方镜像】下的【docker基础镜像】,实例套餐选择适合自己的,然后提交订单,付款即可。如果不选择【Docker基础镜像】,后面需要自行安装docker容器。

d3e32e78deebb95c6bcce464da8c52d6.png

安装docker

如果没有选择docker基础镜像,则需要自行安装docker镜像。这里假设使用的Ubuntu系统。安装docker的步骤如下

sudo apt-get update
sudo apt-get install ca-certificates curl gnupg lsb-release
curl -fsSL https://download.docker.com/linux/ubuntu/gpg | sudo gpg --dearmor -o /usr/share/keyrings/docker-archive-keyring.gpg
echo \
  "deb [arch=$(dpkg --print-architecture) signed-by=/usr/share/keyrings/docker-archive-keyring.gpg] https://download.docker.com/linux/ubuntu \
  $(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
sudo apt-get update
sudo apt-get install docker-ce docker-ce-cli containerd.io
复制代码

安装imgproxy

imgproxy的安装十分简单,简单的只需要一行命令就可以搞定

docker run -d   --name imgproxy --restart always  -p 8081:8080   darthsim/imgproxy
复制代码

上面命令运行结束以后,imgproxy就已经运行起来了。我们可以测试一下效果

首先打开 http://ip:8081,可以看到下面的页面

QQ截图20211127140942.png

说明imgproxy已经正常启动了。我们尝试让其代理一下nasa的这张2000*1125的这张大图来测试一下效果

原图

https://www.nasa.gov/sites/default/files/thumbnails/image/pia22228.jpg
复制代码

b08a9b6f173b06c3e7010f753021ebae.jpeg

将其转换为 400*400的图片

http://ip:8081/xxxxxx/resize:fill:400:400:0/plain/https://www.nasa.gov/sites/default/files/thumbnails/image/pia22228.jpg@png
复制代码

其中 xxxxxx 代表签名字符串,默认启动的docker容器没有开启签名功能,因此这个签名参数可以任意填写,我这里填写的xxxxx。 resize代表指示imgproxy要调整图片的大小,fill代表调整大小的模式是填充模式,一共有fit、fill、fill-down、force、auto五种模式可以选。400:400这个代表分辨率调整到400*400,后面的0代表是否启用enlarge模式,这个模式如果被启用,如果给定的大小大于图片的原始大小的话,imgproxy会放大图片。 plain表示后面的图片地址是明文模式。plain后面就是原始图片的地址。最后@png代表要将原始的jpeg图片转换为png格式。 更多处理参数可以查看原始文档 docs.imgproxy.net/generating_…

访问上面的地址,已经变成了400*400的中等图片了。

QQ截图20211127141559.png

将其转换为200*200的图片,并旋转90度

http://ip:8081/xxxxxx/resize:fill:200:200:0/rot:90/plain/https://www.nasa.gov/sites/default/files/thumbnails/image/pia22228.jpg@png
复制代码

QQ截图20211127144916.png

配置imgproxy

可以通过环境变量来配置imgproxy,改变其工作模式。下面说一下我用的几个参数。其余更多的配置项可以参考官方文档docs.imgproxy.net/configurati…

IMGPROXY_READ_TIMEOUT #读取原始图片的时间,如果imgproxy和原始图片的服务器之间的网络不是太好的话,可以适当调整这个参数
IMGPROXY_MAX_SRC_RESOLUTION #原始图片最大分辨率,默认是16.8,单位是百万像素,例如,如果一个图片的分辨率是5000*5000,其像素个数是25000000,即25百万像素,这个图片就会被拒绝处理。如果我们的原始图片有很多大图的话,就需要调整这个值了
IMGPROXY_MAX_SRC_FILE_SIZE #和上面的参数类似,指定原始图片的最大大小,默认不限制
IMGPROXY_ALLOWED_SOURCES #设置允许的原始图片地址,用逗号隔开,这样可以防止别人滥用服务。
复制代码

综上,启动imgproxy的命令可以是

ocker run -d   --name imgproxy --restart always  --env "IMGPROXY_MAX_SRC_RESOLUTION=25"  --env "IMGPROXY_ALLOWED_SOURCES=https://img.xxxx.cc/,https://img.yyyy.cc/"  --env="IMGPROXY_READ_TIMEOUT=1000"  darthsim/imgproxy
复制代码

上面讲的内容可以满足一般用户的需要,除此之外,imgproxy还支持更高级的防滥用机制,那就是签名参数。不过这个方法需要自己在后台生成签名的url,不能在前端直接拼接,因此我暂时没有用到,有兴趣的小伙伴可以研究一下

最后

imgproxy的功能是十分强大的。当然如果小伙伴觉得使用起来很麻烦的话,可以直接试试腾讯云的COS,使用起来更加简单容易。

Guess you like

Origin juejin.im/post/7035141646937391118