JavaScript の Cookie とは何ですか?また Cookie の読み方は何ですか?

Cookie とは

HTTP はステートレス プロトコルであるため、サーバーはネットワーク接続だけからクライアントの ID を知る方法がありません。どうやってするの？顧客にパスを発行するだけです。誰が訪問しても、自分のパスを持参する必要があります。このようにして、サーバーはパスからクライアントの ID を確認できます。これがクッキーの仕組みです。

Cookie は実際には短いテキスト情報です。クライアントはサーバーに要求し、サーバーがユーザーのステータスを記録する必要がある場合、応答を使用してクライアントのブラウザーに Cookie を発行します。クライアントのブラウザは Cookie を保存します。ブラウザが Web サイトを再度リクエストすると、ブラウザはリクエストされた URL を Cookie とともにサーバーに送信します。サーバーはこの Cookie をチェックしてユーザーのステータスを識別します。サーバーは必要に応じて Cookie の内容を変更することもできます。

Cookieの仕組み

プログラムでは、セッション追跡は非常に重要です。理論的には、あるユーザーのすべてのリクエスト操作は同じセッションに属し、別のユーザーのすべてのリクエスト操作は別のセッションに属する必要があり、この 2 つを混同することはできません。たとえば、ユーザー A がスーパーマーケットで購入した商品は、ユーザー A がいつ購入したとしても、同じセッションに属しており、ユーザー B やユーザー C のショッピング カートに入れることはできません。同じセッションに属していません。

Web アプリケーションは HTTP プロトコルを使用してデータを送信します。 HTTP プロトコルはステートレス プロトコルです。データ交換が完了すると、クライアントとサーバー間の接続が切断され、再度データを交換するには新しい接続を確立する必要があります。これは、サーバーが接続からセッションを追跡できないことを意味します。つまり、ユーザー A がアイテムを購入し、それをショッピング カートに入れます。そのアイテムが再度購入されると、サーバーはその購入がユーザー A のセッションに属するかユーザー B のセッションに属するかを判断できません。このセッションを追跡するには、メカニズムを導入する必要があります。

Cookieはそのような仕組みです。これにより、HTTP プロトコルのステートレスな欠点を補うことができます。 Session が登場する前は、基本的にすべての Web サイトはセッションを追跡するために Cookie を使用していました。

JS 設定 Cookie:

ページ A で変数ユーザー名 (「jack」) の値を Cookie に保存し、キー値が name であると仮定すると、対応する JS コードは次のようになります:

 document.cookie="name="+username;

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

document.cookie="str="+escape("I love ajax"); 
// document.cookie="str=I%20love%20ajax";

escape()エンコードを使用する場合、値を取り出した後にunescape()を使用してデコードする必要があります。

JSのCookieの読み取り:

Cookie は次のとおりです: name=jack;password=123

ページ B の変数 username の値を取得するための JS コードは次のとおりです:

var username=document.cookie.split(";")[0].split("=")[1];
//JS操作cookies方法!
//写cookies
function setCookie(name,value)
{
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}

Read cookies

function getCookie(name)
{
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}
删除cookies
function delCookie(name)
{
var exp = new Date();
exp.setTime(exp.getTime() - 1);
var cval=getCookie(name);
if(cval!=null)
document.cookie= name + "="+cval+";expires="+exp.toGMTString();
}
//使用示例
setCookie("name","hayden");
alert(getCookie("name"));
//如果需要设定自定义过期时间
//那么把上面的setCookie　函数换成下面两个函数就ok;
//程序代码
function setCookie(name,value,time)
{
var strsec = getsec(time);
var exp = new Date();
exp.setTime(exp.getTime() + strsec*1);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getsec(str)
{
alert(str);
var str1=str.substring(1,str.length)*1;
var str2=str.substring(0,1);
if (str2=="s")
{
return str1*1000;
}
else if (str2=="h")
{
return str1*60*60*1000;
}
else if (str2=="d")
{
return str1*24*60*60*1000;
}
}
//这是有设定过期时间的使用示例：
//s20是代表20秒
//h是指小时，如12小时则是：h12
//d是天数，30天则：d30
setCookie("name","hayden","s20");

以上がJavaScript の Cookie とは何ですか?また Cookie の読み方は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。