JavaScriptのCookieの設定と削除について詳しく解説_javascriptスキル

Cookie を設定する

各 Cookie は、次の文字列を document.cookie に割り当てることができます。
複数の名前と値のペアを一度に保存したい場合は、セミコロンとスペース (;) を使用してそれらを区切ることができます。例:
document.cookie="userId=828; userName=hulk";

セミコロン (;)、カンマ (,)、等号 (=)、およびスペースは、Cookie の名前または値に使用できません。これを Cookie の名前で行うのは簡単ですが、保存される値は未定義です。これらの値を保存するにはどうすればよいでしょうか? その方法は、いくつかの特殊な記号の 16 進表現を使用できる、escape() 関数を使用することです。たとえば、スペースは「20%」としてエンコードされ、Cookie 値に保存されます。 , この解決策を使用すると、中国語の文字化けの発生も回避できます。例:
document.cookie="str="scape("I love ajax");

は次と同等です:
document.cookie="str=I love ajax"; >
escape() エンコードを使用する場合、値を取り出して元の Cookie 値を取得した後、unescape() を使用してデコードする必要があります。これは以前に紹介しました。

document.cookie はプロパティのように見えますが、異なる値を割り当てることができます。ただし、一般的な属性とは異なります。たとえば、次の 2 つのステートメントを連続して実行しても、元の値が失われるわけではありません。 cookie="userName=hulk";

現時点では、ブラウザーは userId と userName という 2 つの Cookie を保持するため、document.cookie に値を割り当てることは、次のようなステートメントを実行することに似ています。 document.addcookie("userId=828");

document.addcookie("userName=hulk");

実際、ブラウザはこのように Cookie を設定します。 Cookie の値のみを再割り当てする必要があります。例:
document.cookie="userId=929";

これにより、userId という名前の Cookie 値が 929 に設定されます。


Cookie の値を取得する


Cookie の値を取得する方法を説明します。 Cookie の値は document.cookie から直接取得できます:
var strcookie=document.cookie;

これは、セミコロンで区切られた複数の名前と値のペアで構成される文字列を取得します。値ペアには、このドメイン名の下にあるすべての Cookie が含まれます。例:

次のようなメソッドを使用します。 1 つ以上の Cookie の値を取得できますが、その主なスキルは依然として文字列と配列の関連操作です。


Cookie の有効期限を設定する


これまでのところ、すべての Cookie はシングルセッション Cookie です。つまり、これらの Cookie はブラウザを閉じると失われます。実際、これらの Cookie は、対応するハードディスク ファイルを作成せずにメモリに保存されるだけです。

実際の開発では、ユーザーのログイン状態の保存など、Cookieを長期間保存する必要があることがよくあります。これは、次のオプションを使用して実現できます:

document.cookie="userId=828;expires=GMT_String";

GMT_String は GMT 形式の時刻文字列であり、このステートメントはuserId Cookie を GMT_String で表される有効期限に設定します。この時間が経過すると、Cookie は消えてアクセスできなくなります。例: Cookie の有効期限が 10 日後に切れるように設定したい場合は、次のように設定できます:




コードをコピー


コードは次のとおりです: