Web APIの動作確認に役立つツールまとめ

はじめに

Webアプリケーション開発をしていると、公開されている Web API (以下「API」) を開発しているアプリケーションに組み込んだり、自分で API を実装して外部に公開するといった機会が訪れると思います。公開されている API の使用方法を知るための動作確認や、API が正しく動くか試すための動作確認に、みなさんはどのようなツールを使っていますか？

この記事では、APIの動作確認に役立つ様々なツールを紹介します。

CLI を使った API の動作確認

curl

curl はとても有名で便利なコマンドラインツールで、API の動作確認に使用することができます。
さまざまなライブラリのドキュメントや README に使用方法として curl を使用した例が書かれていることが多く、Web 開発をしている方の多くが使ったことがあるはずです。

使い方は以下のように、curl に API の URL を指定してリクエストを送信することで、API の動作確認を行うことができます。（結果を見やすくするために、 jq コマンドで JSON を見やすくしています。jq も CLI で API の動作確認をする際によく使いますよね。）

λ curl 'https://qiita.com/api/v2/users/wataru86' | jq       
  % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
                                 Dload  Upload   Total   Spent    Left  Speed
100   448    0   448    0     0   1141      0 --:--:-- --:--:-- --:--:--  1163
{
  "description": "",
  "facebook_id": "",
  "followees_count": 15,
  "followers_count": 31,
  "github_login_name": "wataru86",
  "id": "wataru86",
  "items_count": 36,
  "linkedin_id": "",
  "location": "",
  "name": "Wataru Yamada",
  "organization": "",
  "permanent_id": 325392,
  "profile_image_url": "https://s3-ap-northeast-1.amazonaws.com/qiita-image-store/0/325392/bc103c4508672e910cd3807be3e74d19978f1b94/large.png?1544534972",
  "team_only": false,
  "twitter_screen_name": null,
  "website_url": ""
}

本記事では省きますが、 curl にはさまざまな使用方法やオプションがありますので、詳細な使い方については公式ドキュメントや Qiita 記事等を参照してみてください！

wget

wget も curl と同様に HTTP リクエストを送信するためのコマンドラインツールであり、API の動作確認に使用できます。curl と比べると wget はファイルのダウンロードのために使用することが多い気がします。

API に対して以下のようにリクエストできます。使い方も curl と似ていますね。

λ wget -qO- https://qiita.com/api/v2/users/wataru86 | jq 
{
  "description": "",
  "facebook_id": "",
  "followees_count": 15,
  "followers_count": 31,
  "github_login_name": "wataru86",
  "id": "wataru86",
  "items_count": 36,
  "linkedin_id": "",
  "location": "",
  "name": "Wataru Yamada",
  "organization": "",
  "permanent_id": 325392,
  "profile_image_url": "https://s3-ap-northeast-1.amazonaws.com/qiita-image-store/0/325392/bc103c4508672e910cd3807be3e74d19978f1b94/large.png?1544534972",
  "team_only": false,
  "twitter_screen_name": null,
  "website_url": ""
}

httpie

httpie も HTTP リクエストが可能なCLIです。 コマンドラインオプションが curl 等よりも書きやすく、POSTメソッドを http POST url param=value のように書けるといった特徴があります。

CLIとしてだけでなく、デスクトップアプリケーションも提供しているようです。

以下のように http コマンドで API にリクエストができます。

λ http https://qiita.com/api/v2/users/wataru86
HTTP/1.1 200 OK
Cache-Control: max-age=0, private, must-revalidate
Connection: keep-alive
Content-Type: application/json; charset=utf-8
Date: Thu, 31 Aug 2023 03:52:47 GMT
ETag: W/"8e3872804624fc12d3636a9f76af9e7d"
Rate-Limit: 60
Rate-Remaining: 59
Rate-Reset: 1693457567
Referrer-Policy: strict-origin-when-cross-origin
Server: nginx
Strict-Transport-Security: max-age=2592000
Transfer-Encoding: chunked
Vary: Accept, Origin
X-Content-Type-Options: nosniff
X-Download-Options: noopen
X-Frame-Options: SAMEORIGIN
X-Permitted-Cross-Domain-Policies: none
X-Request-Id: 7549a547-38b5-4000-9875-784e8fe505c3
X-Runtime: 0.179149
X-XSS-Protection: 1; mode=block

{
    "description": "",
    "facebook_id": "",
    "followees_count": 15,
    "followers_count": 31,
    "github_login_name": "wataru86",
    "id": "wataru86",
    "items_count": 36,
    "linkedin_id": "",
    "location": "",
    "name": "Wataru Yamada",
    "organization": "",
    "permanent_id": 325392,
    "profile_image_url": "https://s3-ap-northeast-1.amazonaws.com/qiita-image-store/0/325392/bc103c4508672e910cd3807be3e74d19978f1b94/large.png?1544534972",
    "team_only": false,
    "twitter_screen_name": null,
    "website_url": ""
}

GUI を使った API の動作確認

Postman

GUI で API の動作確認をするツールとして僕が最初に思い浮かんだものは Postman です。Postmanは、直感的なインターフェースと豊富な機能を備えており、API のリクエストやレスポンスを簡単にテストすることができます。Postman は僕がまだ CLI に慣れていない頃にお世話になった思い出があります。

(画像は公式ドキュメントからお借りしました。)

Insomnia

Insomnia も GUI でWeb APIを動作確認するためのツールで、Postmanと同様に様々なHTTPメソッドをサポートしており、リクエストの送信やレスポンスの確認が簡単に行えます。

以下のように Webサイトにリクエストを行い、ページのプレビューを表示することも可能です。

(画像は公式ドキュメントからお借りしました。)

ブラウザ拡張機能を使った API の動作確認

普段 Chrome を使っているので、Chromeの拡張のみになっています。ご了承ください。

JSON Viewer

ブラウザで API のGET可能なエンドポイントにアクセスすると、レスポンスは取得可能ですが、JSONだと以下のように見ずらいですよね。

開発者ツールでも以下のようにプレビュー可能ですが、もっと楽にブラウザで確認する方法があります。

拡張機能 JSON Viewer を導入すると、JSON を見やすい形で表示可能です。

ブラウザ上で以下のように表示されます。

Talend API Tester

先ほど紹介したように、ブラウザで直接 API の URL を入力して GET することも可能ですが、さすがにそれだけだとAPIの動作確認には限界があります。Chrome の拡張機能 Talend API Tester をインストールすることで、Postman や Insomnia のようにブラウザ上で GUI を使ってAPIの動作確認ができるようになります。

エディタを使った API の動作確認

普段僕が VSCode を使っているので、VSCode の拡張のみになっています。ご了承ください。

REST Clinet

REST Client は VSCode の拡張機能の一つで、API のリクエストを簡単に作成し、実行することができます。

VSCode でリクエストを記述し、選択した状態でコマンドを実行すると、REST Client がリクエストを送信し、新しいタブにレスポンスを表示することができます。

VSCode で開発し、VSCode で API の動作確認ができるので、とても便利です。僕はこれを一番よく使っています。

Postman

先ほど GUI のところで紹介した Postman ですが、VSCode の拡張機能も存在するようです。

This extension is currently in its beta phase. We appreciate your feedback and patience as we fine-tune its capabilities.

上記のようにまだベータ版ですが、Postman と VSCode を両方使っている人にとっては便利かもしれないですね。

上記は拡張機能のページからお借りしました。

好きなプログラミング言語を使った API の動作確認

ツールを使用せず、好きなプログラミング言語で API にリクエストを送信するプログラムを書いてしまう、というやり方もあると思います。例えば、JavaScript の Fetch API を使ってリクエストを送信するコードを書けば、ブラウザ開発者ツールの Console に流すだけで実行できます。また、様々なプログラミング言語で HTTP リクエストをするためのライブラリが公開されているので、それを利用しても良いでしょう。

おわりに

みなさんが使っているツールはありましたか？本記事では僕が知る限りのAPIの動作確認に便利なツールを紹介しましたが、他にもさまざまなツールが存在するとおもうので、自分に合ったツールを探して使ってみてください！！

また、「私はこれをつかっています！」「これも便利なのでオススメ！」などのコメントをいただけると、他のエンジニアの方々にも参考になるかもしれませんので、ぜひコメント欄にご意見をお寄せください！！！