HTTP.Cat 是一個(gè)有趣的 API 網(wǎng)站，它提供以可愛(ài)貓咪圖片表示的 HTTP 狀態(tài)碼。沒(méi)錯(cuò)，這是真實(shí)存在的！你可以在你的項(xiàng)目中使用這個(gè) API，增加一些幽默感或者讓錯(cuò)誤處理變得更有趣。在本文中，我們將探索 HTTP.Cat API 文檔，并學(xué)習(xí)如何在 JavaScript 中發(fā)起 API 請(qǐng)求。

HTTP.Cat 文檔頁(yè)面非常直接。你可以找到所有可用的 HTTP 狀態(tài)碼以及它們對(duì)應(yīng)的貓咪圖片。API 端點(diǎn)是 https://http.cat/{status_code}.jpg。例如，要獲取 404 錯(cuò)誤對(duì)應(yīng)的貓咪圖片，你可以使用 URL https://http.cat/404.jpg。

在 JavaScript 中，你可以使用內(nèi)置的 fetch 函數(shù)來(lái)向 HTTP.Cat 發(fā)起 API 請(qǐng)求。以下是一段示例代碼，展示了如何請(qǐng)求 404 狀態(tài)碼對(duì)應(yīng)的貓咪圖片：

const statusCode = 404;
const url = `https://http.cat/${statusCode}.jpg`;
    
// 從 API 端點(diǎn)請(qǐng)求貓咪圖片
fetch(url)
  .then((response) => {
    if (response.ok) {
      // 如果響應(yīng)成功，顯示貓咪圖片
      const img = document.createElement('img');
      img.src = url;
      document.body.appendChild(img);
    } else {
      // 如果請(qǐng)求有錯(cuò)誤，記錄錯(cuò)誤信息
      console.log(`Error: ${response.statusText}`);
    }
  })
  .catch((error) => {
    console.log(`Error: ${error}`);
  });

這段代碼創(chuàng)建了一個(gè) img 元素，并將它的 src 屬性設(shè)置為 API 端點(diǎn) URL。然后它發(fā)起一個(gè) fetch 請(qǐng)求到該 URL 并處理響應(yīng)。如果響應(yīng)成功，它將顯示貓咪圖片。如果請(qǐng)求有錯(cuò)誤，它將把錯(cuò)誤信息記錄到控制臺(tái)。

HTTP.Cat API 是一個(gè)有趣的方式，可以為你的項(xiàng)目增添一些幽默感。它的文檔直接且易于理解。在本文中，我們已經(jīng)學(xué)習(xí)了如何使用 JavaScript 中的 fetch 函數(shù)向 HTTP.Cat 發(fā)起 API 請(qǐng)求。享受使用這個(gè) API 的樂(lè)趣吧！