עוגיות ב JavaScript

עוגיות הן קבצי טקסט קטנים (אפילו קטנים מאוד) ששמורים במחשב של הגולש. מי שמשתמש ב explorer ל windows יכול להסתכל בתיקיה c:/windows/cookies ושם ימצא את כל העוגיות שבמחשב שלו.

למה עוגיות משמשות?

בתור בונה אתרים אתה יכול לשתול עוגיה במחשב של הגולש, לשמור בה מידע וכך לזהות אותו בכניסות הבאות. למשל: בכניסתו הראשונה של הגולש הוא יכנס לעמוד כלשהו ובכניסות הבאות הוא ידלג עליו, ולא יראה אותו.
לכל עוגיה יש שם וערך. יש אפשרות להוסיף גם תאריך תפוגה – מתי היא תימחק, כתובת URL ועוד. אנחנו נתמקד רק בשם, ערך ותאריך התפוגה. במידה ולא מוגדר תאריך תפוגה העוגיה תמחק ברגע שנסגור את הדפדפן.

הגדרת עוגיה

1 2	var thecookie = "cookiename=cookievalue;expires=cookieexpires"; document.cookie = thecookie;

המשתנה thecookie מילא את תפקיד העוגיה השלמה, ואז הושם בתוך document.cookie.
עכשיו ניישם את זה לכיוון הדוגמא שהוזכרה: דף שנראה רק בכניסה הראשונה לאתר.
לעוגיה יקראו firstvisit ואחרי הביקור הראשון היא תכיל את הערך false. בכניסה לאתר נבדוק האם קיימת העוגיה (כשהמשתמש יגיע בפעם הראשונה לאתר, העוגיה בכלל לא תהיה קיימת) אם העוגיה קיימת זה סימן שזהו לא הביקור הראשון ונעביר את הגולש לדף השני (בדוגמה הזאת כלל לא נבדוק את ערך העוגיה), אם העוגיה לא קיימת נגדיר אותה, ואת תאריך התפוגה נקבע לעוד שנה מעכשיו.

1 2	if(document.cookie!="")   document.location = "second.html";

אם העוגיה לא ריקה (שונה מ-"") עבור לדף second.html.

1	var exp_date = new Date();

exp_date מוגדר לתאריך הנוכחי.

1	exp_date.setYear(exp_date.getYear()+1);

ע"י setYear אנחנו משנים את השנה של התאריך, השנה הופכת לשנה הנוכחית ועוד שנה אחת.

1	document.cookie = "firstvisit=false;expires="+exp_date.toGMTString();

זה החלק החשוב: כאן אנחנו יוצרים עוגיה בשם firstvisit בתור ערך שמים לה false. בתור תאריך פקיעה שמים exp_date.toGMTString() בגלל ש exp_date הוא אובייקט ואנחנו לא יכולים לשים אותו בתוך עוגיה לכן משתמשים בשיטה toGMTString() שהופכת אותו לטקסט. שימו לב לשרשור: עוגיה היא מחרוזת טקסט רגילה! עד כאן שימוש פשוט מאוד בעוגיות.

עכשיו נעשה דוגמא קצת יותר מסובכת: נודיע לגולש מתי היה הביקור האחרון שלו באתר, הפעם נצטרך להשתמש גם בערך העוגיה. שם העוגיה יהיה lastvisit ולא יהיה לה תאריך תפוגה

1 2 3 4 5

if(document.cookie!="") {    var cookie_value = document.cookie.split("=")[1];    alert('your last visit here was in '+cookie_value); }

השיטה split מפצלת את העוגיה לשני חלקים: החלק שלפני השווה – שם העוגיה והחלק שאחריו ושומרת כל אחד מהם בתא במערך. התייחסנו רק לתא השני (ע"י [1]) ושמרנו אותו במשתנה cookie_value. ואז בהודעה פשוטה מציגים את המשתנה. זה רק אם ישנה עוגיה. עכשיו צריך לאפות את העוגיה:

1 2 3

var now = new Date(); var date_text = now.getDate()+"/"+now.getMonth()+"/"+now.getYear(); document.cookie = "lastvisit="+date_text;

כאן אנחנו יוצרים משתנה בשם date_text שמכיל את התאריך בפורמט dd/mm/yy. ואז אנחנו מכניסים אותו לעוגיה…
הערה: כל זה יפעל כשיש עוגיה אחת, אבל כשיש יותר מאחת אז זה מסתבך…

שתהיה לכם אפייה נעימה
בהצלחה!