ورود به کارتابل مشتریان وب مهراز
کوکی ها در JavaScript
یادگیری JavaScriptکوکی ها اجازه می دهد اطلاعات کاربر را در صفحات وب ذخیره کنید.
کوکی ها چه هستند؟
کوکی ها داده ها هستند، در فایل های متنی کوچک ذخیره شده در کامپیوتر شما.
هنگامی که یک وب سرور یک صفحه وب را به یک مرورگر ارسال می کند، اتصال قطع می شود و سرور همه چیز را در مورد کاربر فراموش می کند.
کوکی ها برای حل مشکل "چگونه اطلاعات در مورد کاربر را به یاد داشته باشید " اختراع شد:
- هنگامی که کاربر یک صفحه وب را بازدید می کند، نام خود را می توان در کوکی ذخیره کرد.
- دفعه بعد که کاربر از صفحه بازدید می کند، کوکی "نام" را به یاد می آورد.
کوکی ها در مقدار نام مانند:
هنگامی که یک مرورگر درخواستی را یک صفحه وب از یک سرور میکند، کوکی ها متعلق به صفحه به درخواست اضافه می شود. به این ترتیب سرور اطلاعات لازم را برای "یادآوری" اطلاعات مربوط به کاربران را می گیرد.
نکته: اگر مرورگر شما کوکی های محلی را خاموش نگه دارد هیچکدام از مثال های زیر کار نمی کنند
یک کوکی با جاوا اسکریپت ایجاد کنید
جاوا اسکریپت می تواند کوکی ها را با خواص document.cookie ایجاد، خواندن و حذف کند.
با جاوا اسکریپت، کوکی می تواند مانند این ایجاد شود:
شما همچنین می توانید یک تاریخ انقضا (در زمان UTC) اضافه کنید. به طور پیشفرض، کوکی هنگامی که مرورگر بسته است حذف می شود:
با پارامتر مسیر، شما می توانید به مرورگر بگویید چه مسیر کوکی متعلق به آن است. به طور پیش فرض، کوکی متعلق به صفحه فعلی است.
یک کوکی را با جاوا اسکریپت بخوانید
با جاوا اسکریپت، کوکی ها را می توان به صورت زیر خواند:
document.cookie تمام کوکی ها را در یک رشته بسیار شبیه به: cookie1 = value؛ cookie2 = value؛ cookie3 = value؛ ذخیره می کند
یک کوکی را با جاوا اسکریپت تغییر دهید
با جاوا اسکریپت، شما می توانید کوکی را همانطور که شما آن را ایجاد می کنید تغییر دهید:
کوکی قدیمی رونویسی شده است.
کوکی را با جاوا اسکریپت حذف کنید
حذف کوکی بسیار ساده است.
شما وقتی کوکی را حذف می کنید لازم نیست مقدار کوکی را مشخص کنید.
فقط تنظیم پارامتر را به یک تاریخ منتهی می شود.
شما باید مسیر کوکی را تعریف کنید تا اطمینان حاصل شود کوکی مناسب شما را حذف کنید.
برخی از مرورگرها به شما اجازه نمی دهند کوکی را حذف کنید اگر مسیر را مشخص نکنید.
رشته کوکی
ویژگی document.cookie به نظر می رسد یک رشته متنی طبیعی است. اما اینطور نیست
حتی اگر شما یک رشته کوکی کامل را برای document.cookie بنویسید، زمانی که آن را دوباره خواندید، فقط می توانید نام و مقدار آن را ببینید.
اگر کوکی جدیدی را تنظیم کنید، کوکی های قدیمی تر رونویسی نمی شوند. کوکی جدید به document.cookie اضافه شده است، بنابراین اگر شما دوباره document.cookie را بخوانید، چیزی شبیه به آن پیدا خواهید کرد:
cookie1 = value; cookie2 = value;
اگر می خواهید مقدار یک کوکی مشخص را پیدا کنید، باید یک تابع جاوا اسکریپت بنویسید که مقدار کوکی را در رشته کوکی جستجو کند.
مثال جاوا اسکریپت
در مثال زیر، ما یک کوکی ایجاد می کنیم که نام بازدید کننده را ذخیره می کند.
اولین بار که یک بازدیدکننده وارد صفحه وب می شود، از او خواسته می شود نام خود را پر کند. نام سپس در کوکی ذخیره می شود.
دفعه بعد که بازدید کننده به همان صفحه می رسد، پیام خوش آمد گویی را دریافت می کند.
برای مثال ما 3 توابع جاوا اسکریپتی ایجاد خواهیم کرد:
- یک تابع برای تنظیم مقدار کوکی
- یک تابع برای دریافت مقدار کوکی
- یک تابع برای بررسی مقدار کوکی
یک تابع برای تنظیم کوکی
اول، ما یک تابع ایجاد می کنیم که نام بازدید کننده را در متغیر کوکی ذخیره می کند:
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
تشریح مثال:
پارامترهای تابع بالا نام کوکی (cname)، مقدار کوکی (cvalue) و تعداد روزها تا زمانی که کوکی باید منقضی شود (exdays).
عملکردهای کوکی را با اضافه کردن مقدار cookie، مقدار کوکی و پایان رشته را تنظیم می کند.
یک عملکرد برای دریافت کوکی
سپس، یک تابع ایجاد می کنیم که مقدار یک کوکی مشخص را نشان می دهد:
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
تشریح مثال:
نام کوکی را به عنوان پارامتر (cname) بیاورید.
ایجاد یک متغیر (نام) با متن برای جستجو (cname + "=").
رشته کوکی را Decode کنید تا کوکی ها را با کاراکترهای خاص اداره کنید، برای مثال '$'
تقسیم document.cookie در semicolons به آرایه به نام ca (ca = decodedCookie.split ('؛')).
حلقه را از طریق آرایه ca (i = 0؛ i <ca.length؛ i ++) و هر مقدار c = ca [i] را بخوانید.
اگر کوکی یافت می شود (c.indexOf (name) == 0)، مقدار کوکی (c.substring (name.length، c.length) را نشان می دهد.
اگر کوکی پیدا نشود، "" را برگردانید.
یک تابع برای بررسی یک کوکی
آخر، ما تابع ایجاد می کنیم که کوکی را تعیین می کند.
اگر کوکی تنظیم شود، یک تبریک نمایش داده خواهد شد.
اگر کوکی تنظیم نشده باشد، یک کادر فوری نمایش داده می شود، درخواست نام کاربری را می دهد و کوکی نام کاربری را برای 365 روز ذخیره می کند، با تماس با عملکرد setCookie
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 () هنگام بارگذاری صفحه اجرا می شود.
نظرات