Cookie を管理する非同期 API CookieStore

従来の JavaScript では Cookie の管理は document.cookie を使用して文字列で行われていました。しかし、文字列での Cookie 管理は面倒で間違いやすいです。また document.cookie は同期的に動作するため、Cookie の更新が完了するまでイベントループがブロックされてしまいます。さらに document オブジェクトに依存しているため、Web Worker や Service Worker などの非同期環境では使用できません。

このような問題を解決するために、非同期 API CookieStore が導入されました。CookieStore は非同期的に Cookie の読み書きを行うことができ、さらに Cookie の属性をオブジェクトとして扱うことができます。

以下の例では、CookieStore を使用して Cookie を設定します。

await cookieStore.set({
  name: 'session',
  value: 'abc123',
  domain: 'example.com',
  expires: new Date(Date.now() + 3600 * 1000),
});

cookieStore.get もしくは cookieStore.getAll を使用して Cookie を取得できます。cookieStore.delete を使用して Cookie を削除することもできます。

const sessionCookie = await cookieStore.get('session');
const allCookies = await cookieStore.getAll();
 
await cookieStore.delete('session');

CookieStore API は Baseline 2025 で導入されており、すべてのモダンなブラウザでサポートされています。