JSON ServerでサクッとAPIモックサーバをつくってみる

API

直近でフロントエンドの開発に携わることになりました。
APIモックがあると何かと便利かと思い、ググったところJSON Serverなるものがあるということで試してみました。

目次

「 JSON Server」とは？

JSON Server(ジェイソン サーバ)とは、JSONファイルを元にしてWebAPIサーバモックアップを作成できる簡易サーバです。
開発中のWebAPIテストなどに活用できます。

引用元： 「オープンソースのAPI連携／JSON Serverとは」

やること

JSON Serverを構築し、GETリクエストでjsonデータを取得する

用意するもの

Node.jsインストール

リポジトリ追加

以下のコマンドを実行し、yumからNode.jsを落とせるようにリポジトリ追加する。

# curl -sL https://rpm.nodesource.com/setup_8.x | bash -

Node.jsインストール

以下のコマンドを実行し、Node.jsをインストールする。
(10分くらいかかる)

# yum install -y nodejs gcc-c++ make

JSON Serverインストール

以下のコマンドを実行し、JSON Serverをインストールする。
（10分くらいかかる）

# npm install -g json-server

APIモック作成

作業用フォルダ作成

適当なパスに作業用フォルダを作成し、フォルダに移動する。
今回は/api-mockを切る。

# mkdir /api-mock
# cd /api-mock

JSON Serverが返すJSONデータの作成

今回は以下の通り人のリストを返すmemberlist.jsonをサンプルとして作成。

memberlist.json:

{
  "memberlist":[
   {
     "first_name":"太郎",
     "last_name":"田中",
     "jender":"男",
     "age":31
   },
   {
     "first_name":"花子",
     "last_name":"山田",
     "jender":"女",
     "age":27
   }
  ]
}

JSONファイルの中に書いた"memberlist"がリクエストパスとなる。

JSON Serverの起動

以下のコマンドを実行し、先ほど作成したJSONファイルをインプットにJSON Serverを起動する。
"--host"はJSON Server(192.168.10.4)のリクエストURLにIPアドレスを指定したい場合は使用。
"--host"がない場合はlocalhostを指定すればアクセス可能。

# json-server --host 192.168.10.4 memberlist.json


以下のように表示されれば、成功。
“http://192.168.10.4:3000/memberlist"でGETリクエストを受け付けて、JSONを返す準備が整っている状態。

 \{^_^}/ hi!

  Loading memberlist.json
  Done

  Resources
  http://192.168.10.4:3000/memberlist

  Home
  http://192.168.10.4:3000

JSONファイルの更新を自動反映させたい場合は以下のように"--watch"を指定することで実現可能。

# json-server --watch memberlist.json

JSONデータの取得

リクエスト送信

Chromeを開き、以下のURLにアクセス
「http://192.168.10.4:3000/memberlist」

JSONデータ取得

以下の通り、無事に取得成功
これはお手軽で便利！

f:id:wingfair:20190508231738p:plain
GET結果

ローカル以外からJSON Serverにアクセスしたい場合

実はローカル以外の環境からこのAPIをcurlで呼んでみたところ、エラーが発生した。

エラー内容

# curl http://192.168.10.4:3000/memberlist
curl: (7) Failed connect to 192.168.10.4:3000; 接続を拒否されました

原因

エラー文言でググったところ、以下の記事を発見。
普通にポートが開放されていなかっただけの模様。。

StackOverflow：
「json-server cannot access via local IP」

対策

以下のコマンドでfirewallのポート穴あけを実施

# firewall-cmd --zone=public --add-port=3000/tcp --permanent
# firewall-cmd --reload
# firewall-cmd --list-all

これでちゃんと繋がるはずです。

参考

以下のサイトの参考にさせていただきました


以上。