关于在 nodejs 中使用 jimp 处理图片

标签：情况下   long   resize   替代品   方式   功能   imp   需求   想法   

今天项目新增了一个功能，我把项目更新到我的服务器后进行了测试，发现在图片未加载完全时，使用新功能会另第一次点击返回按钮失败，第二次点击返回按钮会返回到初始的新标签。于是我便萌生了图片上传后保存一个该图片的 min 版，并在非全屏展示图片情况下使用 min 版图片。

一开始我想使用 canvas 来进行这项工作，但是消耗了几个小时后，看着一堆前置配置，再看了看自己的学生云主机，便放弃了使用这个模块的想法。一番搜索后，我找到了一个替代品-----sharp，在尝试下载后，卡死在了依赖下载中，于是放弃了这个模块。

之后，我使用了 sharp + canvas 进行搜索，发现了一个无任何依赖的模块-----jimp，简单的查看了一下这个模块在 npm 的介绍，觉得完全符合我的需求，便下载了这个模块。这个模块的下载过程一帆风顺，比前面两个大哥痛快太多了。下载完之后，马上使用。

相比 canvas 而言，这个模块用来修改图片大小特别简单，只需要 jimp.read(图片名).then(图片=>{return 图片.resize(宽度, 高度).write(保存位置+图片名)})，可比 canvas 先 new 一个 Image 然后设置 src 再监听 onload 事件快捷多了。

知道了使用方式后，我便按照我的需求写起了代码。我现在需要使用 base64 或者 buffer 创建一个最大宽或高为 400 的图片，因此我需要获取图片的宽和高，可是使用说明中并未说明如何获取图片的宽高啊。于是便去搜索了一下，在该模块GitHub的issue中找到了答案。只需要在 then 中，调用 图片.bitmap 的 width 和 height 属性即可。最后，我便得到了以下代码：

      Jimp.read(dataBuffer).then(img => {
        const imgWidth = img.bitmap.width;
        const imgHeight = img.bitmap.height;
        const length = 400;
        const isWidthLonger = imgWidth > imgHeight ? true : false;
        const time = (isWidthLonger ? imgWidth : imgHeight) / length;

        const rWidth = imgWidth / time;
        const rHeight = imgHeight / time;
        return img.resize(rWidth, rHeight ).write(`./public/img/${hash}.min.${file.match(/\w*(?=;)/)}`);
      });

注：file变量为 base64 格式字符串，使用正则是为了获取其图片格式。

关于在 nodejs 中使用 jimp 处理图片

标签：情况下   long   resize   替代品   方式   功能   imp   需求   想法   

原文地址：https://www.cnblogs.com/FreezeNow/p/12174004.html