express-sessionモジュールとconnect-flashモジュールを理解する

はじめに

node.jsのコードの中でexpress-sessionモジュールとconnect-flashモジュールを使用する機会があったので、どのようなモジュールであるのか簡単にまとめたいと思います。

express-sessionモジュールとは

Express アプリケーションでセッション管理を行うためのミドルウェアです。セッションは、ユーザーとサーバー間で一時的なデータを保存し、状態を維持する仕組みです。このモジュールを使うことで、例えばログイン状態の管理やユーザーごとの一時的なデータ保持を簡単に実装できます。

基本的な特徴

1. セッションの生成と管理
   ユーザーがアプリケーションにアクセスすると、express-session はセッション ID を生成し、サーバー側でそのセッションに対応するデータを保存します。セッション ID は通常、クッキーを介してクライアント側に送信されます。

2. セッションデータの保存場所
   デフォルトでは、セッションデータはサーバーのメモリに保存されます。ただし、本番環境では Redis や MongoDB などのデータベースを使用して保存することが推奨されます。

サンプルコード

express-session.js

const express = require("express");
const session = require("express-session");

const app = express();

app.use(
  session({
    secret: "secret-key",
    resave: false,
    saveUninitialized: false,
    cookie: { maxAge: 60000 },
  })
);

app.get("/", (req, res) => {
  if (req.session.views) {
    req.session.views++;
    res.send(`You have visited this page ${req.session.views} times.`);
  } else {
    req.session.views = 1;
    res.send("Welcome! Refresh the page to start counting visits.");
  }
});

app.listen(3000, () => {
  console.log("Server is running on port 3000");
});

上記コードでは、express-sessionモジュールを利用することで、クライアントがリクエストを初めて送信した時にセッションが作成され、対応するセッションIDが作成されます。このセッションIDはクライアント側のクッキーに保存されます。初めてアクセスした際にはreq.session.viewsは定義されていないので、ページには"Welcome! Refresh the page to start counting visits."と表示されます。
2回目以降は、ミドルウェアがクッキーに保存されたセッションIDを参照し、サーバから該当データを取得します。取得されたセッションデータが req.session オブジェクトに格納され、各ルートで利用可能になります。req.session.views情報も取得され、ページには、You have visited this page ${req.session.views} times.が表示されます。
もし、このミドルウェアがないと、リクエスト間でデータの共有は出来ません。

express-sessionがミドルウェアとして設定されている場合にのみ、req.sessionオブジェクトがリクエストオブジェクトに追加されます。
express-sessionモジュールがなければ、req.sessionオブジェクトは存在せず、したがってreq.session.viewsのようなセッションデータも存在できません。
express-sessionは、リクエストごとにreq.sessionオブジェクトを作成します。

connect-flashモジュールとは

Express アプリケーションで一時的なメッセージ（フラッシュメッセージ）を表示するためのミドルウェアです。このモジュールを使用することで、ユーザーにメッセージを表示したり、リダイレクト後にメッセージを保持することができます。
主に、ユーザーがページをリダイレクトした後でも、メッセージを一時的に表示したい場合に使われます。例えば、ログイン成功やエラー時にそのメッセージを次のリクエストで表示する際に便利です。
connect-flash モジュールを利用することで、Express アプリケーションの req（リクエストオブジェクト）に flash() メソッドが追加されます。このメソッドを使って、セッションにフラッシュメッセージを設定したり、既存のメッセージを取得したりすることができます。

サンプルコード

express-session.js

const express = require("express");
const session = require("express-session");
const flash = require("connect-flash");

const app = express();

// セッション設定
app.use(
  session({
    secret: "secret-key", // セッション暗号化キー
    resave: false, // セッションが変更されなくても保存するか
    saveUninitialized: false, // 未初期化のセッションを保存するか
    cookie: { maxAge: 60000 }, // セッションの有効期限（ミリ秒）
  })
);

// connect-flash の設定
app.use(flash());

// ルートハンドラ
app.get("/", (req, res) => {
  // フラッシュメッセージを設定
  req.flash("info", "Welcome to the site!");
  res.redirect("/show-message");
});

app.get("/show-message", (req, res) => {
  // フラッシュメッセージを取得
  const message = req.flash("info");
  // console.log(`message: ${message[0]}`);
  res.send(message.length > 0 ? message[0] : "No messages");
});

// サーバー起動
app.listen(3000, () => {
  console.log("Server is running on port 3000");
});

上記コードでは、
req.flash("info", "Welcome to the site!");
でキーであるinfoにメッセージを保存しています。infoには配列データとして保存されます。
ちなみに、
app.use(flash());
がなければ、req.flash() を使ってメッセージを設定することができません。

res.redirect("/show-message");
で/show-messageにリダイレクトとして、そして
const message = req.flash("info");
で変数messageにinfoデータを保存しています。一度メッセージを取得すると、それはフラッシュされ（削除され）、次回のリクエストでは存在しません。

まとめ

express-sessionモジュールとconnect-flashモジュールの使用方法についてまとめました。

Reference