始めよう、Express Part.2

みなさんこんにちは。
ソーシャルゲームへの課金がやめられない佐野です。
前回の記事 は Node.js のフレームワークである Express について、簡単な API を作成しようという名目で書いていたのですが、時間の都合上一部しか紹介できなかったので、今回はその続きをやっていこうと思います。

前回のまとめ

環境

• OS : macOS High Sierra 10.13.6
• Node.js : 8.9.4
• Express : 4.16.0

Express の導入

• npm で Express を導入
• express コマンドが使えなくて焦る
• 調査してパスを通し忘れてたことに気づく
• express コマンドが使用できるようになる
• プロジェクトの作成を行う

簡単な API の作成

• myapp/app.js に routing を記述
• myapp/routes 直下に API 作成
• 動作確認をしようと思ったらサーバを再起動させないとダメだということに気づく
• nodemon の導入
• ブラウザでの動作確認
• 感動する

ざっとこんな感じでした。詳しくは 前回の記事 を参考にしていただきたく。
では、API 作成の続きをやっていきましょう。

API 作成の続き

GET メソッド

前回は http://localhost:3000/test にアクセスした際に、myapp/routes/test.js にて定義しておいた json データが返却される様子を確認しました。
今回はまず、 http://localhost:3000/test/practice に GET メソッドをリクエストした際に特定の json データが返却されるような API を作成してみます。
前回作成した myapp/routes/test.js を、以下のように書き換えます。

var express = require('express');
var router = express.Router();

/**
 * GET
 * 前回追加した method
 */
router.get('/', function(req, res, next) {
    var param = {"test":"テストページを作成したよ"};
    res.send(param);
});

/**
 * GET 2
 * 今回追加した method
 */
router.get('/practice', function(req, res, next) {
    var param = {"result":"練習ページを作成したよ"};
    res.send(param);
});


module.exports = router;

この状態で http://localhost:3000/test/practice にアクセスしてみましょう。
あ、サーバを立てるのを忘れずに。

$ npm start

無事表示されました、簡単ですね。
次に、ルート・パラメータ を考慮した API を作成してみます。 ルート・パラメータ とは、

URL内の指定された値を取得するために使用されるURLセグメントのことを言います。捕捉された値はreq.paramsオブジェクトの中で、パスに指定されたルート・パラメータの名前をそれぞれのキーとして設定されます。 –公式より引用-

とのことです。早速作成してみましょう。myapp/routes/test.js に、以下を追記します。

/**
 * GET 3
 */
router.get('/practice/:name', function(req, res, next) {
    var param = {"result":"私の名前は " + req.params.name + " だよ"};
    res.send(param);
});

これで、 http://localhost:3000/test/practice/MasafumiSANO にアクセスすれば、私の名前は MasafumiSANO だよ と表示されるはずです。確認してみましょう。

想定通りの結果ですね。
このルート・パラメータを用いれば、例えばこんなこともできます。

/**
 * GET 3
 */
router.get('/status1/:status1/status2/:status2/name/:name', function(req, res, next) {
    var param = {"result":"私は " + req.params.status1 + " で、" + req.params.status2 + " な " + req.params.name + "だよ"};
    res.send(param);
});

はい。

POST メソッド

次に、POST メソッドを作成していきます。作成方法は GET メソッドとほぼ同様で、以下のようになります。

/**
 * POST
 */
router.post('/post-sample', function(req, res, next) {
    var param = {
        "result": "POST method だよ",
        "body": req.body.data 
    };
    res.send(param);
});

POST メソッドに関してはこのままではブラウザでの動作確認ができないので、google chrome の拡張機能: Advanced REST client を用います。
上記を chrome に追加して起動すると、以下のような画面が起動します。

Prameters -> Body を選択し、json データを下記のようにセットします。

Method は POST を選択し、Requested URL に http://localhost:3000/test/post-sample を入力して SEND ボタンを押してやると…

と、こんな感じでレスポンスが返ってきます。正常に取得できていますね。

これらを使用すれば色々遊べそうな感じがしますが、API 作成に関しては一旦この辺までで。

Express 以外の Node.js のフレームワーク

2 回続けて Express に関して触れてきましたが、Node.js にももちろん Express 以外のフレームワークが多量に存在します。
ここではその一部を紹介します。

• Koa
  Express と同様のシンプルな設計のフレームワーク。
  Express の開発チームが開発していることで有名。

• Meteor
  SPA 向けのフルスタックフレームワーク。
  クライアントとサーバの両サイドでコードの共有が簡単。
  MongoDB を使用。

• hapi
  Express よりも高機能だが軽量なフルスタックフレームワーク。
  コードを設定ファイルのように記述する。

• Sails
  Rails ライクなフルスタックフレームワーク。
  規約がある程度厳格。

まだまだたくさんありますが、キリがないので一旦有名どころを挙げてみました。

まとめ

今回はこの辺で。
前回の続きということでしたが、環境構築等は前回済ませておいたので、割とすんなり進めることができた印象です。POST メソッドの確認を行う際、これまでは postman というものを用いていたのですが、今回使用した Advanced REST client も結構使いやすかったです。機能自体はほぼほぼ同じような感じだったので、どちらを使用するかは好みですかね。

また、色々調べていくうちに Node.js の他のフレームワークも気になり始めたので、時間を見つけて触れたらいいなあと思ってたりもします。特に Meteor を。

参考

Express
Node.js + ExpressでREST API開発を体験しよう［作成編］ – Qiita
Postman