JavaScriptでセッションCookie（セッション限定Cookie）を作成する方法

セッションCookieとは？

セッションCookie（セッション限定Cookie）とは、有効期限（expires属性）やMax-Age属性を持たないCookieのことです。このタイプのCookieは、訪問者がブラウザを閉じた時点で自動的に削除されます。一時的なログイン状態の保持や、ページ間の一時的なデータの受け渡しなどに活用されています。

JavaScriptでセッションCookieを作成する手順

JavaScriptでセッションCookieを作成するのはとても簡単です。document.cookieプロパティに「名前=値」の形式で文字列を代入するだけでOKです。ポイントは、expires属性を指定しないことです。

// expires属性を付けない → セッションCookieになる
document.cookie = 'username=TaroYamada';

このようにexpires属性を省略した場合、そのCookieはブラウザを閉じると同時に失効します。これがセッションCookieの基本的な作成方法です。

比較：永続Cookie（有効期限あり）を作成する場合

一方で、ブラウザを閉じても一定期間残り続ける永続Cookieを作成したい場合は、expires属性に未来の日付を明示的に設定します。たとえば「現在時刻＋5年」を指定するコードは以下の通りです。

const d = new Date();
d.setTime(d.getTime() + (5 * 365 * 24 * 60 * 60 * 1000)); // 現在時刻 + 5年
const expires = 'expires=' + d.toUTCString();
document.cookie = 'username=TaroYamada;' + expires;

expires属性は、そのCookieが失効する日付を示します。つまり、この属性を空白のままにするかどうかが、セッションCookieと永続Cookieを分ける分かれ目になります。

注意点

• セッションCookieには期限を設定しない： 未来の日付をexpiresに設定してしまうと、それはセッションCookieではなく永続Cookieになってしまいます。意図せず長期保存される原因となるため注意しましょう。
• セッション復元機能に注意： 一部のブラウザには、終了時に開いていたタブを復元する機能があり、その際にセッションCookieが復元されることがあります。厳密な制御が必要な場合は、サーバー側のセッション管理と組み合わせるのが安全です。
• セキュリティ属性との併用： Secure属性・HttpOnly属性・SameSite属性などを適切に組み合わせることで、より安全なCookie運用が可能になります。

まとめ

JavaScriptでセッションCookieを作成するには、document.cookieに値を代入する際にexpires属性を省略するだけです。逆に、ブラウザを閉じても残したい情報がある場合は、現在時刻から数年先などの未来の日付をexpires属性に設定しましょう。用途に応じて両者を使い分けることが、快適で安全なWeb体験の実装につながります。