פרק 18: עוגיות - Cookies

· הקדמה

· יצירת עוגיה

· התכונה Expires

· התכונה Path

· התכונה Domain

· התכונה Secure

· קבלת האינפורמציה שמאוחסנת בתוך עוגיה

· תרגילים

הקדמה

כאשר צופים בדף HTML, לעתים נשמרות במחשב שלנו חבילות נתונים קטנות שנשמרות בקובץ אחד או יותר ושמכילות אינפורמציה שנוגעת לדפים שבהם צפינו. חבילות נתונים אלה נקראות בשם cookies. ה-cookies מאפשרים שמירת אינפורמציה כגון סיסמאות כניסה, ואינפורמציה אחרת על התכנים שבהם צפינו. באמצעות ה-cookies ניתן, למשל, לאפיין כל גולש וגולש שמבקר באתר ולהציג בפניו את הפרסומות שמתאימות לתחום העניין שלו.

האופן שבו נשמרים ה-cookies ושמותיהם משתנה בהתאם לסוג הדפדפן ובהתאם לסוג המחשב. כאשר מדובר ב-Netscape Nevigator קיים קובץ אחד ששמו cookies.txt, אשר מכיל בתוכו את כל ה-cookies שנשמרים במחשב. כאשר מדובר ב-Internet Explorer קיימים מספר קבצי cookies אשר נשמרים בספריה ששמה cookies. כל קובץ מכיל חבילת נתונים אחת (cookie אחת).

כיוון שהקובץ cookies הוא קובץ טקסט ניתן לצפות בו ולהתרשם מתוכנו. יש להיזהר מלשנותו כיוון שבכך עלול להיגרם נזק לפעולת הדפדפן בעת הצפייה באתרים שמסתמכים בפעולתם על ה-cookies.

הקובץ cookies מכיל בתוכו חבילות נתונים (עוגיות,cookies). כל עוגיה כוללת בתוכה את האינפורמציה הבאה:

ה-domain אשר יצר את העוגיה.

האם יש צורך בקשר מאובטח (secure HTTP) כדי לגשת לעוגיה.

רשימת ה-URLS אשר יכולים לגשת אל העוגיה.

התאריך שבו פג התוקף של העוגיה.

שמה של העוגיה.

מחרוזת התווים שמהווה את תוכן העוגיה.

כפי שניתן לשים לב, כל עוגיה נוצרת על ידי domain מסוים ומשויכת אליו.

כיוון שהקובץ cookies.txt, אשר מוחזק באחת מתתי ספריותיו של הדפדפן, מוגבל במספר העוגיות שהוא יכול להכיל בתוכו, יש לכל עוגיה תאריך תפוגה. תאריך התפוגה נקבע בעת יצירת העוגיה על ידי ה אתר שהורה על יצירתה. הדפדפן Netscape Nevigator מורה על מחיקתה של כל עוגיה, שתאריך תפוגתה הגיע, מתוך הקובץ cookies.txt.

אם בעת יצירתה של העוגיה לא קובעים לה תאריך תפוגה (expiretion date) אז העוגיה אפילו לא תיכתב אל הקובץ cookies.txt. עוגיות מסוג זה יכולות לשמש כלי תכולה לנתונים שנדרשים במעבר בין דפי ה-HTML השונים של האתר. עוגיות מסוג זה שימושיות בייחוד לצורך יצירת סל קניות וירטואלי באתר שמספק מסחר אלקטרוני.

אפשרויות הגישה לעוגיות באמצעות פקודות ב-javaScript כוללות את האפשרות ליצור עוגיה ולקבוע את מאפייניה השונים בעת יצירתה (תאריך התפוגה למשל) וכמו כן, הן כוללות גם את האפשרות לקבל בחזרה את הנתונים שמאוחסנים בעוגיה קיימת.

העוגיות נחשבות ב-javaScript לתכונות שיש בכל אובייקט מסוג document. כדאי לשים לב לכך שכל דפדפן מגביל את מספר העוגיות שניתן לייצור מ-domain מסוים.

יצירת עוגיה

כדי ליצור עוגיה (חבילה של נתונים, cookie) משתמשים באופרטור ההשמה (סימן השוויון) ומכניסים כערך אל תוך התכונה cookie, אשר קיימת באובייקט documen, את מחרוזת התווים שמכילה את שם העוגיה ואת תוכנה. אם רוצים לקבוע את מאפייני העוגיה אז יש להוסיף כחלק מתוכנה של העוגיה גם את קביעת מאפייניה(יוסבר בהמשך).

דוגמא:

document.cookie = "amazonBasket = java2d_1_1234232+swing_1_1231232"

בדוגמא זו, למשל, נוצרת עוגיה ששמה amazonBasket, ותוכנה הוא המחרוזת: java2d_1_1234232+swing_1_1231232.

כאשר יוצרים, למשל, את העוגיה הזו יודעים מראש מהו הפורמט שבו הנתונים יישמרו בתור תוכנה של העוגיה. על פי פורמט זה הנתונים נשמרים/נקראים אל/מ העוגיה.

בכל יצירה של עוגיה חייבים לכלול את שם העוגיה שיוצרים ואת תוכנה (כפי שהוצג בדוגמא). אם העוגיה שיוצרים לא קיימת (הדפדפן לא זיהה עוגיה קיימת ששמה זהה לשם העוגיה שיוצרים) אז הוא יוצר עוגיה חדשה ששמה ותוכנה כפי שצויין. לעומת זאת, אם העוגיה שיוצרים כבר קיימת (הדפדפן זיהה עוגיה קיימת ששמה זהה לשם העוגיה שיוצרים) אז הוא מעדכן את תוכנה ואת נתוניה על פי נתוני העוגיה החדשה. הצמד: שם התכונה וערכה חייב להיות מחרוזת תווים אשר איננה כוללת נקודות פסיק, פסיקים, סימני טאב וריווחים. את בעיית הריווחים ניתן לפתור באמצעות המתודות escape() ו- unescape() אשר הופכות ריווחים במחרוזת ל %20, ולהפך. שתי מתודות אלה יכולות לשמש, באופן דומה, גם כדי לטפל בסימנים המיוחדים האחרים שמופיעים במחרוזת התווים. אם רוצים לקבוע עוגיה שתוכנה הוא אוסף של ערכים שמאוחסנים במערך ניתן להשתמש במתודה join אשר ניתנת להפעלה על אובייקט מסוג Array, ובמתודה split אשר ניתנת להפעלה על מחרוזת תווים.

אם יצירת העוגיה נעשתה מבלי לציין את ערכי מאפייניה (כפי שהדוגמה מראה) אז הערך שיקבע לכל אחד ממאפייניה יהיה ערך ברירת המחדל שיש לאותה תכונה (כך למשל, אם לא צוין ה-expiretion date אז העוגיה אפילו לא תיכתב אל הקובץ cookies.txt). כדי להוסיף אל תוך המחרוזת את ערכי מאפייניה של העוגיה יש להוסיף בהמשך המחרוזת סימני נקודה-פסיק בצירוף ריווח בודד כסימנים מפרידים בין התוכן של העוגיה לבין קביעת מאפייניה, וכמו כן, כסימנים מפרידים בין קביעת מאפייניה השונים. המאפיינים של העוגיה אשר ניתן לקבוע כוללים את המאפיינים הבאים: expires, path, domain ו-secure.

דוגמא:

document.cookie = "zindellCookie=music_sport; expires=Sat, 03-Jan-70 22:10:12 GMT; path=buyingArea; domain=http://www.zindell.com;secure"

המאפיין Expires

הערך שמאפיין זה מקבל הוא מחרוזת תווים (בפורמט GMT) אשר מתארת את מועד התפוגה של העוגיה. מועד התפוגה של עוגיה הוא נקודת הזמן שהחל ממנה ואילך העוגיה לא תתפוס יותר מקום בקובץ cookies.txt, כלומר, לא תישמר עוד במחשב של המשתמש. הדפדפן Netscape Nevigator מעלה לזיכרון הפעולה שלו, בתחילת פעולתו, את כל העוגיות שנשמרו במחשב. במהלך פעולתו הוא לא פונה יותר לקובץ cookies.txt כדי להעלות עוגיות נוספות, ורק כאשר הוא מסיים לפעול הוא שומר חזרה לקובץ את כל העוגיות שקיימות בזיכרון שלו.

ניתן לקבל מחרוזת טקסט שמתארת נקודת זמן בפורמט GMT (Greenwich Mean Time) באמצעות הפעלת המתודה toGMTString() על אובייקט מסוג Date.

לדוגמא:

var expDate = new Date();

document.cookie = "zindellCookie=music_sport_; expires=" + expDate.toGMTString()

בקובץ cookies.txt ערכה של התכונה הזו נשמר אמנם כערך מספרי (מספר השניות), אך כדי לקבוע את ערכה של התכונה חייבים להשתמש במחרוזת טקסט בפורמט GMT. אם קובעים את ערכה של תכונה זו כך שתתאר נקודת זמן שכבר חלפה אז העוגיה כלל לא תישמר אל תוך הקובץ cookies.txt. כפי שכבר צוין, אם לא קובעים ערך למאפיין האמור אז העוגיה שנוצרת כלל לא תישמר אל תוך הקובץ cookies.txt, והיא תיחשב לעוגיה זמנית שתוקפה פג עם היציאה מהדפדפן.

התכונה path

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

התכונה domain

בכל עוגיה קיימת התכונה domain אשר משייכת אותה לכתובת מסוימת באינטרנט (המקור של אותה עוגיה). בדרך זו, הגישה לכל עוגיה ועוגיה מתאפשרת רק אם המסמך שמנסה לגשת אליה אכן הגיע מה-domain של אותה עוגיה. אם לא קובעים את ערכה של תכונה זו אז הערך שניתן למאפיין domain של העוגיה שיוצרים הוא כתובת ה-URL של האתר שממנו העוגיה הגיעה. כאשר קובעים את ערכו של מאפיין זה יש לספק את כתובת ה-URL המלאה או, לפחות, את שתי המלים העיקריות שלה בצירוף נקודה אחת בתחילה ונקודה בין שתי המלים. לדוגמא: .zindell.com או .microsoft.com

התכונה secure

בכל עוגיה קיימת התכונה secure עם הערך true או false. אם ערכה של התכונה false (ברירת המחדל) אז הגישה לעוגיה תתאפשר מכל מסמך ששייך לאתר ושעומד בדרישות ה-path וה- domain. אם ערכה של התכונה true אז הגישה לעוגיה תתאפשר רק מאותם מסמכים שההרשאה הזו ניתנה להם (יוסבר בהמשך).

קבלת האינפורמציה שמאוחסנת בתוך עוגיה

באמצעות פקודות ב-javaScript ניתן לקבל בחזרה אך ורק את התחלתה של המחרוזת (שם העוגיה ותוכנה). את ערכי המאפיינים של העוגיה לא ניתן לקבל בחזרה. הפניה לתכונה cookie אשר קיימת באובייקט document כמוה כפנייה למחרוזת התווים שמהווה את שם העוגיה ותוכנה.

התכנית הבאה (יחד עם שתי התכניות שאחריה) מדגימה כיצד ניתן ליצור עוגיה. המסמך שמוצג למשתמש קולט ממנו את שמו, ובפעם הבאה שהמסמך מוצגת הודעה מתאימה. התכנית גם עושה שימוש בתכונה href אשר קיימת באובייקט location (ה-reference אליו מוחזק כתכונה של אובייקט ה-document). באמצעות התכונה href ניתן לשנות את המסמך שמוצג בחלון. הערך של התכונה href הוא ה-URL של המסמך המוצג. באמצעות שינוי של התכונה href ל-URL של המסמך שרוצים להציג משנים את המסמך המוצג.

<!-- file name : simpleCookiesDemo.html -->

<!-- 2000(c) Zindell Publishing House Ltd. -->

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<HTML>

<HEAD>

<TITLE>simpleCookiesDemo.html</TITLE>

<SCRIPT LANGUAGE="JavaScript1.2">

function checkToGoOn()

{

str=document.cookie;

if (str.length!=0)

{

document.location.href = "simpleCookiesDemo2.html";

}

else

{

document.location.href = "simpleCookiesDemo1.html";

}

}

checkToGoOn();

</SCRIPT>

</HEAD>

<BODY >

</BODY>

</HTML>

<!-- file name : simpleCookiesDemo1.html -->

<!-- 2000(c) Zindell Publishing House Ltd. -->

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<HTML>

<HEAD>

<TITLE>simpleCookiesDemo1.html</TITLE>

<SCRIPT LANGUAGE="JavaScript1.2">

function goOn()

{

setCookie();

document.location.href = "simpleCookiesDemo2.html";

}

function setCookie()

{

expirationDate = new Date();

expiration = expirationDate.getTime() + 30*24*60*60*1000;

expirationDate.setTime(expiration);

result = "simpleCookie=_"+document.myForm.pName.value

+"_"+document.myForm.fName.value+"_; expires="+expirationDate.toGMTString();

document.cookie = result;

document.myForm.ee.value = expirationDate.toGMTString();

}

</SCRIPT>

</HEAD>

<BODY>

<FORM NAME="myForm">

<BR>

Hi,<BR>

In order to give you the best possible service, please fill the following text fields.

<BR>

<LABEL>private name : <INPUT NAME="pName" SIZE="20"></LABEL>

<LABEL>family name : <INPUT NAME="fName" SIZE="20"></LABEL>

<BR><INPUT TYPE="button" onClick="goOn()" VALUE="PRESS TO CONTINUE">

<BR><INPUT NAME="ee" SIZE="80">

</FORM>

</BODY>

</HTML>

<!-- file name : simpleCookiesDemo2.html -->

<!-- 2000(c) Zindell Publishing House Ltd. -->

<! DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">

<HTML>

<HEAD>

<TITLE>simpleCookiesDemo2.html</TITLE>

<SCRIPT LANGUAGE="JavaScript1.2">

function setInfo()

{

var str = document.cookie;

var reg = /_/;

var vec = str.split(reg);

var pName = vec[1];

var fName = vec[2];

var result = "<BR>Hi " + pName + " " + fName + ",<BR>How are you ?";

document.write(result);

}

setInfo();

</SCRIPT>

</HEAD>

<BODY>

</BODY>

</HTML>

תרגילים

1. כתוב/כתבי דף HTML אשר יציג למשתמש (בפעם הראשונה שבה הוא מבקר באתר) שאלות בנוגע לפרטיו האישיים (לרבות תחומי העניין שלו-המשתמש יבחר מתוך מספר אפשרויות בחירה אחת או יותר). בהתאם לתשובותיו תוצגנה (בכל אחת מן הפעמים הבאות שבהן יבקר באתר) פרסומות מתאימות. הפרסומות המתאימות תופענה בתוך INFRAME אשר יוצג בשורה העליונה.

2000 © All the rights reserved to Haim Michael & Zindell Publishing House Ltd.

No parts of the contents of this paper may be reproduced or transmitted in any form by any means

without the written permission of the publisher ! This book can be used for personal use only !!!

Brought to you by Zindell

(http://www.zindell.com)

לנוחיותך, להלן תוכן העניינים של הספר:

פרק 1 : הבסיס
פרק 2 : ערכים בסיסיים
פרק 3 : אופרטורים
פרק 4 : משפטי בקרה ולולאות
פרק 5 : פונקציות
פרק 6 : אובייקטים
פרק 7 : אובייקטים מובנים בשפה
פרק 8 : אופן פעולת האובייקטים
פרק 9 : תבניות טקסט
פרק 10 : שילוב של JavaScript ו- HTML
פרק 11 : טיפול באירועים
פרק 12 : האובייקטים שנוצרים בדפדפן
פרק 13 : האובייקט Navigator
פרק 14 : האובייקט Window
פרק 15 : האובייקט Document
פרק 16 : האובייקט Location
פרק 17 : האובייקט History
פרק 18 : יצירת cookies
פרק 19 : האובייקטים Link ו- Anchor
פרק 20 : האובייקט Image
פרק 21 : יצירת Image Map
פרק 22 : האובייקט Form
פרק 23 : טכנולוגית ה- LiveConnect