cookie ها در جاوا اسکریپت

ناصر نادری | 1398/01/18


بنام خدا .

مبحث cookie یک مبحث مهم و پایه ای در برنامه نویسی وب هست . کوکی ها ابزاری برای به خاطر سپردن مقادیر توسط مرورگر هستن. پروتکل HTTP  یک پروتکل غیر متصل یا stateless هست یعنی هربار درخواست یک url داده میشه بعد از انجام درخواست توسط سرور وب و ارسال اون به کلاینت ارتباط تا درخواست دیگه قطع میشه. خوب حالا فرض کنید شما میخوایید توی چند مرحله و صفحات مختلف اطلاعاتی رو بصورت فرم از کاربر دریافت کنید . وقتی یک صفحه پر میشه و میخوایید برید صفحه بعد اطلاعات فرم این صفحه باید یه جایی نگه داری بشه تا توی مراجعات بعدی با سرور این اطلاعات مبادله بشه . راه حل اینکار ذخیره رکورد هایی از اطلاعات در سمت کلاینت هست که بهش cookie میگن . 

ارسال و دریافت اطلاعات کوکی به سرور وظیف برنامه نویسی سمت سرور هست و جاوا اسکریپت به عنوان زبان سمت کلاینت فقط وظیف ایجاد , ویرایش و حذف اونهارو بر عهده داره .  یک رکورد کوکی میتونه شامل فیلدهای زیر بصورت جفت key , value باشه :

Expires : تاریخ یا مدت زمان حیات یک کوکی رو تعیین میکنه . اگر بصورت دستی تعیین نشه زمان انقضا کوکی همون زمان خروج کاربر از مرورگر خواهد بود .

Domain : نام وب سایت شماست .

Path : مسیری که کوکی در آن تنظیم میشود . اگر دستی تنظیم نشه از تمامی مسیر ها میشه بهش دسترسی داشت.

Secure : اگر این فیلد تنظیم بشه کوکی فقط میتونه از طریق سرور امن قابل دسترسی باشه . درغیر اینصورت این محدودیت وجود نداره .پ

 Name=value : نام و مقدار کوکی رو در اینجا وارد میکنیم .

ایجاد کوکی :

document.cookie = "key1=value1;key2=value2;expires=date";

برای اینکه مقدار کوکی نمیتونه حاوی سیمیکولون و کاما و فاصله خالی باشه میتونیم از تابع escape  برای encode کردن مقدار یک کوکی استفاده کنیم و هنگام بازیابی از تابع unescape برای decode کردنش استفاده کنیم .

<html>
<head>
<script type="text/javascript">
<!--
function createCookie()
{
    //بررسی خالی نبودن فیلد متنی فرم ما
    if( document.form1.myname.value == "" ){
        alert("لطفا نام خودرا وارد کنید!");
        return;
    }
    //کد کرد مقدار کوکی برای جلوگیری از ورود کاراکتر های ممنوع
    cookievalue= escape(document.form1.myname.value) + ";";
    //ایجاد کوکی و مقدار دهی آن
    document.cookie="name=" + cookievalue;
    //پیغام برای نشان دان ایجاد کوکی
    alert("مقدرا دهی کوکی : " + "name=" + cookievalue );
}
//-->
</script>
</head>
<body>
<form name="form1" action="">
Enter name: <input type="text" name="myname"/>
<input type="button" value="ایجاد کوکی" onclick="createCookie();"/>
</form>
</body>
</html> 

توی این فرم با ورود نام شخص و کلیک بر روی دکمه ایجاد کوکی ایجاد میشه .

میتونستیم چند تا کوکی دیگه بصورت جفت مقدار و کلید با جداسازی به وسیله علامت سیمیکولون داشته باشیم  .

خواندن کوکی یه مقدار کار داره . وقتی مقدار document.cookie رو میگیریم در واقع رشته ای حاوی جفت کلید و مقدار ها و سایر اطلاعات کوکی داریم درصورتی که میخواییم فقط کوکی مورد نظر خودمون رو از بین این رشته دربیاریم باید اون رو بصورت یک آرایه رشته ای بشکنیم و درایه مورد نظرمون رو بخونیم . شکستن یک رشته و تبدیل اون به ارایه ای از رشته ها توسط تابع split انجام میشه . به برنامه زیر دقت لازم را مبذول دارید !!!!.

<html>
<head>
<script type="text/javascript">
<!--
function ReadCookie()
{
    var allcookies = document.cookie;
    alert("همه کوکی ها : " + allcookies );

    //گرفتن تمام کوکی ها و شکستن اون بر اساس سیمیکولون
    cookiearray = allcookies.split(';');

    // بیرون کشیدن جفت مقدار و کلید مورد نظر از آرایهای که ایجاد کردیم
    for(var i=0; i<cookiearray.length; i++){
        name = cookiearray[i].split('=')[0];
        value = cookiearray[i].split('=')[1];
        alert("کلید : " + name + " و مقدار : " + value);
    }
}
//-->
</script>
</head>
<body>
<form name="form1" action="">
<input type="button" value="گرفتن کوکی" onclick="ReadCookie()"/>
</form>
</body>
</html> 

تنظیم تاریخ انقضا برای کوکی : برای تنظیم تاریخ انقضا بطول یک ماه,  میتونیم بصورت زیر عمل کنیم :

function createCookie()
{
    var now = new Date();
    now.setMonth( now.getMonth() + 1 );
    cookievalue = escape(document.form1.myname.value) + ";"
    document.cookie="name=" + cookievalue;
    document.cookie = "expires=" + now.toUTCString() + ";"
    alert("ایجاد کوکی : " + "name=" + cookievalue );
} 

برای پاک کردن کوکی نیز به صورت زیر عمل میکنیم :

document.cookie = "name=; expires=Thu, 01 Jan 1970 00:00:00 UTC"; 

تا یک جلسه دیگر در پناه عالم مطلق .


فایلهای ضمیمه
توجه! هیچ فایل ضمیمه ای برای این مطلب یافت نشد

نظرات شما نظر جدید