JavaScript での document.cookie の使用

ドキュメント オブジェクトに cookie 属性があることはすでにわかっています。しかし、クッキーとは何でしょうか？ 「一部の Web サイトでは、ハード ドライブに Cookie と呼ばれる小さなテキスト ファイルに情報が保存されます。」 - MSIE ヘルプ。一般に、Cookie は HTML よりも高度な CGI または同様のファイル、プログラムなどによって作成されますが、JavaScript も Cookie に対する非常に包括的なアクセス権を提供します。

まず、Cookie の基本的な知識を学ぶ必要があります。

すべての cookie は次のようになります: =

この制限は、「JavaScript キーワードは使用できない」などの点を除き、JavaScript の名前付け制限と似ています。 URLエンコードで使用できる文字」。後者は理解するのがさらに困難ですが、名前に文字と数字を使用するだけであれば問題ありません。 の要件も「URL エンコードで使用できる文字のみ」です。

各 Cookie には有効期限があり、コンピューターの時計が有効期限を過ぎると、Cookie は削除されます。 Cookie を直接削除することはできませんが、有効期限を現在時刻よりも早く設定することで間接的に削除できます。

各 Web ページまたは各サイトには独自の Cookie があり、この Cookie はこのサイトの Web ページからのみアクセスでき、同じサイト内の許可されていない領域にはアクセスできません。 Cookie の各「グループ」には合計サイズが指定されています (「グループ」ごとに約 2KB) 最大合計サイズを超えると、新しい Cookie が「定着」できるように、最も古い期限切れの Cookie が最初に削除されます。

次に、documents.cookie 属性の使用方法を学びましょう。

documents.cookie 属性を直接使用するか、変数に値を割り当てるなどの何らかの方法を使用して document.cookie の値を取得すると、現在のドキュメントに存在する Cookie の数とその名前を知ることができます。各 Cookie とその値。たとえば、「document.write(documents.cookie)」をドキュメントに追加すると、結果は次のようになります:

name=kevin; email=kevin@kevin.com; lastvisited=index.html

これは、ドキュメントに 3 が含まれていることを意味します。 Cookie: 名前、電子メール、lastvisited、それらの値はそれぞれ kevin、kevin@kevin.com、index.html です。ご覧のとおり、2 つの Cookie はセミコロンとスペースで区切られているため、 cookieString.split('; ') メソッドを使用して各 Cookie の配列を取得できます (最初に var cookieString = document.cookie を使用します)。

Cookie を設定する方法は、documents.cookie に値を割り当てることです。他の場合の割り当てとは異なり、documents.cookie に値を割り当てても、元の Cookie は削除されず、Cookie が追加されるか、元の Cookie が変更されるだけです。割り当ての形式:

文書.cookie = 'cookieName=' +エスケープ('cookievalue') + ';expires=' +expirationDateObj.toGMTString();

めまいを感じていますか? cookieName は Cookie の名前を表し、cookievalue は Cookie の値を表し、expirationDateObj は有効期限を指定する必要がない場合は、2 行目は必要ありません。有効期限が指定されていない場合、ブラウザはデフォルトでブラウザを閉じた後 (つまり、すべてのウィンドウを閉じた後) に有効期限が切れます。

まず、escape() メソッド: なぜこれを使用する必要があるのでしょうか? Cookie 値の要件が「URL エンコードで使用できる文字のみ使用できる」ためです。 「escape()」メソッドが URL エンコード方式に従って文字列をエンコードすることがわかっているため、「escape()」メソッドを使用して Cookie に出力された値を処理し、「unescape()」を使用するだけで済みます。 Cookie から出力された値を処理します。受信した値は確実です。これら 2 つのメソッドの最も一般的な用途は、Cookie を処理することです。実際、Cookie の設定は「documents.cookie = 'cookieName=cookievalue'」のように簡単ですが、URL に使用できない文字が cookievalue に含まれるのを避けるために、escape() を使用することをお勧めします。

次に、「expires」の前のセミコロン: 注意してください。それはセミコロンだけであり、それ以外は何もありません。

最後に、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時間
×1時間60分これは、rose が有効な URL エンコード文字列、つまり 'rose' ==scape('rose') であることがわかっているためです。一般に、Cookie を設定するときにscape() を使用しない場合は、Cookie を取得するときに unescape() を使用する必要はありません。

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

function getCookie(cookieName) {
var cookieString = document.cookie;
var start = cookieString.indexOf(cookieName + '=');
// 等号を追加する理由は、
// 同じことを避けるためです。 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 を削除する必要があります。

varexpires = new Date();
expires.setTime(expires.getTime() - 1);
documents.cookie = 'name=rose;expires=' +expires.toGMTString();

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

Cookieを操作するために外国人が書いたjs関数を添付します

///Cookieを設定します

function setCookie(NameOfCookie, value,expirdays)

{

//@Parameters: 3つの変数が使用されますset new Cookie:
//Cookie の名前、保存されている Cookie の値、
//、および Cookie の有効期限が切れる時刻
// これらの行は、日数を有効な日付に変換します

var ExpireDate = new Date。 ();

ExpireDate.setTime(ExpireDate.getTime() + (expiredays * 24 * 3600 * 1000));

// 次の行は、単に「document.cookie」に値を割り当てるために使用されます。 .
// 日付は toGMTstring() 関数を通じて GMT 時間に変換されることに注意してください。

document.cookie = NameOfCookie + "=" +escape(value) +

((expiredays == null) ? "" : ";expires=" + ExpireDate.toGMTString());

}

// /Cookieの値を取得
function getCookie(NameOfCookie)
{

// まずCookieが存在するか確認します
// 存在しない場合、document.cookieの長さは0です
if (document.cookie.length > ; 0)
{

// 次に、cookie 名が document.cookie に存在するかどうかを確認します
// 複数の cookie 値が格納されるため、たとえ document.cookie の長さが 0 でなくても、必要な名前の Cookie が存在します
//したがって、必要な Cookie があるかどうかを確認するためにこのステップが必要です
//begin の変数値が -1 の場合、それは存在しないことを意味します
begin = document .cookie.indexOf(NameOfCookie+"=");
if (begin != -1)
{
// Cookie の存在を示します
begin += NameOfCookie.length+1;// Cookie の初期位置。 value
end = document.cookie.indexOf(";", begin );//終了位置
if (end == -1) end = document.cookie.length;//No の場合、end は、 string
return unescape(document.cookie.substring(begin, end)); }
}

return null;

//Cookie が存在しないので null を返す
}


///Cookie を削除する
function delCookie (NameOfCookie)
{
//この関数は Cookie が設定されているかどうかを確認し、設定されている場合は有効期限を過去の時刻に調整します。
//残りはオペレーティング システムに任せて、Cookie をクリーンアップします。適切な時間



if (getCookie(NameOfCookie)) {www.2cto.com
document.cookie = NameOfCookie + "= " +
"; 期限切れ=木曜日、01-1月-70 00:00:01 GMT";
}
}