次の方法で共有

模擬応答

開発プロキシの使用は、API をモックする最も簡単な方法です。 フロントエンドを構築していて、API の準備ができていない場合でも、バックエンドを外部サービスと統合する必要がある場合でも、異なる応答でアプリケーションをテストする必要がある場合でも、Dev Proxy は API 応答をシミュレートするのに役立ちます。 開発プロキシを使用する場合の優れた点は、アプリケーション コードに変更を加える必要がないという点です。 アプリケーションが操作するすべての API に対してモック応答を定義し、Dev Proxy が要求をインターセプトし、定義したモック応答で応答します。

API 応答をモックするには、次の 2 つの操作を行う必要があります。

  1. モック応答を含むファイルを作成します。
  2. モック応答を使用するように開発プロキシを構成します。

ヒント

Visual Studio Code を使用する場合は、 Dev Proxy Toolkit 拡張機能のインストールを検討してください。 これにより、開発プロキシ構成ファイルの操作が大幅に簡略化されます。

モック応答を含むファイルを作成する

開発プロキシは、 MockResponsePluginを使用して API 応答をモックします。 プラグインを使用すると、一連のモック応答を定義できます。 モックは 別のファイルで定義します。 次のコード スニペットは、GETへのhttps://jsonplaceholder.typicode.com/posts/1要求に対する単純なモック応答を示しています。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.schema.json",
  "mocks": [
    {
      "request": {
        "url": "https://jsonplaceholder.typicode.com/posts/1",
        "method": "GET"
      },
      "response": {
        "statusCode": 200,
        "body": {
          "userId": 1,
          "id": 1,
          "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
          "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
        },
        "headers": [
          {
            "name": "Date",
            "value": "Wed, 19 Feb 2025 09:03:37 GMT"
          },
          {
            "name": "Content-Type",
            "value": "application/json; charset=utf-8"
          },
          {
            "name": "Content-Length",
            "value": "292"
          },
          // [...] trimmed for brevity
        ]
      }
    }
  ]
}

ヒント

モック ファイルを手動で作成する代わりに、 MockGeneratorPlugin を使用して、インターセプトされた要求に基づいてモック ファイルを生成できます。

順序の優先順位

開発プロキシは、モックファイルで定義した順序でモックを照合します。 同じ URL とメソッドで複数の応答を定義する場合、開発プロキシは最初に一致する応答を使用します。

次の構成を使用すると、プロキシはすべてのGET要求に対してhttps://graph.microsoft.com/v1.0/me/photoに500 Internal Server Errorで応答します。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.schema.json",
  "mocks": [
    {
      "request": {
        "url": "https://graph.microsoft.com/v1.0/me/photo",
        "method": "GET"
      },
      "response": {
        "statusCode": 500
      }
    },
    {
      "request": {
        "url": "https://graph.microsoft.com/v1.0/me/photo",
        "method": "GET"
      },
      "response": {
        "statusCode": 404
      }
    }
  ]
}

ワイルドカードのサポート

開発プロキシでは、URL プロパティでのワイルドカードの使用がサポートされています。 アスタリスク文字 (*) を使用して、URL 内の任意の一連の文字と一致させることができます。

次の構成を使用すると、Dev Proxy はすべての要求に応答して、同じ応答でユーザーのプロファイルを取得します。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.mocksfile.schema.json",
  "mocks": [
    {
      "request": {
        "url": "https://graph.microsoft.com/v1.0/users/*"
      },
      "response": {
        "body": {
          "@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
          "businessPhones": ["+1 425 555 0109"],
          "displayName": "Adele Vance",
          "givenName": "Adele",
          "jobTitle": "Product Marketing Manager",
          "mail": "AdeleV@M365x214355.onmicrosoft.com",
          "mobilePhone": null,
          "officeLocation": "18/2111",
          "preferredLanguage": "en-US",
          "surname": "Vance",
          "userPrincipalName": "AdeleV@M365x214355.onmicrosoft.com",
          "id": "87d349ed-44d7-43e1-9a83-5f2406dee5bd"
        }
      }
    }
  ]
}

次の構成を使用すると、開発者プロキシは、ユーザーの写真のバイナリを取得するように要求すると、ディスクから同じイメージを返します。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.mocksfile.schema.json",
  "mocks": [
    {
      "request": {
        "url": "https://graph.microsoft.com/v1.0/users/*/photo/$value"
      },
      "response": {
        "body": "@picture.jpg",
        "headers": [
          {
            "name": "content-type",
            "value": "image/jpeg"
          }
        ]
      }
    }
  ]
}

次の構成を使用すると、任意のクエリ文字列パラメーターで現在のユーザーのプロファイルを取得するように要求すると、Dev Proxy は同じ応答を返します。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.mocksfile.schema.json",
  "mocks": [
    {
      "request": {
        "url": "https://graph.microsoft.com/v1.0/me?*"
      },
      "response": {
        "body": {
          "@odata.context": "https://graph.microsoft.com/v1.0/$metadata#users/$entity",
          "businessPhones": [
            "+1 412 555 0109"
          ],
          "displayName": "Megan Bowen",
          "givenName": "Megan",
          "jobTitle": "Auditor",
          "mail": "MeganB@M365x214355.onmicrosoft.com",
          "mobilePhone": null,
          "officeLocation": "12/1110",
          "preferredLanguage": "en-US",
          "surname": "Bowen",
          "userPrincipalName": "MeganB@M365x214355.onmicrosoft.com",
          "id": "48d31887-5fad-4d73-a9f5-3c356e68a038"
        }
      }
    }
  ]
}

ファイルの内容で応答する

モック ファイルをクリーンで整理するために、応答の内容を別のファイルに格納し、モック ファイルで参照することができます。 開発プロキシに指示するには、モック応答本文をファイルから読み込むには、 body プロパティを @ に設定し、その後にモック ファイルに対する相対ファイル パスを設定します。

たとえば、次のモック応答構成では、Dev Proxy に対して、モック ファイルと同じフォルダーにあるhttps://graph.microsoft.com/v1.0/me ファイルの内容でresponse.jsonへのいかなるリクエストにも応答するよう指示しています。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.mocksfile.schema.json",
  "mocks": [
    {
      "request": {
        "url": "https://graph.microsoft.com/v1.0/me",
        "method": "GET"
      },
      "response": {
        "body": "@response.json",
        "headers": [
          {
            "name": "content-type",
            "value": "application/json; odata.metadata=minimal"
          }
        ]
      }
    }
  ]
}

@ トークンを使用すると、テキスト ファイルとバイナリ ファイルで動作します。

モック応答を使用するように開発プロキシを構成する

モック ファイルを作成したら、モック応答を使用するように開発プロキシを構成する必要があります。 応答をモックするように開発プロキシを構成するには、MockResponsePlugin ファイル内のプラグインの一覧にを追加します。

{
  "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/rc.schema.json",
  "plugins": [
    {
      "name": "MockResponsePlugin",
      "enabled": true,
      "pluginPath": "~appFolder/plugins/DevProxy.Plugins.dll",
      "configSection": "mockResponsePlugin"
    }
  ],
  "urlsToWatch": [
    "https://jsonplaceholder.typicode.com/*"
  ],
  "mockResponsePlugin": {
    "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.schema.json",
    "mocksFile": "mocks.json"
  },
  "logLevel": "information",
  "newVersionNotification": "stable",
  "showSkipMessages": true
}

まず、プラグインの一覧に MockResponsePlugin を追加します。 モック ファイルへのパスを指定する構成セクションへの参照を含めます。

開発プロキシを起動すると、モック ファイルが読み取られ、モック応答を使用して、定義されたモックに一致する要求に応答します。

モックされていない要求のサポート

Dev Proxy では、プロキシがモックされていない要求をインターセプトしたときにエラーをスローすることをサポートしています。 モックされていない要求を失敗させる機能は、モック ファイルで見逃した要求を識別するのに役立ちます。

この機能を有効にするには、blockUnmockedRequests ファイルの MockResponsePlugin 構成セクションに設定を追加して有効にします。

{
  "mocksPlugin": {
    "$schema": "https://raw.githubusercontent.com/dotnet/dev-proxy/main/schemas/v0.29.1/mockresponseplugin.schema.json",
    "mocksFile": "mocks.json",
    "blockUnmockedRequests": true
  }
}

開発プロキシは、モックできない要求をインターセプトすると、 502 Bad Gateway 応答を返します。

次のステップ

MockResponsePlugin の詳細を確認します。

MockResponsePlugin

サンプル

関連する開発プロキシのサンプルも参照してください。