JSON Serverを使ってGETとPOSTでレスポンスを変えてみた

はじめに

APIのモックを一瞬で作れるJSON Serverというものがあり、
使っていて微妙に痒い所に手が届かなかったりしたので、本記事を書いてみた。

JSON Server
https://github.com/typicode/json-server

導入・起動方法

基本的な使い方については、
他の方が記事を書いているのでそちらを参照。

【個人メモ】JSON Serverを使って手っ取り早くWebAPIのモックアップを作る
https://qiita.com/futoase/items/2859a60c8b240da70572

JSON Server - 簡単にAPIのモックを作成
https://qiita.com/yhikishima/items/46860ffc48913182a3ee

本題

JSON Serverのデフォルト仕様だと、
POSTの場合、扱いづらいデータが返ってくる。

まずは、説明用に以下のJSONを用意。

db.json

{  
  "user":[  
    {  
      "id":1,
      "name":"Jones",
      "age":18
    }
  ]
}

GETすると、こんな感じのレスポンスが返る。

GET

[
  {  
    "id":1,
    "name":"Jones",
    "age":18
  }
]

POSTすると、idのみのデータが返る。(しかも、db.jsonにも同じデータが追加される)
うーん、、、レスポンスは違うフォーマットで返したい。

POST

{  
  "id":2
}

解決策

middlewaresオプションを使う。

以下のファイルを作成し、
JSON Serverの起動パラメータにmiddlewareファイルを含める。

middleware.js

module.exports = function (req, res, next) {
    if (req.method === 'POST') {
        req.method = 'GET' // GETに偽装
        req.url += '_post' // アクセス先をPOST用に変更
    }
    next()
}

後、POST用のレスポンスを追加。

db.json

{  
  "user":[  
    {  
      "id":1,
      "name":"Jones",
      "age":18
    }
  ],
  "user_post":{  
    "code":0,
    "msessage":"success"
  }
}

ターミナルで起動。

json-server -w db.json -m middleware.js

確認

Postmanを使って、それぞれ確認。

GETの場合。

POSTの場合。

期待通り、GETとPOSTでレスポンスを変える事が出来た。