使用 WireMock 在開發和測試中模擬 API 服務

目錄

在本地開發和測試過程中，應用程式依賴遠端 API 的情況非常普遍。網路問題、速率限制，甚至是 API 提供商的停機都可能阻礙您的進度。這會嚴重影響您的生產力並增加測試難度。這就是 WireMock 發揮作用的地方。

WireMock 是一個開源工具，可協助開發人員建立一個模擬伺服器，用以模擬真實 API 的行為，從而為開發和測試提供一個受控環境。

想像一下，您同時擁有 API 和前端應用程式，並且想要測試前端如何與 API 互動。使用 WireMock，您可以建立一個模擬伺服器來模擬 API 的回應，讓您無需依賴實際 API 即可測試前端行為。當 API 仍在開發中，或者當您想在不影響實際 API 的情況下測試不同情境時，這特別有用。WireMock 支援 HTTP 和 HTTPS 協議，並且可以模擬各種回應情境，包括延遲、錯誤以及不同的 HTTP 狀態碼。

在本指南中，您將學習如何：

  • 使用 Docker 啟動 WireMock 容器。
  • 在本地開發中使用模擬數據，而無需依賴外部 API
  • 在生產環境中使用線上 API，從 AccuWeather 獲取即時天氣數據。

在 Docker 中使用 WireMock

官方的 WireMock Docker 映像檔提供了一種部署和管理 WireMock 實例的便捷方式。WireMock 適用於多種 CPU 架構，包括 amd64、armv7 和 armv8，確保與各種設備和平台相容。您可以在 WireMock 文件網站上了解更多關於 WireMock 獨立版的資訊。

先決條件

若要跟隨本操作指南，需要具備以下先決條件：

啟動 WireMock

透過以下步驟啟動 WireMock 的快速演示

  1. 在本地複製 GitHub 儲存庫。

    $ git clone https://github.com/dockersamples/wiremock-node-docker

  2. 導航至 wiremock-endpoint 目錄

    $ cd wiremock-node-docker/

    WireMock 作為後端通訊以檢索數據的模擬 API。模擬 API 的回應已經在 mappings 目錄中為您建立好了。

  3. 在複製的專案根目錄中執行以下命令，啟動 Compose 堆疊

    $ docker compose up -d

    片刻之後，應用程式就會啟動並運行。

    Diagram showing the WireMock container running on Docker Desktop

    您可以透過選取 wiremock-node-docker 容器來檢查日誌

    Diagram showing the logs of WireMock container running on Docker Desktop

  4. 測試模擬 API。

    $ curl https://:8080/api/v1/getWeather\?city\=Bengaluru

    它將返回以下帶有模擬數據的現成回應

    {"city":"Bengaluru","temperature":27.1,"conditions":"Mostly cloudy","forecasts":[{"date":"2024-09-02T07:00:00+05:30","temperature":83,"conditions":"Partly sunny w/ t-storms"},{"date":"2024-09-03T07:00:00+05:30","temperature":83,"conditions":"Thunderstorms"},{"date":"2024-09-04T07:00:00+05:30","temperature":83,"conditions":"Intermittent clouds"},{"date":"2024-09-05T07:00:00+05:30","temperature":82,"conditions":"Dreary"},{"date":"2024-09-06T07:00:00+05:30","temperature":82,"conditions":"Dreary"}]}

    使用 WireMock，您可以利用映射檔案定義現成回應。對於此請求，模擬數據定義在 wiremock-endpoint/mappings/getWeather/getWeatherBengaluru.json 的 JSON 檔案中。

    有關存根（stubbing）現成回應的更多資訊，請參閱 WireMock 文件。

在開發中使用 WireMock

現在您已經嘗試過 WireMock，讓我們在開發和測試中使用它。在此範例中，您將使用一個具備 Node.js 後端的範例應用程式。此應用程式堆疊具有以下配置

  • 本地開發環境：Node.js 後端和 WireMock 運行的上下文。
  • Node.js 後端：處理 HTTP 請求的後端應用程式。
  • 外部 AccuWeather API：獲取即時天氣數據的真實 API。
  • WireMock：測試期間模擬 API 回應的模擬伺服器。它作為 Docker 容器運行。
Diagram showing the architecture of WireMock in development
  • 在開發中，Node.js 後端會向 WireMock 發送請求，而不是實際的 AccuWeather API。
  • 在生產環境中，它直接連接到即時 AccuWeather API 以獲取真實數據。

在本地開發中使用模擬數據

讓我們設定一個 Node 應用程式，使其向 WireMock 容器發送請求，而不是實際的 AccuWeather API。

先決條件

按照步驟設定非容器化的 Node 應用程式

  1. 導航至 accuweather-api 目錄

    確保您位於 package.json 檔案所在的目錄中。

  2. 設定環境變數。

    開啟置於 accuweather-api/ 目錄下的 .env 檔案。移除舊項目，並確保它僅包含以下單行內容。

    API_ENDPOINT_BASE=https://:8080

    這將告知您的 Node.js 應用程式在進行 API 呼叫時使用 WireMock 伺服器。

  3. 檢查應用程式進入點

    • 應用程式的主檔案是 index.js，位於 accuweather-api/src/api 目錄中。
    • 此檔案啟動了 getWeather.js 模組，這對於您的 Node.js 應用程式至關重要。它使用 dotenv 套件從 .env 檔案載入環境變數。
    • 根據 API_ENDPOINT_BASE 的值，應用程式會將請求路由至 WireMock 伺服器 (https://:8080) 或 AccuWeather API。在此設定中，它會使用 WireMock 伺服器。
    • 程式碼確保僅在應用程式未使用 WireMock 時才需要 ACCUWEATHER_API_KEY，從而提高效率並避免錯誤。
    require("dotenv").config();

const express = require("express");
const axios = require("axios");

const router = express.Router();
const API_ENDPOINT_BASE = process.env.API_ENDPOINT_BASE;
const API_KEY = process.env.ACCUWEATHER_API_KEY;

console.log('API_ENDPOINT_BASE:', API_ENDPOINT_BASE);  // Log after it's defined
console.log('ACCUWEATHER_API_KEY is set:', !!API_KEY); // Log boolean instead of actual key

if (!API_ENDPOINT_BASE) {
  throw new Error("API_ENDPOINT_BASE is not defined in environment variables");
}

// Only check for API key if not using WireMock
if (API_ENDPOINT_BASE !== 'https://:8080' && !API_KEY) {
  throw new Error("ACCUWEATHER_API_KEY is not defined in environment variables");
}
// Function to fetch the location key for the city
async function fetchLocationKey(townName) {
  const { data: locationData } = await
axios.get(`${API_ENDPOINT_BASE}/locations/v1/cities/search`, {
    params: { q: townName, details: false, apikey: API_KEY },
  });
  return locationData[0]?.Key;
}

  4. 啟動 Node 伺服器

    在啟動 Node 伺服器之前，請確保您已執行 npm install 來安裝 package.json 檔案中列出的 node 套件。

    npm install 
npm run start

    您應該會看到以下輸出

    > express-api-starter@1.2.0 start
> node src/index.js

API_ENDPOINT_BASE: https://:8080
..
Listening: https://:5001

    該輸出表示您的 Node 應用程式已成功啟動。請保持此終端視窗開啟。

  5. 測試模擬 API

    開啟一個新的終端視窗並執行以下命令來測試模擬 API

    $ curl "https://:5001/api/v1/getWeather?city=Bengaluru"

    您應該會看到以下輸出

    {"city":"Bengaluru","temperature":27.1,"conditions":"Mostly cloudy","forecasts":[{"date":"2024-09-02T07:00:00+05:30","temperature":83,"conditions":"Partly sunny w/ t-storms"},{"date":"2024-09-03T07:00:00+05:30","temperature":83,"conditions":"Thunderstorms"},{"date":"2024-09-04T07:00:00+05:30","temperature":83,"conditions":"Intermittent clouds"},{"date":"2024-09-05T07:00:00+05:30","temperature":82,"conditions":"Dreary"},{"date":"2024-09-06T07:00:00+05:30","temperature":82,"conditions":"Dreary"}]}%

    這表示您的 Node.js 應用程式現在已成功將請求路由至 WireMock 容器並接收到模擬回應

    您可能已經注意到您嘗試使用 https://:5001 作為 URL，而不是連接埠 8080。這是因為您的 Node.js 應用程式是在連接埠 5001 上運行，並且它將請求路由到了監聽連接埠 8080 的 WireMock 容器。

    提示

    在進行下一步之前，請確保停止節點應用程式服務。

在生產環境中使用線上 API，從 AccuWeather 獲取即時天氣數據

為了用即時天氣數據增強您的 Node.js 應用程式，您可以無縫整合 AccuWeather API。本指南的這一部分將引導您完成設定非容器化 Node.js 應用程式並直接從 AccuWeather API 獲取天氣資訊的步驟。

  1. 建立 AccuWeather API 金鑰

    在 https://developer.accuweather.com/ 註冊免費的 AccuWeather 開發者帳戶。在您的帳戶中，透過選取頂部導航選單上的 MY APPS 來建立新應用程式，以取得您的專屬 API 金鑰。

    Diagram showing the AccuWeather Dashboard

    AccuWeather API 是一個提供即時天氣數據和預報的 Web API。開發人員可以使用此 API 將天氣資訊整合到他們的應用程式、網站或其他專案中。

  2. 將目錄變更為 accuweather-api

    $ cd accuweather-api

  3. 使用 .env 檔案設定您的 AccuWeather API 金鑰

    提示

    為防止衝突，請確保在修改 .env 檔案之前移除任何名為 API_ENDPOINT_BASE 或 ACCUWEATHER_API_KEY 的現有環境變數。

    在您的終端機上執行以下命令

    unset API_ENDPOINT_BASE
unset ACCUWEATHER_API_KEY

    現在是在 .env 檔案中設定環境變數的時候了

    ACCUWEATHER_API_KEY=XXXXXX
API_ENDPOINT_BASE=http://dataservice.accuweather.com

    請務必將 ACCUWEATHER_API_KEY 填入正確的值。

  4. 安裝相依套件

    執行以下命令以安裝所需的套件

    $ npm install

    這將安裝您 package.json 檔案中列出的所有套件。這些套件對於專案的正常運作至關重要。

    如果您遇到任何關於已棄用套件的警告，您可以暫時忽略它們以進行此演示。

  5. 假設您的系統上沒有預先運行的 Node 伺服器，請透過執行以下命令啟動 Node 伺服器

    $ npm run start

    您應該會看到以下輸出

    > express-api-starter@1.2.0 start
> node src/index.js

API_ENDPOINT_BASE: http://dataservice.accuweather.com
ACCUWEATHER_API_KEY is set: true 
Listening: https://:5001

    保持此終端視窗開啟。

  6. 執行 curl 命令以向伺服器 URL 發送 GET 請求。

    在新的終端視窗中，輸入以下命令

    $ curl "https://:5000/api/v1/getWeather?city=Bengaluru"

    透過執行此命令，您實際上是告訴您的本地伺服器為您提供名為 Bengaluru 的城市的天氣數據。該請求特別針對 /api/v1/getWeather 端點，並且您提供了查詢參數 city=Bengaluru。執行該命令後，伺服器會處理此請求，獲取數據並將其作為回應返回，curl 將在您的終端機中顯示該回應。

    從外部 AccuWeather API 獲取數據時，您正在與反映最新天氣狀況的即時數據進行互動。

重點回顧

本指南已引導您使用 Docker 設定 WireMock。您已經學會了如何建立存根以模擬 API 端點，從而讓您無需依賴外部服務即可開發和測試應用程式。透過使用 WireMock，您可以建立可靠且一致的測試環境，重現邊緣情況，並加速您的開發工作流程。

© . This site is unofficial and not affiliated with Kubernetes or Docker Inc.