
کوکی های مرورگر یا کوکی های HTTP فایل های متنی هستند که از بیت های کوچک داده تشکیل شده اند. وبسایتها از این اطلاعات برای ردیابی سفر کاربر استفاده میکنند و به آنها اجازه میدهد ویژگیهای شخصیسازی شده را ارائه دهند و تجربه مرور خود را بهبود بخشند. کوکی ها می توانند تا 4096 بایت داده ذخیره کنند. با این حال، بسته به مرورگر ممکن است تعداد محدودی کوکی در هر دامنه اضافه کنیم.
درک اولیه کوکیهای HTTP برای هر کاربر اینترنتی ضروری است، خواه صرفاً برای سرگرمی در حال گشتوگذار باشید یا برای امرار معاش. این راهنما خواهد بود شما را به طور مفصل با کوکی ها و انواع مختلف آنها آشنا می کند. هدف ما کمک به درک کوکیهای جاوا اسکریپت و کار با آن است.
بیا شروع کنیم!
پیش نیازها
برای دنبال کردن این آموزش باید داشته باشید:
شروع کار با کوکی های جاوا اسکریپت
کار با کوکی های جاوا اسکریپت آسان است. این به شما امکان می دهد بدون زحمت کوکی ها را ایجاد، ویرایش و بازیابی کنید. بهعلاوه، میتوانیم از ویژگی کوکی شی Document برای دستکاری و محدود کردن ویژگیهای کوکی مانند نام، مقدار و طول استفاده کنیم.
انواع کوکی ها
ابتدا بیایید انواع مختلف کوکی ها را بررسی کنیم:
کوکی ها از طرف اول
این کوکی ها هر بار که کاربر از یک وب سایت بازدید می کند ایجاد و ذخیره می شود. این به صاحبان وب سایت اجازه می دهد تا بینش دقیقی از داده های کاربر به دست آورند و تجربه مرور بهتری را برای آنها فراهم کنند.
کوکی های ماندگار
برای این نوع کوکی، ناشر تاریخ انقضا را تعیین می کند. از این رو برای مدت زمان بسیار طولانی تری استفاده می شود. این بدان معنی است که حتی اگر مرورگر خود را ببندید، کوکی در آن باقی می ماند. علاوه بر این، با هر بار بازدید از وبسایتی که کوکی را ایجاد کرده است، دادهها به ناشر بازگردانده میشود.
کوکی های جلسه
این کوکی ها فقط موقتی هستند و تا زمانی که مرورگر باز است در حافظه مرورگر شما ذخیره می شوند. وقتی آن را می بندید، کوکی از تاریخچه مرورگر شما حذف می شود و خطر امنیتی کمتری برای آن ها ایجاد می کند. نیازی نیست تاریخ انقضا را مشخص کنید.
کوکی های شخص ثالث
کوکی های شخص ثالث توسط سایتی ایجاد می شوند که در حال حاضر از آن بازدید نمی کنید. به طور خاص، این کوکی ها برای ردیابی کاربری که روی تبلیغی کلیک کرده است که آنها را به دامنه ای که آنها را ارجاع داده پیوند می دهد، مفید هستند.
ایجاد کوکی ها
ما می توانیم با استفاده از دو روش کوکی ایجاد کنیم:
ارسال
کیت–کوکی که در
HTTP هدر پاسخ بسته به فناوری های مورد استفاده برای وب سرور، می توانید هدرهای کوکی را با استفاده از ابزارها و کتابخانه ها مدیریت کنید. کوکی ها ممکن است حاوی اطلاعاتی مانند تاریخ انقضا و ویژگی های امنیتی مانند دستورالعمل امن و پرچم HttpOnly باشند.
با استفاده از جاوا اسکریپت
سند.کوکی ویژگی، ما می توانیم کوکی ها را بسازیم، بخوانیم و حذف کنیم.
مرحله 1 – یک کوکی ایجاد کنید
در مرحله بعد، روند ایجاد کوکی جاوا اسکریپت را نشان خواهیم داد. کوکی ها در قالب یک جفت نام-مقدار ذخیره می شوند:
document.cookie = “نام کاربری = CloudSigma”;
سند.کوکی = “نام کاربری = CloudSigma”; |
در کوکی بالا،
نام کاربری نام کوکی while است
CloudSigma مقدار ذخیره شده در آن است.
کوکی تاریخ انقضا دارد. به طور پیش فرض، زمانی که مرورگر بسته می شود، به طور خودکار حذف می شود. همچنین می توانید تاریخ انقضا را به کوکی خود اضافه کنید:
document.cookie = “نام کاربری = CloudSigma”; expires=جمعه، 11 ژوئن 2022، 12:00:00 UTC”; document.cookie = “نام کاربری = CloudSigma”;
سند.کوکی = “نام کاربری = CloudSigma”; منقضی می شود=جمعه، 11 ژوئن 2022 12:00:00 UTC“؛ document.cookie = “نام کاربری = CloudSigma“; |
به طور پیش فرض، کوکی ها متعلق به صفحه فعلی هستند. با این حال، ما همچنین می توانیم کوکی را با استفاده از
مسیر پارامتر:
document.cookie = “نام کاربری = CloudSigma”; انقضا=جمعه 11 ژوئن 2022 ساعت 12:00:00 UTC; مسیر=/”;
سند.کوکی = “نام کاربری = CloudSigma”; منقضی می شود=جمعه، 11 ژوئن 2022 12:00:00 UTC; مسیر=/”; |
بسته به نیاز خود، می توانید از این دو استراتژی برای تعیین تاریخ انقضای کوکی استفاده کنید. تفاوت بین این دو است
منقضی می شود زمانی که کوکی حذف می شود تاریخ انقضا را تعیین می کند. برعکس، در
حداکثر–سن زمان حذف کوکی را بر حسب ثانیه تنظیم می کند. متاسفانه،
حداکثر–سن توسط همه مرورگرها پشتیبانی نمی شود.
نمونه ای از تنظیم یک کوکی با استفاده از
منقضی می شود و
حداکثر–سن:
منقضی می شود:
var d = new Date(); d.setTime(d.getTime() + 5*60*1000); // در میلی ثانیه document.cookie=”foo=bar;path=/;expires=”+d.toGMTString()+’;’;
var ه = جدید تاریخ(); ه.مدت زمان معینی(ه.دریافت تایم() + 5*60*1000); // در میلی ثانیه سند.کوکی = ‘foo=bar;path=/;expires=”+ه.toGMTString()+“;”; |
حداکثر–سن :
document.cookie=”foo=bar;path=/;max-age=”+5*60+’;’;
سند.کوکی = ‘foo=bar;path=/;max-age=”+5*60+“;”; |
مرحله 2 – خواندن یک کوکی
را
سند.کوکی ویژگی یک رشته را برمی گرداند. اگر دو یا چند کوکی وجود داشته باشد، از نقطه ویرگول (
;) و مکانی برای جدا کردن آنها.
ما استفاده می کنیم
جدایش، جدایی() روشی برای بازیابی یک کوکی جداگانه از لیست کوکی ها. این روش لیست را به جفت نام و ارزش تکی تقسیم می کند. پس از اتمام کار، می توانید کوکی مورد نظری را که می خواهید بخوانید جستجو کنید:
تابع setCookie(name, count, validityCheck) { var cookie = name + “=” + encodeURIcomponent(value); if(typeof validityCheck === “number”) { cookie += “; max-age=” + (validityCheck*24*60*60); document.cookie = کوکی; } } تابع getCookie(name) { var cookieArr = document.cookie.split(“;”); for(var i = 0; i < cookieArr.length; i++) { var cookiePair = cookieArr[i].split("="); if(name == کوکی جفت[0].trim()) { recodeURIcomponent(cookiePair[1]) } } return null; } تابع checkCookie() { var UserName = getCookie("UserName"); if(UserName != "") { alert("Welcome back, " + UserName); } else { firstName = prompt("نام کاربری خود را وارد کنید:"); if(UserName != "" && Username != null) { setCookie("UserName", UserName, 30); } }
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | عملکرد مجموعه کوکی(نام، شمردن، بررسی اعتبار) { var کوکی = نام + “=” + EncodeURIcomponent(ارزش); اگر(نوع بررسی اعتبار === “عدد”) { کوکی += “; حداکثر سن = “ + (بررسی اعتبار*24*60*60); سند.کوکی = کوکی; } } عملکرد دریافت کوکی(نام) { var cookieArr = سند.کوکی.جدایش، جدایی(“;”); برای(var من = 0; من < cookieArr.طول; من++) { var کوکی جفت = cookieArr[i].جدایش، جدایی(“=”); اگر(نام == کوکی جفت[0].من موهامو کوتاه میکنم()) { برگشت رمزگشاییURIcomponent(کوکی جفت[1]); } } برگشت صفر; } عملکرد چک کوکی() { var نام کاربری = دریافت کوکی(“نام کاربری”); اگر(نام کاربری != “”) { زنگ خطر. هشدار(“خوش برگشتی، “ + نام کاربری); } یک چیز دیگر { نام کوچک = سریع(“نام کاربری خود را وارد کنید:”); اگر(نام کاربری != “” && نام کاربری != null) { setCookie (“نام کاربری”، نام کاربری، 30)؛ } } } |
بیایید به توابعی که در کد ایجاد کردیم نگاهی بیندازیم:
نام تابع | شرح |
مجموعه کوکی() | یک کوکی ایجاد می کند |
دریافت کوکی() | مقدار کوکی را می خواند |
چک کوکی() | بررسی می کند اگر نام کاربری تنظیم شده است یا خیر |
در مرحله بعدی نحوه به روز رسانی یک کوکی را یاد خواهیم گرفت.
مرحله 3 – یک کوکی را به روز کنید
ما می توانیم مقادیر جدیدی را برای ویژگی های کوکی خود تنظیم کنیم. در مثال ما، اجازه دهید اشتراک کاربر را از یک برنامه ماهانه به یک برنامه سه ماهه ارتقا دهیم.
بیایید به روز کنیم
حداکثر–سن ویژگی از
نام کاربری کوکی از 30 روز تا 180 روز:
document.cookie = “Username=CloudSigma; path=/; max-age=” + 30 * 24 * 60 * 60; document.cookie = “Username=CloudSigma; path=/; max-age=” + 90 * 24 * 60 * 60;
سند.کوکی = “Username=CloudSigma; path=/; max age=” + 30 * 24 * 60 * 60; سند.کوکی = “Username=CloudSigma; path=/; max age=” + 90 * 24 * 60 * 60; |
مرحله 4 – یک کوکی را حذف کنید
تغییر نام کوکی با همین نام، کوکی را که می خواهید حذف کنید حذف می کند. ما می توانیم یک کوکی را با تنظیم حذف کنیم
حداکثر–سن نسبت به
0:
document.cookie = “نام کاربری=; حداکثر سن=0”;
سند.کوکی = “نام کاربری=؛ حداکثر سن=0”; |
همچنین، اگر کوکی مسیر مشخصی دارد، آن را با مشخص کردن موارد زیر حذف کنید:
document.cookie = “نام کاربری = ExcellentDesign؛ مسیر = /”;
سند.کوکی = “Username=ExcellentDesign; Path=/”; |
نتیجه
کوکی ها برای کارکرد و عملکرد صحیح وب سایت ضروری هستند. در این آموزش مقدماتی کوکی ها و انواع مختلف آن ها را به تفصیل مورد بحث قرار دادیم. همچنین نحوه کار با کوکی ها را با استفاده از یک مثال یاد گرفتیم. اکنون که با استفاده از کوکیهای جاوا اسکریپت راحت هستید، شروع به ایجاد کوکیهای سفارشی کنید تا درباره موضوع بیشتر بدانید و کاوش کنید.
علاوه بر این، بسیاری از آموزش های جاوا اسکریپت و توسعه وب وجود دارد که می توانید از وبلاگ ما بررسی کنید:
کار کامپیوتر مبارک!

درباره آزمایشگاه هارک
مهندس نرم افزار و علاقه مندان به فناوری جدید