DHTML -2-

　では、実際にデータの書き出しと読み込みを行うためのスクリプトを説明してみましょう。
　ここでは、Cookie動作スクリプトをフリーで配布している http://www.hidaho.com/cookies/cookie.txt (当方コピーはこちら)　の一部を抽出して説明していきます。

著作権情報

　Written by: Bill Dortch, hIdaho Design <bdortch@hidaho.com>
　The following functions are released to the public domain.

　http://www.hidaho.com/
　

　まず、Cookie は、

　　document.cookie = W
　　R = document.cookie
　

　の書式を用いて書き込みと読み込みを行います。　用いるオブジェクトは双方共通で、値を代入するか、代入されるかの差でしかありません。　ただし、Cookieへの書き込みには、定められた書式に従う必要があります。

Cookieデータの書き込み書式

　　document.cookie = [NAME] + "=" + [VALUE] + " ; expires=" + [DATE] +
　　" ; path=" + [PATH] + " ; domain=" + [DOMAIN_NAME];
　

　書式は全ての項目を１行で書き込まなくてはなりません。　また、その書式の間には「；セミコロン」で区切りを入れなければなりません。　さらに、式と値の間には「＝」を用いることも義務付けられています。
　スタイルシートのように「：」で式を結ばないことに注意が必要でしょう。
　式の順序はリファレンスを見る限り、特に決まっては内藤ですが、最初に「 [NAME] + "=" + [VALUE] 」を指定することが望ましいようです。

データを書き込む

　データの書き込みは、基本的には下記のファンクションで行えます。

クッキーのデータを書き込む

  function setCookie(name, value, exp) {
    if (!CookieState) return;
      expire = dataLong(exp);
      document.cookie = name + 
        "=" + escape(value) + ((expire == null) ? "" : 
        (";expires =" + expire.toGMTString()));
  }

  function dataLong(Days){
    var expdate = new Date ();
    expdate.setTime ( expdate.getTime() + 
                         (Days*24*60*60*1000)); 
    return expdate;
  }

　書式例 : setCookie("DATA_01","テスト",30)

　上記の例は、データを書き込むための「 setCookie 」ファンクションと、データの有効期限日数を計算する「 dataLong 」ファンクションとで成り立っています。　最も、ここで説明する限りでは２つに分かれている必要性は余りありまんが。
　この「 dataLong 」ファンクションは、日数単位で有効期限を設定することが出来ます。　例えば、「 dats = dataLong(1) 」とすれば、１日間有効なクッキーを作成するための数字が代入されることになります。

　Cookie への書き込みは「エスケープコード」を用いますので、escape(value)を用いて変換を掛けています。また、省略可能な「exp : 有効期限」は、数値が代入されている場合にのみ値を作成するように組まれています。

データを読み込む

　データの読み込みも、基本的には書き込みの逆の作業ということになりますが、スクリプトは下記のようになります。

クッキーのデータを読み込む

  function getCookie (name) {
    var arg = name + "=";
    var alen = arg.length;
    var clen = document.cookie.length;
    var i = 0;
    while (i < clen) {
      var j = i + alen;
      if (document.cookie.substring(i, j) == arg)
        return getCookieVal (j);
        i = document.cookie.indexOf(" ", i) + 1;
        if (i == 0) break; 
      }
    return null;
  }
  function getCookieVal (offset) {
    var endstr = document.cookie.indexOf (";", offset);
    if (endstr == -1){
      endstr = document.cookie.length;
    }
    return unescape(document.cookie.
                substring(offset, endstr));
  }

　書式例 : getCookie("DATA_01")

　このスクリプトは、Bill Dortch氏のものをそのまま使用していますが、殆どの動作ルーチンは、ネットスケープ社の標準モジュールと同じになります。　ただ、Bill Dortch氏のスクリプトは、 while を用いることで、複数の情報が記録されているクッキーに対しても対応できるように組まれています。
　最初に、取り出される情報の名前とイコール文の式を「 arg 」変数へ代入し、その文字列の長さを「 alen 」変数に格納しています。「 while 」ステートメントは、読み込み対象のクッキーの文字列の長さを記録している「 clan 」変数を超えるまで繰り返され、格納されているクッキーの中の全ての文字列から「 name 」で指定したクッキーの情報を取り出し出来るようになっています。
　「 getCookieVal() 」ファンクションは、「 getCookie() 」ファンクションで読み込まれた文字列が合致する場合に呼び出されるサブセット的存在になります。　こちらで実際に読み込み対象のクッキーを取出しするわけですが、「 unescape 」メソッドを用いて、情報をエスケープコードから元に戻す変換を行っています。

ページの最上段へ移動します