クライアントからpostされた値をExpressで取得するのにbody-parserを使うシーンがよくあります。その際、req.bodyundefinedになってしまう問題にたびたびハマっているので、対応方法をメモっておきます。

よくやりがちなのが以下のコード。

import * as bodyParser from 'body-parser';
import * as express from 'express';

const app = express();
app.use(bodyParser.json());

app.post('/', (req, res) => {
  const form = req.body;
  // 処理
  console.log(form);
});

こちらで実行するとreq.bodyの中身はundefinedになってしまいました。書籍でもよくこの記述を見かけるのでハマりやすい。

ではどうすればいいか、その答えは公式のドキュメントにありました。それによるとこう↓すればOK。

import * as bodyParser from 'body-parser';
import * as express from 'express';

const app = express();
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());

app.post('/', (req, res) => {
  const form = req.body;
  // 処理
  console.log(form);
});

ポイントは以下の一文。

app.use(bodyParser.urlencoded({ extended: false }));

これを追加することでbody.reqにpostした値が格納されるようになりました。なお、わたしのつたない英語力でドキュメントを読んだところ、extendedのfalseはクエリ文字列でパースする設定のようです。デフォルトはtrueですが、デフォルトの使用は推奨していないとのこと。