JavaScriptのBOMクッキーの使用

JavaScriptのクッキー

クッキーは、お使いのコンピュータに保存されている小さなデータテキストファイルです。Webサーバがブラウザにページを送信すると、接続が閉じられると、サーバは、すべてのコンテンツのユーザーを忘れてしまいます。クッキー本発明は、「利用者情報を記憶する方法」の問題を解決することである：
ユーザーがページにアクセスすると、彼/彼女の名前はクッキーに保存することができます。
ユーザーがページを訪問次回は、クッキーは、彼/彼女の名前を「記憶」しています。
クッキーは、次のようなキーの形で保存されます。

username = John Doe

ブラウザがサーバーからページを要求すると、ページに属するクッキーが要求に追加されます。このように、サーバは、ユーザーに関する情報を「記憶」し、必要なデータを取得します。
お使いのブラウザがCookieのローカルサポート閉じている場合は、次の例は無効です。

クッキーを作成するにはJavaScriptを使用します

JavaScriptのdocument.cookieプロパティは、作成、読み取り、およびクッキーを削除するために使用することができます。JavaScriptを使用すると、あなたは、このようなクッキーを作成することができます。

document.cookie = "username=John Doe";

あなたはまた、（時間のUTC単位で）有効期限を追加することができます。ブラウザを閉じたときに、デフォルトで、クッキーを削除します。

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";

pathパラメータを使用して、あなたはパスクッキーが所属ブラウザを伝えることができます。デフォルトでは、クッキーは、現在のページに属しています。

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";

JavaScriptを使用してクッキーを読みます

JavaScriptを使用すると、クッキーは次のように読むことができます。

var x = document.cookie;

全てdocument.cookieのような、クッキー文字列を返す：cookie1 =値; cookie2 =値; cookie3 =値。

JavaScriptを使用してクッキーを変更

JavaScriptを使用すると、あなたはクッキークッキーと同じ変更を作成することができます。

document.cookie = "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";

古いクッキーが上書きされます。

JavaScriptを使用してクッキーを削除します。

クッキーを削除することは非常に簡単です。あなたはクッキーを削除すると、Cookieの値を指定する必要はありません。単純にパラメータ設定された配達日を満了します：

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";

あなたは正しいクッキーを確保するために、カスタムのクッキーのパスを削除する必要があります。パスを指定しない場合、一部のブラウザでは、クッキーを削除することはできません。

クッキー文字列

document.cookieプロパティは、一般的なテキスト文字列のように見えます。しかし、それはそうではありません。値のペア-あなたは完全なクッキー文字列のdocument.cookieを書き込みます場合でも、あなたは再びそれを読んだとき、あなただけの、その名前を見ることができます。あなたが新しいクッキーを設定した場合、それは古いクッキーを上書きしません。新しいクッキーはdocument.cookieに追加されますので、あなたは再びdocument.cookieを読めば、あなたのような何か買ってあげる：cookie1 =値; cookie2 =値 ;
あなたが特定のCookieの値を検索したい場合は、JavaScript関数を記述する必要がありますがクッキークッキー値の検索文字列。

JavaScriptのクッキーの例

次の例では、保存された訪問者の名前のクッキーを作成します。訪問者は初めてのランディングページは、彼/彼女の名前を埋めるために/彼女を彼に聞いてきます。名前はクッキーに保存されています。訪問者が同じページに到着する次の時間は、彼/彼女はウェルカムメッセージを受信します。この例では、3つのJavaScript関数を作成します。

クッキー機能設定値
クッキー機能の値を取得します。
Cookieの値のための機能をチェック
Cookieの設定機能

まず、我々は関数名を作成するには、訪問者のクッキー変数に格納されます。

function setCookie(cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + (exdays*24*60*60*1000));
  var expires = "expires="+ d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}

例説明：
クッキーは（exdays）の有効期限が切れる前に、関数のパラメータは、クッキー（CNAME）の名称、クッキー（cValue）の値との日数です。この関数はのCookieName、クッキーの値と連結の有効期限が切れた文字列でクッキーを設定します。
Cookieの取得機能は、
次に我々は、指定されたCookieの関数の戻り値を作成します。

function getCookie(cname) {
  var name = cname + "=";
  var decodedCookie = decodeURIComponent(document.cookie);
  var ca = decodedCookie.split(';');
  for(var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}

機能：
パラメータ（CNAME）としてのCookieName。変数（名）を作成する（「=」+ CNAME）検索対象のテキストを使用します。（「;」CA = decodingCookie.split（このような配列の名前カリフォルニア州スプリットdocument.cookieセミコロンで「$」などの特殊文字、とデコードクッキー文字列のCookie処理））。CAは、（; iはca.lengthを<I = 0アレイを通して循環、iは++;） [i]）とCA =各値cを読み出します。クッキー（c.indexOf（名）== 0がいる場合）発見された、クッキー（c.substring（name.length、c.length））の値が返されます。あなたはクッキーを見つけることができない場合は、返します「」
クッキーチェック機能は
最後に、私たちはクッキーかどうかを確認する関数を作成します。あなたはクッキーを設定した場合、それが挨拶を表示します。クッキーが設定されていない場合は、プロンプトボックスが表示され、365日、ユーザー名のCookieストア関数ますsetcookieを呼び出すことにより、ユーザーの名前を尋ねる表示されます。

function checkCookie() {
  var username = getCookie("username");
  if (username != "") {
   alert("Welcome again " + username);
  } else {
    username = prompt("Please enter your name:", "");
    if (username != "" && username != null) {
      setCookie("username", username, 365);
    }
  }
}

すべてのコードが一緒に実装されています

function setCookie(cname, cvalue, exdays) {
  var d = new Date();
  d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
  var expires = "expires="+d.toUTCString();
  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function getCookie(cname) {
  var name = cname + "=";
  var ca = document.cookie.split(';');
  for(var i = 0; i < ca.length; i++) {
    var c = ca[i];
    while (c.charAt(0) == ' ') {
      c = c.substring(1);
    }
    if (c.indexOf(name) == 0) {
      return c.substring(name.length, c.length);
    }
  }
  return "";
}
function checkCookie() {
  var user = getCookie("username");
  if (user != "") {
    alert("Welcome again " + user);
  } else {
    user = prompt("Please enter your name:", "");
    if (user != "" && user != null) {
      setCookie("username", user, 365);
    }
  }
}

上記の例checkCookie（）関数は、ページのロード時に実行されます。
詳細は、技術的な記事をクッキー