This page was machine-translated. Spotted a mistake?Help improve it.
Skip to content

LQIP 占位符

从源图像生成微型低质量图像占位符(LQIP)。返回一个小的占位符文件,并附带 base64 data URI、即用型 HTML <img> 标签和 CSS background-image 代码片段,可立即嵌入使用。

API 端点

POST /api/v1/tools/image/lqip-placeholder

接受包含一个图像文件的 multipart 表单数据,以及一个 JSON settings 字段。

参数

参数类型是否必填默认值说明
widthinteger16目标宽度(像素,4-64)
blurnumber2模糊策略的模糊半径(0-20)
strategystring"blur"占位符策略:blurpixelatesolid
formatstring"webp"输出格式:webppngjpeg
qualityinteger50输出质量(1-100)

请求示例

bash
curl -X POST http://localhost:1349/api/v1/tools/image/lqip-placeholder \
  -H "Authorization: Bearer si_your-api-key" \
  -F "[email protected]" \
  -F 'settings={"width": 20, "strategy": "blur", "format": "webp"}'

响应示例

json
{
  "jobId": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "downloadUrl": "/api/v1/download/a1b2c3d4-e5f6-7890-abcd-ef1234567890/photo.webp",
  "originalSize": 2450000,
  "processedSize": 280,
  "dataUri": "data:image/webp;base64,UklGR...",
  "width": 20,
  "height": 13,
  "bytes": 280,
  "strategy": "blur",
  "html": "<img src=\"data:image/webp;base64,UklGR...\" />",
  "css": "background-image:url('data:image/webp;base64,UklGR...');background-size:cover;background-position:center;"
}

说明

  • dataUri 字段包含完整的 data URI,可直接用于 src 属性或 CSS,无需任何额外请求。
  • htmlcss 字段提供适用于常见场景的可复制粘贴代码片段。
  • blur 策略生成柔和的模糊缩略图。pixelate 策略生成块状马赛克。solid 策略返回单一的平均色。
  • 典型的占位符大小为 200-500 字节,适合直接内联到 HTML 中。
  • 高度会自动计算,以保持源图像的宽高比。
  • HEIC、RAW、PSD 和 SVG 输入会在处理前被自动解码。