JavaScript講座
(メールマガジン編)

5/26日発行 ヨッシーの”ホームページを作ろう!(JavaScript編)”★Vol.30★

クッキーの削除

前回はクッキーを使ってみたね。
じゃあ、作ったクッキーを使わなくなったりして削除したくなったらどうしよう?
そう、今回は前回作ったクッキーの内容を消すという操作をやってみよう。

 

★ クッキーの削除の原理 ★

クッキーのデータを削除するプログラムを見る前に、一体どのようにしてクッキーのデータを削除するのかを考えてみよう。
クッキーへの書き込みは

    document.cookie ="name = 値; expires = 期限;"

だったよね。
nameというのは値に対する名前。そして、expiresというのはこのクッキーの有効期限だね。
(有効期限というのはこの期限を過ぎると自動的にデータが消えてしまう日)
つまり、クッキーを操作して削除したいクッキーの期限を今の日付より前にしてやればいい。
(期限が切れたということで、クッキーのデータは削除される)

<まとめ>
クッキーを消すためには、クッキーにデータを入力する作業と同じ。
違いは有効期限を現在よりも前にするだけ。

じゃあ、実際にクッキーを削除してみよう。

 

★ クッキーの削除 ★

まず、期限を過ぎたクッキーを作るために、現在の時刻と、それよりも前の日付のを作ろう。

削除したいクッキーの識別キーをnameとしよう。
削除は簡単に、

    document.cookie ="name = 値; expires = 期限;"

とすればよかったので、この期限のところに現在よりも前の日付を入れることを考えてやろう。
ということで、まず現在の日付が必要だね。
現在の日付を取得するには以前やった命令を使って、

    expiredate = new Date();    ←expairdateに現在の日付を代入

では、次に現在の日付よりも前の日付にするための命令をやってみよう。

    expiredate.setYear(expairedate.getYear()-1);

このようになるんだ。
ここで新しい命令が出てきたよね。

年を変更する

変数.setYear(年)

これは、変数(今の場合expiredate)の年の部分に好きな年を入れることができるんだ。
※(日時の入った)変数には年、月、日、時間、などさまざまな情報が入っているけど、その中の年の部分だけを変更できる。
この他にも、日付や時間だけを変えることもできるんだけど今はこれだけを覚えておいてね。
この命令の“年”の部分に入っている

    expairedate.getYear()-1

という命令だけれど、これは日時に関する命令のところでやったよね。
これは、expireから年を呼び出して(expairedate.getYear())、その年から1を引いているんだ。
つまり、この命令は

    expiredate.setYear(expairedate.getYear()-1);
            ↓
    expiredateの年から1を引いた年を、expiredateの年に設定している

ここで、現在よりも一年前の日付がexpiredateに入ったことになる。
また、今得られた日付を“Fri,31-Dec-2030 23:59:59“のような形にするために、

日付の形式を変更する

変数.toGMTString()

を使う。
(※これは暗記。クッキーに期限を代入する時はこれを使って形を変更しないといけない。)
これらを使ってクッキーに書き込みをすると。

    document.cookie = "name=;expire="+expiredate.toGMTString()+";";

となるんだ。
これで、クッキーの期限が前日に設定されたので、今日の時点でクッキーの期限が過ぎていることになり削除される。
これで、クッキー削除の方法はおわりだよ。


back.gif (1116 バイト) next.gif (705 バイト) top.gif (583 バイト)