JavaScript Cookie_基礎知識

Cookie の使用 ドキュメント オブジェクトに Cookie 属性があることはすでにわかっています。しかし、クッキーとは何でしょうか？ 「一部の Web サイトでは、情報が Cookie と呼ばれる小さなテキスト ファイルでハード ドライブに保存されます。」 - MSIE ヘルプ。一般に、Cookie は HTML よりも高度な CGI または同様のファイル、プログラムなどによって作成されますが、JavaScript も Cookie に対する非常に包括的なアクセス権を提供します。
続行する前に、まず Cookie の基本的な知識を学ぶ必要があります。
各 Cookie は次のとおりです: =
の制限は JavaScript の名前制限と似ており、「JavaScript キーワードを使用できない」という点は少なく、「使用できるのは 1 つだけ」です。 「URL エンコードで使用される文字」。後者は理解するのがさらに困難ですが、名前に文字と数字を使用するだけであれば問題ありません。 の要件も「URL エンコードで使用できる文字のみ使用できる」です。
各 Cookie には有効期限があります。コンピュータの時計が有効期限を過ぎると、Cookie は削除されます。 Cookie を直接削除することはできませんが、有効期限を現在時刻よりも前に設定することで間接的に削除できます。
各 Web ページまたは各サイトには独自の Cookie があり、このサイトの Web ページからのみアクセスでき、同じサイト内の許可されていない領域にはアクセスできません。 Cookie の各「グループ」には指定された合計サイズがあります (「グループ」ごとに約 2KB) 最大合計サイズを超えると、新しい Cookie が「定着」できるように、期限切れになった最も古い Cookie が最初に削除されます。
次に、document.cookie 属性の使用方法を学びましょう。
document.cookie 属性を直接使用するか、変数に値を割り当てるなどの何らかの方法を使用して document.cookie の値を取得すると、現在のドキュメントに Cookie がいくつあるかを知ることができます。各 Cookie 名の値とその値。たとえば、「document.write(document.cookie)」をドキュメントに追加すると、結果は次のようになります。 > これは、ドキュメントに 3 つの Cookie: name、email、lastvisited が含まれていることを意味し、その値はそれぞれ kevin、kevin@kevin.com、index.html です。ご覧のとおり、2 つの Cookie はセミコロンとスペースで区切られているため、 cookieString.split('; ') メソッドを使用して各 Cookie の配列を取得できます (最初に var cookieString = document.cookie を使用します)。
Cookie を設定する方法は、document.cookie に値を割り当てることです。他の場合の代入とは異なり、document.cookie に値を代入しても元の Cookie は削除されず、Cookie が追加されるか、元の Cookie が変更されるだけです。割り当ての形式:

document.cookie = 'cookieName='scape('cookieValue')
';expires='expirationDateObj.toGMTString();

その後めまいがしますかこれが見えますか？上記の太字でない単語は正確にコピーし、太字の単語は実際の状況に応じて変更する必要があります。 cookieName は Cookie の名前、cookieValue は Cookie の値、expirationDateObj は有効期限を指定する必要がない場合は、2 行目は不要です。有効期限が指定されていない場合、ブラウザはデフォルトでブラウザを閉じた後 (つまり、すべてのウィンドウを閉じた後) に有効期限が切れます。
上に下線があるのが見えましたか?これらは注意すべき点です。
まず第一に、escape() メソッド: なぜこれを使用する必要があるのでしょうか? Cookie 値の要件が「URL エンコードで使用できる文字のみ使用できる」ためです。「escape()」メソッドが URL エンコード方式に従って文字列をエンコードすることがわかっているため、「escape()」メソッドを使用して Cookie に出力された値を処理し、「unescape()」を使用して処理するだけで済みます。 Cookie から出力される値 受信した値は確実です。これら 2 つのメソッドの最も一般的な用途は、Cookie を処理することです。実際、Cookie の設定は「document.cookie = 'cookieName=cookieValue'」のように簡単ですが、cookieValue に URL に使用できない文字が含まれないようにするには、escape() を使用することをお勧めします。
次に、「期限切れ」の前のセミコロン: 注目してください。それはセミコロンだけであり、それ以外は何もありません。
最後に toGMTString() メソッド: Cookie の有効期限は GMT 形式で設定されます。他の形式の時刻は影響しません。
それでは実際に戦闘をしてみましょう。 「name=rose」の Cookie の有効期限が 3 か月になるように設定します。


varexpires = new Date();
expires.setTime(expires.getTime() 3 * 30 * 24 * 60 * 60 * 1000);
/* 3 か月 x 1 か月は 30 日として扱われます x 1 日は 24 時間として扱われます
x 1 時間は 60 分 x 1 分は 60 秒として扱われます );

escape() メソッドが使用されないのはなぜですか?これは、rose が有効な URL エンコード文字列、つまり 'rose' ==scape('rose') であることがわかっているためです。一般に、Cookie を設定するときにscape() を使用しない場合は、Cookie を取得するときに unescape() を使用する必要はありません。

もう一度やってみましょう。指定された Cookie の値を見つける関数を作成します。

function getCookie(cookieName) {
var cookieString = document.cookie;
var start = cookieString.indexOf(cookieName '='); // 等号を追加する理由
// 一部の Cookie 値に cookieName と同じ文字列を含めることは避けます。
if (start == -1) // 見つかりません
return null;
start = cookieName.length 1;
var end = cookieString.indexOf(';', start); > if (end == -1) return unescape(cookieString.substring(start));
return unescape(cookieString.substring(start, end));

この関数はここで使用しますは文字列オブジェクトのいくつかのメソッドです。覚えていない場合は (忘れっぽいですか?)、すぐに確認してください。この関数内のすべての if ステートメントには else が含まれていません。これは、条件が true の場合、プログラムは return ステートメントを実行し、関数内で return が見つかった場合は操作が終了するため、else を追加しなくても問題ありません。この関数は Cookie を見つけると Cookie の値を返し、それ以外の場合は「null」を返します。
次に、設定したばかりの name=rose Cookie を削除します。

var 期限切れ = new Date();
expires.setTime(expires.getTime() - 1);
document.cookie = 'name=rose;expires=' 期限切れ.toGMTString() ;

有効期限を現在の日付より少し早く変更し (ここでは 1 ミリ秒早くなります)、同じ方法で Cookie を設定して Cookie を削除するだけであることがわかります。 。