前端干货之随机图库 Lorem Picsum

今天给大家推荐一个免费的图片库 Lorem Picsum，简单好用

获取指定大小的随机图片

// 这样你就能得到一张宽度为200，高度为300的随机图片
https://picsum.photos/200/300
// 获取正方形图片
https://picsum.photos/200
//等同于 https://picsum.photos/200/200

获取指定id的图片

图片列表

//这样你就可以获得一个ID为1的指定宽高的图片。
https://picsum.photos/id/1/200/300

静态随机图像

通过添加到 url 的开头，每次根据种子获取相同的随机图像。/seed/{seed}

https://picsum.photos/seed/picsum/200/300

灰度图片

通过附加到 URL 的末尾来获取灰度图像。?grayscale

https://picsum.photos/200/300?grayscale

模糊图片

通过在 URL 末尾追加来获取模糊图像。?blur

https://picsum.photos/id/1/200/300/?blur

您可以通过提供介于 和 之间的数字来调整模糊量。1-10

https://picsum.photos/id/1/200/300/?blur=2

高级用法

您可以组合上述任何选项。

例如，获取灰度和模糊的特定图像。
https://picsum.photos/id/870/200/300?grayscale&blur=2
要在浏览器中请求多个相同大小的图像，请添加 query param 以防止图像被缓存：random

<img src="https://picsum.photos/200/300?random=1">
<img src="https://picsum.photos/200/300?random=2">

如果需要文件结尾，可以在 url 的末尾添加。.jpg

https://picsum.photos/200/300.jpg

要获取 WebP 格式的图像，您可以在 url 的末尾添加。.webp

https://picsum.photos/200/300.webp

列出图片

使用终端节点获取图像列表。/v2/list

https://picsum.photos/v2/list

默认情况下，API 将每页返回 30 个项目。

要请求其他页面，请使用 parameter 。?page

要更改每页的项目数，请使用 参数.?limit

https://picsum.photos/v2/list?page=2&limit=100

页眉包含有关下一页/上一页的分页信息Link

图像详细信息

使用 和 endpoints 获取有关特定映像的信息。/id/{id}/info/seed/{seed}/info

https://picsum.photos/id/0/info
https://picsum.photos/seed/picsum/info

您可以通过查看标题或 EXIF 元数据中的字段来找出图像的 ID。Picsum-IDUser Comment