【Node.js|express】Router()とは?

node.js の epxress フレームワークにて、「Router」を使用する事によって、効率的なルーティングをする事ができます。

今回は、その Router について書いていこうと思います。

ルーティングとは

まず、簡単にルーティングについて説明をしていきます。

(分かる人は読み飛ばして下さい。)

例えば、以下のようなファイル構成があったとします。

aaaaa.com のルートディレクトリ
├ bbb.html
└ ccc.html

bbb.html にアクセスする場合、「http://aaaaa.com/bbb.html」というURLにアクセスをする事になります。

同様に、ccc.html にアクセスをする場合、「http://aaaaa.com/ccc.html」にアクセスをする事になります。

ですが、もし ccc.html が他の人に見られたくないページだった場合、ヤバいですよね。

なので、

基本的にはどのファイルにもアクセスができない様にし、許可したファイルのみアクセスができるようにする。

という風にすれば、見られたくないファイルは守れますよね。

この、「許可したファイルのみ、アクセスができるようにする」という事を実現する仕組みが「ルーティング」です。

node.js/expressでのルーティング

ルーティングでは、

「~のURLにアクセスがあった場合、~のページを表示してね!」

という設定を行います。

node.js だと、具体的には以下のようなコードになります。

//================================
// app.jsファイル
//================================
const express = require('express');
const app = express();

// bbb.htmlのルーティング
app.get('/bbb.html', (req, res) => {
  res.sendFile(__dirname + '/bbb.html');
});

// ccc.htmlのルーティング
app.get('/ccc.html', (req, res) => {
  res.sendFile(__dirname + '/ccc.html');
});

なんとなくルーティングのイメージは理解できたでしょうか。

ちなみに、「http://aaaaa.com/ppppppppp」にアクセスがあった場合、bbb.html を表示させるという事もできます。

app.get('/ppppppppp', (req, res) => {
  res.sendFile(__dirname + '/bbb.html');
});

Routerの役割

Router を使用する事で、様々なルーティングの設定を機能ごとにファイルを分け、管理しやすくできます。

例えば、いくつものルーティングの設定が必要だとしましょう。

//================================
// app.jsファイル
//================================
const express = require('express');
const app = express();

・~へのルーティング設定
・~へのルーティング設定
・~へのルーティング設定
・~へのルーティング設定
・~へのルーティング設定
以下、多数。

これだと、app.js ファイルがごちゃごちゃします。

  • メインの app.js ファイル
  • ユーザー関連のルーティング設定ファイル
  • 商品関連のルーティング設定ファイル

という風に、各機能へのルーティングごとに、別ファイルに移したいですよね。

そこで使うのが Router です。

【app.js ファイル】
 > 宣言:「ユーザールーティング.js」のファイルを使用します!
 > 宣言:「商品ルーティング.js」のファイルを使用します!
 > このURLに来たら「ユーザールーティング.js」に任せるね!
 > このURLに来たら「商品ルーティング.js」に任せるね!
【ユーザールーティング.js ファイル】
 > ルーターの機能を読みこむよ!
 > 「ユーザー一覧表示」時のルーティングを行います!
 > 「ユーザー詳細表示」時のルーティングを行います!
 > 「ユーザー登録」時のルーティングを行います!
 > 宣言:ルーターとしてエクスポートします!
【商品ルーティング.js ファイル】
 > ルーターの機能を読み込むよ!
 > 「商品一覧表示」時のルーティングを行います!
 > 「商品詳細表示」時のルーティングを行います!
 > 「商品登録」時のルーティングを行います!
 > 宣言:ルーターとしてエクスポートします!

という感じです。

Routerの具体的なコード

このままでは何となくしか分からないと思うので、node.js のコードを表示します。

コメントの書き方は参考にしないでください。

//================================
// app.jsファイル
//================================
const express = require('express');
const app = express();

// ユーザー関連のルーティングファイル読み込み
const userRouter = require('./userRouter');

// 商品関連のルーティングファイル読み込み
const productRouter = require('./productsRouter');

// 「http://aaaaa.com/users」充てに来た場合
app.use('/users', userRouter);

// 「http://aaaaa.com/products」充てに来た場合
app.use('/products', productsRouter);

app.listen(3000, () => {
  console.log('サーバーがポート3000で起動しました');
});
//================================
// userRouter.jsファイル
//================================
const express = require('express');

// ルーター機能読み込み
const router = express.Router();

router.get('/', (req, res) => {
  // ユーザー一覧を表示する処理
});

router.get('/:id', (req, res) => {
  // 特定のユーザーの詳細を表示する処理
});

router.post('/', (req, res) => {
  // ユーザーを作成する処理
});

// ルーターオブジェクトをエクスポート
module.exports = router;
//================================
// productsRouter.jsファイル
//================================
const express = require('express');

// ルーター機能読み込み
const router = express.Router();

router.get('/', (req, res) => {
  // 商品一覧を表示する処理
});

router.get('/:id', (req, res) => {
  // 特定の商品の詳細を表示する処理
});

router.post('/', (req, res) => {
  // 商品を作成する処理
});

// ルーターオブジェクトをエクスポート
module.exports = router;

この様に、「ルーティングを別ファイルに任せる」という事が可能になります。

もう少し説明

例えば、全ユーザーの年齢増をグラフで表すページ「ppppp.html」を作ったとします。

ppppp.html は zzz フォルダの下に配置しましょうか。

aaaaa.com のルートディレクトリ
└ zzz
  └ ppppp.html

ファイル名など色々ツッコミ所がありますが、無視してください。

「http://zzz/ppppp.html」にアクセスが来たとします。

この場合のルーティングはどうしたら良いでしょうか?

この場合は、単純に userRouter.js ファイル内に「ppppp.html」への道を作る事で実現できます。

//================================
// userRouter.jsファイル
//================================

// 以下を追加
router.get('/zzz/ppppp.html' (req,res) => {
  res.sendFile(__dirname + '/zzz/ppppp.html');
});

「router.get( ‘/zzz/ppppp.html’ )」の部分ですが、ここは拡張子を付けなくても大丈夫です。

拡張子を付けず「router.get( ‘/zzz/ppppp’ )」にしたとすると、アクセスするURLも「http://aaaaa.com/zzz/ppppp」になるので注意して下さい。