【セッション管理】Next.js + CakePHP4【基本編】
SPAとAPIが別々のサーバーで稼働している場合、セッション管理をどのように行うかについては慎重に考える必要があります。このブログでは、SPAとAPIがそれぞれ異なるサーバーで稼働し、セッションを管理するためにhttpOnlyかつSecure属性のCookieを使用する方法について説明します。SPAはNext.jsで、API側はCakePHP4で構築されているという設定で解説していきます。
まず、SPAとAPIを異なるサーバーで稼働することによって、より高い拡張性やパフォーマンスを実現することができます。しかし、異なるドメインで稼働するため、セッション管理が必要になります。セッションを管理する方法として、Cookieを使用することが一般的です。ただし、Cookieを正しく設定しないと、悪意のあるユーザーによってCookieが傍受される可能性があります。これを防ぐために、セキュリティのためのhttpOnlyかつSecure属性を使用する必要があります。
まず、SPA側のセッション管理について考えてみましょう。SPA側のNext.jsアプリケーションでは、クライアント側でのルーティングを実現するためにCookieを使用することができます。Cookieの設定方法は、setCookie関数を使用することで実現できます。次のコード例は、SPA側でのCookieの設定方法を示しています。
import { setCookie } from 'nookies';
// Cookieの設定
setCookie(ctx, 'session', sessionId, {
maxAge: 30 * 24 * 60 * 60, // 30日間有効
path: '/',
secure: true,
httpOnly: true,
});
この例では、nookiesパッケージのsetCookie関数を使用して、Cookieを設定しています。この関数には、Cookieの名前、値、オプションが含まれます。オプションとして、maxAge、path、secure、httpOnlyを指定することができます。secureとhttpOnlyは、それぞれCookieを送信するプロトコルがHTTPSであることと、クライアント側のJavaScriptからCookieにアクセスできないことを保証します。
次にAPI側のセッション管理について考えてみましょう。API側では、CakePHP4のSessionコンポーネントを使用することができます。このコンポーネントには、セッション情報を管理するための便利な機能が含まれています。
まず、Sessionコンポーネントを使用するには、AppController.phpファイルに次のように追加する必要があります。
namespace App\Controller;
use Cake\Controller\Controller;
use Cake\Http\Session\DatabaseSession;
use Cake\Http\Session\Cookie\SessionCookie;
class AppController extends Controller
{
public function initialize()
{
parent::initialize();
$session = $this->request->getSession();
// Cookieセッションを有効にする
$sessionHandler = new SessionCookie();
$session->setHandler($sessionHandler);
// セッションの有効期限を30日に設定
$this->loadComponent('Cakephp4Session', [
'defaults' => 'database',
'timeout' => 30 * DAY,
]);
}
}
この例では、AppController.phpファイルのinitialize関数内で、セッション情報を管理するためのコンポーネントを設定しています。SessionCookieクラスを使用して、Cookieセッションを有効にし、セッションの有効期限を30日に設定しています。
また、データベースセッションを使用する場合は、DatabaseSessionクラスを使用してセッション情報を保存することができます。例えば、次のように設定することができます。
// データベースセッションを有効にする
$sessionHandler = new DatabaseSession();
$session->setHandler($sessionHandler);
このように、CakePHP4のSessionコンポーネントを使用することで、セッション管理を簡単に実現することができます。
最後に、SPAとAPIの両方でCookieセッションを有効にするには、Secure属性を設定する必要があります。Secure属性を有効にするには、HTTPSプロトコルを使用する必要があります。HTTPSを使用することで、クライアント側のJavaScriptからCookieにアクセスできなくなり、より安全なセッション管理が実現できます。
以上が、SPAとAPIが別々のサーバーで稼働している場合に、httpOnlyかつSecure属性のCookieを使用してセッション管理を行う方法です。SPA側ではNext.jsを、API側ではCakePHP4を使用することで、セッション管理を簡単に実現することができます。
関連記事

既存ディレクトリをgit管理する方法
github すでに開発を進めているローカルの環境(ディレクトリ)をgithub ...

Next.jsでbodyタグの属性切り替えはどうするの?
最近なにかとお触りしてるNext.js。Reactを扱いやすく、特にルーティング ...

【これで解決】SPAでセッション管理するならCookieにしよう【CakePHP4編】
ここ最近の主流はSPA(シングルページアプリケーション) + APIサーバの構成 ...

【環境構築】PythonとNext.jsで分断型Webサイトの下準備
ChatGPT、激アツですね。ここ最近はAIに頼りっきりな私です。情報の鮮度は落 ...

【即解決】CakePHP4でAPIを実装してCORSが解消しないあなたへ【疑うべきはプリフライト】
プログラミング Webシステムを、フロントサイドとサーバーサイドを分けて構築した ...
ディスカッション
コメント一覧
まだ、コメントがありません