ホームページ >ウェブフロントエンド >jsチュートリアル >js_javascript スキルにおける Cookie の使用の詳細な分析

js_javascript スキルにおける Cookie の使用の詳細な分析

WBOY
WBOYオリジナル
2016-05-16 19:04:13871ブラウズ

Cookie の概要
前のセクションでは、不変のフレームワークを使用してショッピング列データを保存しましたが、商品表示ページは常に変化していましたが、これによりシミュレートされたグローバル変数を実現できました。 、しかし厳密ではありません。たとえば、ナビゲーション フレーム ページ内で右クリックし、ショートカット メニューの [更新] コマンドをクリックすると、JavaScript 変数はすべて失われます。したがって、厳密なクロスページ グローバル変数を実装するには、JavaScript の別のメカニズムである Cookie が真のグローバル変数の要件を満たすことができます。

Cookie はブラウザが提供するメカニズムで、ドキュメント オブジェクトの Cookie 属性を JavaScript に提供します。これは JavaScript によって制御できますが、JavaScript 自体のプロパティではありません。 Cookie はユーザーのハード ドライブに保存されているファイルで、通常、ブラウザがドメイン名に再度アクセスすると、Cookie が使用可能になります。したがって、Cookie は 1 つのドメイン名の下で複数の Web ページにまたがることができますが、複数のドメイン名にまたがって使用することはできません。

ブラウザーが異なれば Cookie の実装方法も異なりますが、それらのプロパティは同じです。たとえば、Windows 2000 および Windows XP では、cookie ファイルは、documents and settingsuserNamecookie フォルダに保存されます。通常の命名形式は userName@domain.txt です。

Cookie メカニズムはユーザーのハードドライブに情報を保存するため、グローバル変数として使用できます。これは最大の利点の 1 つです。以下のような場合に使用できます。

(1) ユーザーのログイン状態を保存します。たとえば、ユーザー ID は Cookie に保存されるため、ユーザーは次回そのページにアクセスするときに再度ログインする必要がなくなります。現在、多くのフォーラムやコミュニティがこの機能を提供しています。 Cookie には有効期限を設定することもでき、制限時間が経過すると、Cookie は自動的に消去されます。したがって、システムはユーザーにログイン状態を維持するよう求めることがよくあります。一般的なオプションは 1 か月、3 か月、1 年などです。

(2) ユーザーの行動を追跡します。たとえば、天気予報 Web サイトでは、ユーザーが選択した地域に基づいて地域の気象状況を表示できます。毎回場所を選択するのは面倒ですが、Cookie を使用すると、次回ページを開くときに前回訪問した場所を記憶し、自動的に表示されます。最後のユーザーの地域の気象状況。すべてがバックグラウンドで行われるため、このようなページはあたかも特定のユーザー向けにカスタマイズされているかのように見え、非常に使いやすくなります。

(3) カスタマイズされたページ。ウェブサイトがスキンの変更やレイアウトの変更機能を提供している場合、背景色や解像度などのユーザーのオプションを記録するために Cookie が使用されることがあります。ユーザーが次回訪問するときも、前回の訪問時のインターフェイス スタイルを保存できます。

(4) ショッピングカートを作成します。前の例と同様に、Cookie はユーザーが購入する必要がある商品を記録するために使用され、チェックアウト時に均一に送信できます。たとえば、淘宝網では Cookie を使用してユーザーが閲覧した商品を記録し、いつでも比較できるようにしています。

もちろん、上記のアプリケーションは Cookie が完了できるアプリケーションの一部にすぎず、グローバル変数を必要とする関数はさらにあります。 Cookie の欠点は主にセキュリティとプライバシー保護にあります。主に以下の種類があります:

(1) Cookie が無効になっている場合があります。ユーザーが個人のプライバシー保護に細心の注意を払う場合、ブラウザの Cookie 機能を無効にする可能性があります。
(2) Cookie はブラウザに関連しています。つまり、同じページにアクセスしても、異なるブラウザで保存された Cookie には相互にアクセスできません。
(3) Cookie は削除される場合があります。各 Cookie はハードディスク上のファイルであるため、ユーザーによって削除される可能性があります。
(4) Cookie のセキュリティは十分に高くありません。すべての Cookie は平文形式でファイルに記録されるため、ユーザー名やパスワードなどの情報を保存したい場合は、事前に暗号化することをお勧めします。

Cookie を設定する
各 Cookie は名前と値のペアです。次の文字列を document.cookie に割り当てることができます:

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

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

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

document.cookie ="str= "エスケープ("I love ajax");



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

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

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


コードをコピー

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

document.addCookie("userId=828"); document.addCookie( "userName=hulk"); 実際、Cookie の値を変更したい場合は、次のように再割り当てするだけです。 >document.cookie="userId =929"; これにより、userId という名前の Cookie 値が 929 に設定されます。
Cookie の値を取得する
Cookie の値を取得する方法を説明します。 Cookie の値は document.cookie から直接取得できます:

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




コードをコピー


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


出力から分かるように、クッキー名を指定して指定した値を取得するのは、クッキー値を扱う上で最も面倒な部分です。ユーザーはこの文字列を自分で分析して、指定された Cookie 値を取得する必要があります。たとえば、userId の値を取得するには、次のように実行します。




コード


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




このようにして、単一の Cookie の値を取得します。

同様のメソッドを使用して、1 つ以上の Cookie の値を取得できます。主な手法はやはり文字列と配列の関連操作です。


Cookie の有効期限を設定します

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

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

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




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



声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
前の記事:js 単純なクラス code_js オブジェクト指向次の記事:js 単純なクラス code_js オブジェクト指向

関連記事

続きを見る