CookiesあなたがWebページでユーザー情報を保存しましょう。
どのようなものがありますCookies ？
Cookiesお使いのコンピュータ上で、小さなテキストファイルに格納されたデータです。
WebサーバがブラウザにWebページを送信した場合に、接続が遮断され、サーバはユーザについてのすべてを忘れています。
Cookies 「ユーザに関する情報を記憶する方法」の問題を解決するために考案されました：
- ユーザーがWebページにアクセスすると、彼の名前はに保存することができcookie 。
- ユーザーがページを訪問する次の時間は、 cookie彼の名前を「記憶」しています。
クッキーは、同様の名前と値のペアで保存されます。
username = John Doe
サーバからブラウザ要求Webページは、ときにcookiesページに属するが要求に追加されます。 この方法は、サーバーは、ユーザーに関する情報を「記憶」するために必要なデータを取得します。
作成a Cookie JavaScriptを使用し
JavaScriptは、作成、読み取り、および削除することができますcookiesしてdocument.cookieプロパティ。
JavaScriptで、 a cookie次のように作成することができます。
document.cookie = "username=John Doe";また、（UTC時間で）有効期限を追加することができます。 デフォルトでは、 the cookieブラウザを閉じたときに削除されます。
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";pathパラメータを使用すると、どのようなパスブラウザ伝えることができますthe cookie所属します。 デフォルトでは、 the cookie現在のページに属しています。
document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";読むa Cookie JavaScriptを使用し
JavaScriptで、 cookiesこのように読むことができます：
var x = document.cookie;document.cookieすべて返されますcookiesはるかのような1つの文字列に： cookie1=value; cookie2=value; cookie3=value; cookie1=value; cookie2=value; cookie3=value;
変更a Cookie JavaScriptを使用し
JavaScriptを使用すると、変更することができますa cookieあなたがそれを作ると同じように：
document.cookie = "username=John Smith; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
古いcookie上書きされます。
削除a Cookie JavaScriptを使用し
削除a cookie非常に簡単です。 ただ、渡された日付にパラメータを期限切れに設定します。
document.cookie = "username=; expires=Thu, 01
Jan 1970 00:00:00 UTC";
あなたは指定する必要はありませんので注意してくださいa cookie削除時に値をa cookie 。
Cookie文字列
document.cookieプロパティは、通常のテキスト文字列のように見えます。 しかし、そうではありません。
あなたは全体書く場合でもcookie文字列をdocument.cookieあなたは再びそれを読んだとき、あなたはそれだけの名前と値のペアを見ることができます。
あなたは新しい設定した場合はcookie 、古いcookies上書きされません。 新しいcookieするために添加されるdocument.cookieあなたが読めばので、 document.cookie再びあなたのような何かを得るでしょう。
cookie1 = value; cookie2 = value;
あなたが指定した1つの値を検索したい場合はcookie 、あなたは検索JavaScript関数記述する必要がありますcookieの値cookie文字列を。
JavaScriptのCookie例
フォローする例では、我々が作成されますa cookie訪問者の名前を格納します。
訪問者がWebページに到着した最初の時間は、彼が彼の名前を記入するように求められます。 名前は、その後に保存されa cookie 。
ビジターが同じページに到着する次回は、彼は歓迎メッセージが表示されます。
例えば、我々は3 JavaScript関数を作成します。
- 設定する機能cookie値を
- 取得するための関数cookie値を
- チェックする機能cookie値を
設定する機能a Cookie
まず、中に訪問者の名前を格納する機能作成しa 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;
}
例を説明しました：
関数のパラメータは、上記の名前であるcookie (cname)の値the cookie (cvalue)およびCookieが（exdays）を期限切れにする必要がありますまでの日数。
関数が設定しa cookie一緒に追加することでcookiename 、 the cookie値を、文字列を満了します。
取得する機能a Cookie
その後、我々は指定の値を返す関数を作成cookie ：
例
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 "";
}
この関数は説明しました：
テイクthe cookienameパラメータ（CNAME）などを。
（CNAME + "="）を検索するには、テキストと変数（名）を作成します。
スプリットdocument.cookieと呼ばれる配列にセミコロン上のca (ca = document.cookie.split(';'))
CAのループスルーarray (i=0;i<ca.length;i++)および各値の読み出しc=ca[i]) 。
場合はthe cookie発見された(c.indexOf(name) == 0)の値を返すthe cookie (c.substring(name.length,c.length)
場合はthe cookie見つからない、 ""を返します。
チェックする機能a Cookie
最後に、我々は関数の作成checksている場合a cookie設定されているが。
場合はthe cookie設定されている、それは挨拶が表示されます。
場合はthe cookie設定されていない、それはユーザーの名前を尋ね、プロンプトボックスが表示され、ユーザー名の格納cookie呼び出すことにより、365日間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;
}
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()関数ページのロード時に。