Node.js 使用 Sharp 包进行图片上传、处理和调整大小

在本文中，我们将讨论如何使用 Sharp 包和示例在 Node.js 中进行图片上传、处理和调整大小。

许多Web 应用程序（例如在电子商务网站中使用个人资料图片或产品图片）必须管理多种图像格式和其他格式。通常，困难在于在不损害图像质量的情况下减小这些图像的大小。为了确保每张图像都能在各种设备和屏幕分辨率上正确显示，此过程通常涉及生成每个图像的可伸缩、优化副本。在 Web 开发中，平衡文件大小、图像质量和性能需要使用适当的图像存储策略和压缩技术。

模块：Sharp、Multer

根据官方 npm 文档，Sharp 经常用于将 JPEG、PNG 和 WebP 等广泛使用的格式的巨大图像转换为更小、更优化且适合 Web 的版本。由于这种转换，图像可以调整大小和压缩到不同的尺寸，从而确保更快的加载时间和改进的在线性能。特别是对于需要快速图片交付和有效数据管理的网站和应用程序，Sharp 的功能使其非常适合将高分辨率照片缩小到更易于管理的大小，而不会影响质量，从而改善用户体验。

什么是 Sharp 模块？

Sharp 是一个快速的 Node.js API 模块，可用于将大型图像转换为更小、更易读的格式，如 JPEG、PNG、WebP、GIF 和 AVIF。其大小可以更改。与 Node-API v9 兼容的 JavaScript 运行时，例如 Node.js 版本（~18.17.0 或 >= 20.3.0）、Deno 和 Bun。Sharp 使用 libvips 提供比最快的 ImageMagick 和 GraphicsMagick 设置快 4-5 倍的图片缩放速度。在处理过程中，它通过精确处理颜色空间、alpha 透明通道和嵌入的 ICC 配置文件来确保质量。此外，Sharp 在支持各种图像操作（例如伽马校正、合成、旋转和提取）的同时，保持出色的性能和质量。

什么是 Multer 模块？

Multer 是 Node.js 的一个强大中间件，它简化了 multipart/form 数据处理，该数据通常用于 Web 应用程序中的文件上传。它基于 Busboy 构建，可确保在管理文件上传时实现最高效率。此中间件专门设计用于处理包含文件数据的表单，这意味着它不会处理任何不使用 multipart/form-data 编码类型的表单。当提交包含文件上传的表单时，Multer 会处理数据并将正文对象和文件对象附加到请求对象。

Multer 是在 Node.js 应用程序中有效、安全和灵活地管理文件上传的重要工具，因为它提供了多种配置选项，包括用于指定文件保存位置和方式的存储引擎，以及设置文件大小和类型限制以更好地控制上传的能力。正文对象表示表单中任何文本字段的值，而文件对象包含实际上传的文件。根据表单字段，文件对象可以是单个文件或文件数组。

示例

让我们举一个例子来说明如何在 Node.js 中使用 Sharp 包上传、处理和调整图像大小。

输出

No file uploaded

说明

此 Node.js 应用程序使用 Express、Multer 和 Sharp 来管理图像上传和调整大小。Multer 首先配置了一个存储引擎，该引擎根据当前时间戳创建唯一的 文件名，并将上传的图像存储在 ./uploads 目录中。/upload 端点处理图像上传，它保存文件，然后使用 Sharp 将其大小调整为 300x300 像素。当调整大小成功时，调整大小图像的路径作为响应返回，并以 -resized 后缀保存。如果出现任何错误，则返回相关的错误消息。最后，服务器在端口 3000 上侦听传入请求。