登録を受ける

送られてきたものを受け取る

設計図の 3 行目です。

POST /items  商品を登録する

ここまでは返すだけでした。登録では逆に、相手から送られてきたデータを受け取ります。出品フォームに入力された商品名や価格が、リクエストの本文に入って届きます。

受け取る準備が要る

本文は、そのままでは読めません。1 行の準備が必要です。

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

これは「JSON で届いた本文を、オブジェクトに直しておいてください」という指示です。これを書き忘れると req.body が undefined になります。

登録がうまくいかないときに最初に疑うところなので、覚えておいてください。

req.body から読む

準備ができたら、本文はこう読めます。

app.post("/items", (req, res) => {
  const newItem = {
    id: nextId,
    name: req.body.name,
    price: req.body.price,
    sold: false,
  };
  items.push(newItem);
  res.status(201).json(newItem);
});

読むのが req、書くのが res という役割は、第3章から変わりません。

作ったときは201

成功なら 200 でよさそうですが、登録のときは 201 を返します。「新しく作った」を表す専用の番号です。

受け取る側は、この番号だけで「一覧が更新された」と判断できます。数字で結果が伝わるのが、ステータスコードの利点です。

id はサーバーが決める

新しい商品の id を、送られてきた本文から取ってはいけません。

const newItem = { id: req.body.id, ... }; // 危ない

他人の商品と同じ id を指定されたら、データが壊れます。id はサーバーが決めるものです。この演習では、いまある最大の id に 1 を足す形にします。

手を動かす

演習では、出品の API を作ります。受け取る準備、id の採番、201 の 3 つを揃えてください。

1. express.json() を使って本文を読めるようにする
2. POST /items は {id, name, price, sold} の形で作った商品を 201 で返す
3. id は「いまある最大の id + 1」にし、sold は false にする