パラメータリクエスト

すべての ToDo を返すことができたので、続いてパラメータクエリを投げられた場合の処理に対応する。

書籍「ハンズオン Node.js」では、 { id: 1, title: 'ネーム', completed: true }, のように登録されている ToDo に対し、 true または false をパラメータで渡した場合のコードが紹介されいる。

少しばかり書籍のコードを変更してパラメータとして id が渡されることを想定したコードに書き換えた。

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

let todos = [
  { id: 1, title: 'ネーム', completed: true },
  { id: 2, title: '下書き', completed: false },
  { id: 3, title: 'フルーツグラノーラ購入', completed: false },
  { id: 4, title: 'ブログタグ見直し', completed: true },
];

app.get('/api/todos', (req, res) => {
  if (!req.query.id) {
    return res.json(todos);
  }
  const id = req.query.id;
  console.log(id); // パラメータを確認
  // res.json(todos.filter((todo) => todo.id === id));
  res.json(todos.filter((todo) => todo.id === Number(id)));
});

app.listen(3000);

配列 todos の id を Number() で型変換する必要がありました。 JavaScript の知識が色々欠落していることがわかった。

パラメータクエリの結果確認

$npm start し、別のターミナルで確認する。

$ node --experimental-repl-await
Welcome to Node.js v14.13.0.
Type ".help" for more information.
> require('isomorphic-fetch')
[Function (anonymous)]
> await fetch('http://localhost:3000/api/todos?id=2')
Response {
...
> console.log(_.status, await _.json())
200 [ { id: 2, title: '下書き', completed: false } ]
> await fetch('http://localhost:3000/api/todos?completed=false')
Response {

VS Code でも同様に

GET http://localhost:3000/api/todos?id=3

HTTP/1.1 200 OK
X-Powered-By: Express
Content-Type: application/json; charset=utf-8
Content-Length: 72
ETag: W/"48-gewESgsL5ldvIM+dKJ5lSL8Yzao"
Date: Sun, 27 Dec 2020 22:18:54 GMT
Connection: close

[
  {
    "id": 3,
    "title": "フルーツグラノーラ購入",
    "completed": false
  }
]

Visual Studio Code Rest Client にて確認

登録されていない id で確認。

GET http://localhost:3000/api/todos?id=50

HTTP/1.1 200 OK
X-Powered-By: Express
Content-Type: application/json; charset=utf-8
Content-Length: 2
ETag: W/"2-l9Fw4VUO7kr8CvBlt4zaMCqXZ0w"
Date: Sun, 27 Dec 2020 22:20:46 GMT
Connection: close

[]