NodeのExpressのルーティングを理解してgetやpostなどのHTTPリクエストに対応する

FirebaseのFunctionsでNodeのExpressを初めて使って目眩を起こすような感しがした、getやpostなどのHTTPリクエストに対してルーティングという処理を行う。これが変数と関数とメソッドとエンドポイントなどの色んな要素で入り組んで頭の中がグチャグチャになると倒れるくらい難しい。分かれば何ということもないし、Expressの便利な機能なので、良く覚えておきたい。Expressのルーティングとは何か都会の渦巻く高層道路に「Express routing」と書かれている

ある関数の実行をサイトアドレスで振り分ける処理がルーティングで、Expressは受け取るHTTPリクエストのメソッドを含めて最初から分散させることができる。

ルーティングとは、アプリケーションが特定のエンドポイントに対するクライアント要求に応答する方法として、URI (またはパス) と特定の HTTP 要求メソッド (GET、POST など) を決定することです。

基本的なルーティング｜Express｜StrongLoopとその他のexpressjs.comコントリビューター

ExpressはHTTPリクエストがどこにどのように来たかで、関数の実行を制御すること、またはアプリケーションのエンドポイントとして機能させることがルーティング処理で可能になる。Expressのルーティングのプログラムコンピュータールームに「Express routing program」と書かれている

コンピュータールームに「Express routing program」と書かれている

Expressのルーティングのプログラムは四つの項目で構成される。ルーティングのプログラムの基本的な構成

app.METHOD(PATH, HANDLER)

四つの帯文字の部分がExpressのルーティングのプログラムの四つの項目に対応している。

app（アップ）

使用するExpressのインスタンス

METHOD（メソッド）

受け取るHTTPリクエストの種類

PATH（パス）

サーバーの送受信のサイトアドレス

HANDLER（ハンドラ）

HTTPリクエストのコールバック関数

実際のソースコードでは任意の値で使われることになる。getメソッドをルートディレクトリで対応するサンプル

const express = require('express');
const app = express();

app.get('/', (req, res) => {
res.send('response to getrequest');
});

一行目のrequire()メソッドでExpressのモジュールを入れて二行目のexpress()メソッドでインタンスを生成した。四行目から六行目がルーティング処理のプログラムになる。四行目の「app」が使用するExpressのインスタンスで、サンプルではconstで定数として宣言された二行目のappに相当する。その次の「get」が受け取るHTTPリクエストの種類で、getメソッドで送られたものに対して動作するという指定になる。その次の「/」がサーバーの送受信のサイトアドレスで、サンプルでは半角スラッシュだけだからルートディレクトリで対応する。その次の(req, res) => { res.send('response to get request') }がHTTPリクエストのコールバック関数で、内容としては「response to get request'」（getリクエストへ返す）という文字列をresオブジェクトのsend()メソッドで送る。Expressのルーティングのハンドラはreqとres（受け取りと送り返し）という二つのオブジェクトによってデータの送受信を行うことになる。postメソッドをルートディレクトリで対応するサンプル

const express = require('express');
const app = express();

app.post('/', (req, res) => {
res.send('response to getrequest');
});

ルーティングのプログラムのメソッドの部分を「post」にするとpostメソッドによるHTTPリクエストに対応する。getメソッドをapiディレクトリで対応するサンプル

const express = require('express');
const app = express();

app.get('/api', (req, res) => {
res.send('response to getrequest');
});

ルーティングのプログラムのパスの部分を「/api」にするとapiディレクトリのサイトアドレスでHTTPリクエストに対応する。メソッドの種類やパスの指定は他にも、色々、あってExpress でのルーティングに紹介されている。Expressのルーティングのデータ角張った図形の集まりに「Express routing data」と書かれている

角張った図形の集まりに「Express routing data」と書かれている

HTTPリクエストのデータの送受信はルーティングのプログラムのハンドラ、すなわち呼び出しへのコールバック関数で行う。HTTPリクエストで送られたデータの受け取りExpressでのHTTPリクエストのデータの受け取りはルーティングのハンドラの「req」オブジェクトから各種メソッドで可能だけれども前提条件としてbody-parserモジュールがなくてはならない。

body-parser

body-parserモジュールはExpressのバージョン14.6.0か14.7.0以降に標準搭載されていてインストールする必要はなく、expressアプリからメソッドで使用できる。

express.json([options])

JSONへ解析して受け取る。

14.6.0以降。

express.urlencoded([options])

URLエンコードへ解析して受け取る。

14.6.0以降。

express.raw([options])

Bufferへ解析して受け取る。

14.7.0以降。

express.text([options])

文字列へ解析して受け取る。

14.7.0以降。

出典：Express 4.xJSONの受け取りのサンプル例えばJavaScriptのfetch()メソッドのpostメソッドでルートディレクトリに送られた{"data":"テスト"}というJSONデータ（application/json）を受け取るような場合。

const express = require('express');
const app = express();

app.use(express.json());

app.post('/, (req, res) => {
console.log(req.body); // {"data":"テスト"}
console.log(req.body.data); // テスト
res.send("Receipt completed");
});

URLエンコードの受け取りのサンプル例えばHTMLのform要素のpostメソッドでapiディレクトリに送られた("data":"テスト")というURLエンコードデータ（application/x-www-form-urlencoded）を受け取るような場合。

const express = require('express');
const app = express();

app.use(express.urlencoded({extended:true}));

app.post('/api, (req, res) => {
console.log(req.body) // {"data":"テスト"}
console.log(req.body.data) // テスト
res.send("Receipt completed");
});

Expressはbody-parserモジュールを使わないとデータの受け取りができず、postメソッドで送られたreqオブジェクトを開くと空になるという不可思議な現象が起きる。HTTPリクエストへのデータの送り返しExpressでのHTTP リクエストへのデータの送り返しはルーティングのハンドラの「res」オブジェクトから各種メソッドで可能になっている。

res.download()

ファイルのダウンロードのプロンプトを出す。

res.end()

ハンドラを終了する。

res.json()

JSONデータを送信する。

res.jsonp()

JSONPをサポートするJSONデータを送信する。

res.redirect()

リダイレクトする。

res.render()

テンプレートをレンダリングする。

res.send()

様々なデータを送信する。

res.sendFile

ファイルをオクテットストリーム（任意のバイナリ形式）で送信する。

res.sendStatus()

レスポンスのステータスコードを設定してその文字列を本文として送信する。

出典：Expressでのルーティングjsonメソッドの送り返しのサンプル例えばgetメソッドでHTTPリクエストがあってルートディレクトリに{data:"テスト"}というJSONデータを送り返すような場合。

const express = require('express');
const app = express();

app.get('/', (req, res) => {
res.json({data:"テスト"})
});

sendメソッドの送り返しのサンプル例えばgetメソッドでHTTPリクエストがあってapiディレクトリにHTMLで「テスト」を表示するような場合。

const express = require('express');
const app = express();

app.get('/api', (req, res) => {
res.send("<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta content='width=device-width, initial-scale=1' name='viewport'/>
<title>テスト</title>
</head>
<body>
<p>テスト</p>
</body>
</html>");
});

ExpressのルーティングはHTTPリクエストをどこでどのように受け取って対応するかを決めるものだけど、とにかくプログラムの書き方が分からないと取り分けメソッドとパスを巡って非常に混乱せざるを得ない。

app.METHOD(PATH, HANDLER)

もう一度、確認しておくとメソッドの部分は受け取りのメソッドだけを意味して送り出しに関してはハンドラの部分で指定される。そしてパスの部分は受け取りと送り出しの両方のパスを意味していている。ルーティングのプログラムのメソッドとパスがHTTPリクエストの送り出しに関わるものを固有に含むと捉えると受け取りと考え合わせてどっちがどっちなのかと訳が分からなくなるから注意したい。