Ownedmedia ウェブ制作に役立つコンテンツを発信中!

ウェブ開発 2019.08.08

Postmanの導入で捗るAPI開発やデバッグ

Tags: ,,

バックエンドでAPIの開発やデバッグ行うときにはGUIツールの「Postman」がオススメです。データ取得のGETメソッドはもちろんのこと、ブラウザからは難しいPOSTでAPIを叩くケースなどもアプリ上から簡単に実行することができます。無料で使えるので是非導入しておきたいですね。

 

Postmanのインストール

インストーラーのダウンロードですが、まずは公式サイト(https://www.getpostman.com/)にアクセスします。表示される画面に大きく「Get Started」のボタンがあるのでクリックしてダウンロードページに進みます。

Postmanの導入で捗るAPI開発やデバッグ

 

Macであればそのままダウンロードボタンが表示されていますので、クリックするとインストーラーファイルのダウンロードが始まります。その他のOSの場合は下のリンクを選択します。

Postmanの導入で捗るAPI開発やデバッグ

 

インストールが終了し、アプリを立ち上げるとこのような画面が表示されます。メインの操作エリアは大きく2つに分かれており、上部には「リクエスト」下部は「レスポンス」のデータを扱う部分になります。そして最上部にはGETやPOSTといったAPIのメソッドを選択する項目と、アクセスするAPIのURL入力のフォームが設置されています。

Postmanの導入で捗るAPI開発やデバッグ

 

 

APIにアクセスしてGETメソッドでデータを取得する

開発によって様々な使い方がありますが、基本的な使い方として、GETのメソッドでAPIにアクセスし、データを取得する例を見ていきます。

 

まずはメソッドをGETに設定し、APIのURLを入力します。そして「Send」のボタンをクリックすると下記のようにレスポンスのBodyタブを選択するとレスポンスの結果エリアにデータが表示されます。表示オプションも様々な設定が可能です。

Postmanの導入で捗るAPI開発やデバッグ

 

 

リクエストボディの値をPOSTメソッドでレスポンスとして取得する

ブラウザから直接POSTのAPIを叩くためには専用に実装などが必要になりますが、Postmanを使うことで手軽に試すことができます。先ほどと同じくPOSTのメソッドを指定し、APIのURLを入力します。

 

そして、リクエストのところでBodyタブを選択し、入力エリア内に値を直接入力します。ここではJSON形式で値を入れる前提のため「raw」の形式で右側にあるフォーマットを「JSON」で選択しています。そして、上部にある「Send」ボタンをクリックすると、下のレスポンスのエリアにレスポンスボディとして、リクエストボディでPOSTした値が返ってくるのが確認できます。

Postmanの導入で捗るAPI開発やデバッグ

 

また、それ以外にもPostmanではいろんな機能が用意されています。認証系のAPIで必須となるAuthorizationの設定やレスポンスヘッダ、リクエストヘッダなどの値も確認することができます。

Postmanの導入で捗るAPI開発やデバッグ

Postmanの導入で捗るAPI開発やデバッグ

 


 

今回はAPI開発が捗るツールのPostmanについて導入と基本的な使い方についてまとめていきました。バックエンドの開発でAPIを実装する際には是非とも導入しておきたいツールですね。

この記事を書いた人

オガワ シンヤ

DesignSupply.代表 / ディレクター・ウェブデザイナー・フロントエンドエンジニアをやっています。「ウェブとデザインでヒト・モノ・サービスを繋げ新しい価値を生み出す」をコンセプトに日々奮闘中!制作中はチョコレートが欠かせない三十路Webクリエイター。

  • Twitter

コメントフォーム

記事に関するご質問やご意見などありましたら下記のコメントフォームよりお気軽に投稿ください。なおメールアドレスは公開されませんのでご安心ください。

内容に問題なければ、お名前・ハンドルネームとメールアドレスを入力いただき、下記の「コメントを送信」ボタンを押してください。

CAPTCHA


この記事もよく読まれています

Scroll to Top
ご質問・ご相談はありませんか ?