Node.js + Express で WebAPI を作成してみます。
最近だと モバイルアプリ や SPA (Single Page Appliction) などで利用されるような機能を実装するイメージです。
あまり難しいことはせず、単純な GET
と POST
の例でまとめました。
概要
画面を返さず JSON を返却する WebAPI を作成してみます。
今回は 単純な GET
と POST
を行うサンプルです。
具体的なパスは以下のようなものを作る予定です。
GET: /api/user/:id
POST: /api/user
上記の POST
URLにリクエストしたときの動きのイメージは以下のようなものです。
実装
今回は以下のミドルウェアを利用するのであらかじめ npm install <PACKAGE> --save
でインストールしておきます。
app.js
それでは実装に…といっても単純なものなので、何はともあれ実装の全体像は以下に載せます。
ハイライト下部分について、詳しくは後ほど説明していきます。
var express = require("express");
var bodyParser = require("body-parser");
// express application
var app = express();
// add body-parser
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
// set routing.
app.use("/api/", (function () {
var router = express.Router();
// GET: /api/user/:id
router.get("/user/:id", (request, response) => {
var user = {
id: request.params.id,
name: "tanaka",
role: "group1"
}
response.json(user);
});
// POST: /api/user
router.post("/user", (request, response) => {
var body = request.body;
if (!body.name || !body.role) {
return response.json(false);
}
var user = {
id: 0,
name: body.name,
role: body.role
};
response.json(true);
});
return router;
})());
// start web applicaiton.
app.listen(3000);
GET: /api/user/:id
L.16-23
コロン「:
」 を利用することで URL 中 にパラメータを埋め込むことができます。
埋め込まれたパラメータの取り出しは request.params.パラメータ名
でできます。
このパラメータ指定にはいくつかオプション設定(?
, +
, *
, regexp
)が使えます。
詳しくは 「Node.js + Express の URLルーティング」 を参照してください。
POST: /api/user
L.8-9 および L.26-37
POSTの場合、リクエストボディー に JSON を入れて情報を伝達するのが通常かと思います。
リクエストボディーに埋め込まれた JSON を取り出す場合 body-parser
を使うと便利です。
body-parser
ミドルウェアの設定および登録は L8-9 に記載の通りです。
この登録をしておけば、body-parser
にはリクエストボディーに埋め込まれた文字列を JSONオブジェクト に変換して request.body
へセットしてくれます。
テスト
GET
と POST
の両方をテストしてみます。
作成した Webアプリケーション を実行した状態で localhost:3000
に向かってリクエストを投げてみます。
リクエスト生成するツールはいろいろありますが…私は Fiddler の Composer をよく使うので、
ここでも Fiddler を利用してリクエストを投げています。
Fiddler を利用しているのでリクエストサンプルの User-Agent は Fiddler となてっていますがテストには関係ないので無視で良いです。
以下は Fiddler の Composer でリクエストを投げている画面のキャプチャです。
GET: /api/user/:id
リクエスト
GET http://localhost:3000/api/user/123 HTTP/1.1
User-Agent: Fiddler
Host: localhost:3000
Content-Length: 0
レスポンス
HTTP/1.1 200 OK
X-Powered-By: Express
Content-Type: application/json; charset=utf-8
Content-Length: 44
ETag: W/"2c-yyXPiEPxROPhaVRftHE4bQ"
Date: Sun, 12 Feb 2017 08:48:35 GMT
Connection: keep-alive
{"id":"123","name":"tanaka","role":"group1"}
POST: /api/user
リクエスト
POST http://localhost:3000/api/user HTTP/1.1
User-Agent: Fiddler
Host: localhost:3000
Content-Length: 35
Content-Type: application/json
{"name":"tanaka", "role": "group1"}
レスポンス
HTTP/1.1 200 OK
X-Powered-By: Express
Content-Type: application/json; charset=utf-8
Content-Length: 4
ETag: W/"4-sya1BisvDmkEaBBxdTTLCQ"
Date: Sun, 12 Feb 2017 08:49:12 GMT
Connection: keep-alive
true
参考記事