前置き

前回DockerでExpress環境を作成するという記事を出したのですが、それだけあってもなーという感じなので

Expressの使い方について簡単に説明しておこうと思います。

ExpressはNode.jsを使用した轻量なWebフレームワークです。最近ではhonoとかNestJSとかが人気なイメージですが、

なんだかんだ昔からあるので人気なバックエンドのフレームワークです。

Expressの基本的な使い方

HTTP GETリクエストに対して「Hello, World!」と返すだけのアプリケーションを作成してみます。

import express, { Request, Response } from "express";
const app = express();
const PORT = 3000;

// ルートの定義
app.get("/", (req: Request, res: Response, next: express.NextFunction) => {
  res.send("Hello, World!"); 
});

// サーバーの起動
app.listen(PORT, () => {
  console.log(`Server is running on <http://localhost>:${PORT}`);
});

図にするとこんな感じです。

ルートハンドラと書いてある部分が

app.get("/", (req: Request, res: Response, next: express.NextFunction) => {
  res.send("Hello, World!");
});

この部分になります。

Expressではアクセスに対して三つの引数が取れます。

req (リクエスト) オブジェクトの概要

req (リクエスト) オブジェクトは、クライアントからサーバーに送られるHTTPリクエストの情報を格納します。要するに、アクセス元の情報がここに入ってくる、ということです。いくつかreqオブジェクトの中身を載せておきます。

• req.method: HTTPメソッド (GET, POST, etc.)
• req.url: リクエストのURL
• req.headers: HTTPヘッダー情報
• req.query: URLクエリーパラメータ
• req.params: ルートパラメータ
• req.body: リクエストボディ (ミドルウェアなどのライブラリが必要)

例えば、以下のようなコードであればhttp://localhost:3000にアクセスするとGETとログに表示されます。

app.get("/", (req: Request, res: Response, next: express.NextFunction) => {
  console.log(req.method);
  res.send("Hello, World!");
});

res (レスポンス) オブジェクトの概要

res (レスポンス) オブジェクトは、サーバーからクライアントに返されるHTTPレスポンスの情報を格納します。いくつかreqオブジェクトの中身を載せておきます。

• res.send(): レスポンスにメッセージを追加
• res.json(): レスポンスでJSONを送信
• res.status(): HTTPステータスコードを設定
• res.redirect(): 別のURLにリダイレクト

例えば以下のようなコードでは、http://localhost:3000にアクセスするとhttp://localhost:3000/redirectにリダイレクトされ

Hello, World!と画面に表示されます。

import express, { Request, Response } from "express";
const app = express();
const PORT = 3000;

app.get("/", (req: Request, res: Response, next: express.NextFunction) => {
  res.redirect("/redirect");
});

app.get(
  "/redirect",
  (req: Request, res: Response, next: express.NextFunction) => {
    res.send("Hello, World!");
  }
);

app.listen(PORT, () => {
  console.log(`Server is running on http://localhost:${PORT}`);
});

next オブジェクトの概要

nextは、ミドルウェア関数を複数つなげて処理を実現するために利用されます。例えば、リクエストを特定のハンドラに渡す前にログを記録したり、認証を行う際に使用します。

このケースだとあまり必要性を感じないですが、実際よく使うので一応書いておきます。

app.get("/", (req, res, next) => {
  console.log("ログを記録");
  next(); // 次の処理へ
}, (req, res) => {
  res.send("Hello, World!");
});

まとめ

今回はExpressは長く使われているアプリではBFFに採用されているケースも多いと思うので、参考になれば幸いです！