本技能用于图像处理与优化,主要面向上传、压缩、格式转换与分发场景。
用途:生成多尺寸图片变体、转换 WebP/AVIF、制作缩略图,并通过 CDN 或云存储提供图片。
主要能力:
- Sharp(Node.js,推荐):用 resize、fit、withoutEnlargement 生成 1200/400/100 等尺寸变体,输出 WebP。
- Express 上传流程:用 multer 限制文件大小(如 10MB),用 sharp metadata 校验格式(jpeg、png、webp),再上传 S3。
- Cloudinary(托管服务):uploader.upload 支持质量与格式自动优化;cloudinary.url 支持按 URL 变换(crop、gravity: face、format 等)。
- Pillow(Python):Image.open、thumbnail、转换为 RGB、保存 WEBP。
- 响应式图片 HTML:使用 picture、source srcset/sizes 与 img 的 loading、decoding 属性。
使用方式:安装并导入对应库;Node.js 用 import sharp from 'sharp',Python 用 from PIL import Image;Cloudinary 通过 cloud_name、api_key、api_secret 配置。
限制与注意:
- 资料为代码示例,未提供具体安装命令、依赖版本、价格或性能数据,暂未提供。
- 反模式包括在请求处理器中处理图片、只存原图、不转换格式、不校验大小、由应用服务器直接提供图片;建议改用后台队列、上传时生成多尺寸、转换为 WebP/AVIF、先校验、使用 CDN。
- 生产检查清单:后台队列处理、生成多尺寸、WebP/AVIF、CDN、类型与大小校验、剥离元数据保护隐私。