自用 API 之随机猫猫头像

本文目录

简介

本博客的老读者可能会发现一个有意思的点：本站的 logo 似乎每天都会换一只新的猫猫头像。

于是笔者索性将其封装为一个开放的 API 托管至 Cloudflare Workers，方便各位读者免费调用。

使用指南

基本信息

API 端点: https://random-cat-assets-r2.hats-land.com/
速率限制: 30 RPM/IP (每IP每分钟30次请求)
响应格式: WebP, PNG, JSON 可选

直接引用图片

GET https://random-cat-assets-r2.hats-land.com/api/v1/images

API 默认根据浏览器请求信息自适应返回 WebP 还是 PNG，如果你想指定返回的图片格式，可以添加以下参数：

?format=png 强制返回 PNG 格式的图片
?format=webp 强制返回 WebP 格式的图片

JSON API

请求

GET https://random-cat-assets-r2.hats-land.com/api/v1/json

响应

JSON API 示例返回：

json

{
  "url": {
    "png": "https://s3-apac.hats-land.com/cat-assets/avatar/pb-5767334.png",
    "webp": "https://s3-apac.hats-land.com/cat-assets/avatar/pb-5767334.webp"
  },
  "width": 853,
  "height": 853
}

小贴士

此 API 并不保证 SLA 可用性，请提前处理可能遇到的错误。
请尽量选择 WebP 格式，目前浏览器中除了 IE 均支持 WebP。

示例代码

你可以直接使用以下 JavaScript 代码嵌入到您网站的 HTML 中。

这个代码可实现加载页面后自动往 class 为 random-cat 的元素注入一个随机的猫猫图片。

例如 <div class="random-cat" style="aspect-ratio:1/1"></div>

javascript

(()=>{
  const getRandomCat = () => 
    fetch('https://random-cat-assets-r2.hats-land.com/api/v1/json', {
      headers: { 'Accept': 'application/json' }
    })
    .then(r => r.json())
    .then(d => {
      const i = new Image();
      i.src = d.url.webp; // 可以将 d.url.webp 替换为 d.url.png
      i.alt = 'Random Cat Avatar';
      document.querySelector('.random-cat')?.replaceChildren(i);
    })
    .catch(e => console.error('RandomCat fetch failed:', e));

  document.addEventListener('DOMContentLoaded', getRandomCat);
})();

版权信息 (点击展开)

Copyright (c) @ Hat's Blog www.hats-land.com
Released Date @ 2024-09-26 '/archives/technology/open-api-for-random-cat-avatars'
GPG Signature: 'https://www.hats-land.com/gpg-public.txt' (F166C5F4F897B96A07390B8574E3D911A0E70FEC)

// -----BEGIN PGP MESSAGE-----

// hF4DYvdQZ6S+TycSAQdA4YLsG2kv3qaa0J5LKHRD56rI8wna3OoKIwnHVzOiQCww
// axDk+KcrP3YULoLr7857CluyUtM+UW/Zyg9F0WYzDgeG9aPBMlh/W2eKWQ9qdDeh
// 1MCCAQkCECgQXU6drqBDjsv3t9nRLpMS/aMGtZ5/PrYRPROymKdDuSz48qiQQkHo
// XBtf2goIqYwYngpXD/b9F+vJ09O1UhxKCZUllIhMArM/GcUJTKmWsCGwp7YA/noW
// zuNVud4K34PUiodjvuyEIsEP/8E2C32FG4MtPOkYJ3Q5VNNliq3nh7Q/BCOaGSKb
// JpsezETOmxbwATVK6NphwBeEWVWA0wcHghSTj8itDNHH3WBeUwINptcpQ66wzuJ6
// gq5pt3wQ77d+gcHUW8yXk8i6F3eRS1q1qmc5/hQKlBWNsC+Xo+l7VJOsd2/sfkjh
// LAA84DyJPkyt3TAUyfMlv5WHoCBd3hgjHQFNMf+X1j8zmusc5qO2oJTp6DAfMgs9
// CVQvIWPgM64jTYFJYz+RdPSaevJD1HEuiNaY7KtCUIJfA1RMYw==
// =ahI2
// -----END PGP MESSAGE-----

自用 API 之随机猫猫头像 ​

简介 ​

使用指南 ​

基本信息 ​

直接引用图片 ​

JSON API ​

请求 ​

响应 ​

小贴士 ​

示例代码 ​