html5-img
1 / 19

Lecture 2 Term 2

Lecture 2 Term 2. 20/1/12. Cookies. Cookies are a useful way of storing information on the client’s computer Initially feared, when they first appeared and were considered a security threat Today many web sites use cookies and today’s browser’s are configured to accept cookies by default.

michael-kemp
Download Presentation

Lecture 2 Term 2

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Lecture 2 Term 2 20/1/12

  2. Cookies • Cookies are a useful way of storing information on the client’s computer • Initially feared, when they first appeared and were considered a security threat • Today many web sites use cookies and today’s browser’s are configured to accept cookies by default

  3. Customer Benefits: • Site personalization • E.g. • Record name of returning visitor • Keep track of shopping cart materials • Register preferences

  4. Some Business Benefits: • Address target market with some accuracy • Help to determine the services that should be provided to the user • Help inform changes to the web site • Since cookies persist on the client’s computer, space does not need to be allocated on the web server to store user-specific information. • Cookies can save small amounts of information for very long periods of time.

  5. Disadvantages of Using Cookies • Users can choose to configure their browsers not to accept cookies. • Cookies are unable to save large objects, arrays, or other complex data types. • Visitors to your site can delete cookies from there machines. • User may have multiple machines.

  6. How do cookies operate in JavaScript? • Setting Cookies • Create a string in the form: cookie_name=value; • This sets the document.cookie property to that value

  7. How do cookies operate in JavaScript? • Cookie values must never have spaces, commas, or semicolons. • The following functions will code and decode your properties: • they are escape() • and unescape()

  8. <html> <head> <title> Cookie1 </title> <script language="javascript"> function setCookie1()// write a function to set a cookie that is called on the event in the body { var name = prompt("What's your name?","");// variable name is equal to the value entered into the prompt box var cookie1 = escape("username:" + name);// declares a variable called cookie1 equal to username and name value, ESCAPE METHOD ENCRYPTS THE VALUES IN THE () document.cookie = cookie1;//SETS the cookie equal to the variable value set in the previous line } </script> </head> <body> Click here to <a href="#" onClick="setCookie1();">set a cookie</a><!-- onclick of hyperlink the setCookie1 function is called and cookie value is set--> <br>Then click here to see an example of <a href="readcook.html">the cookie being read</a>.<!-- click hyperlink to move to next page and read the set cookie value--> </body> </html>

  9. Reading Cookies • Once you have set a cookie value you can then read it.

  10. <html> <head> <title> Cookie1 </title> <script language="javascript"> function readCookie1() //readCookie1 function called onclick in the body of the code { var cookie1= document.cookie; //we know there is a cookie set on our site so we need to access it var cookie1 = unescape(cookie1);//remove the padding from the cookie OR DECRYPT VALUES SET varbreakcookie = cookie1.split(":");//split the cookie at the colon to access individual values var name = breakcookie[1]; //grabs the variable value after the colon, the breakcookie array starts at breakcookie[0] which would return username, //to access the value held in name variable we must refer to the second array element- breakcookie[1] alert("Your name is: " + name); //alert box returns the original value set by the cookie } </script> </head> <body> Click here to <a href="#" onClick="readCookie1();">set a cookie</a><!-- onclick of hyperlink the setCookie1 function is called and cookie value is read--> <br> </body> </html>

  11. Setting the Expiry Date for a Cookie • To store cookies between browser sessions, they must be given an expiry date which will control how long the browser holds it before clearing it from the cookie file.

  12. Setting the Expiry Date for a Cookie var expires= new Date(); expires.setTime(expires.getTime() + 1000 * 60 * 60 * 20 * days); • Or var date1 = new Date("January 15, 2013"); varcookiedate = date1.toGMTString();

  13. Continued • Adding expires=date to the cookie string and separating the different cookie components with a semicolon. • When this cookie is set, it will live on the user's hard drive until the expiration date.

  14. Continued • The expiration date also allows you to delete cookies you do not want users to have any more. • If you set the expiration date of a cookie to a time that has already passed, the cookie will be deleted from the cookie file.

  15. <html> <head> <title> Cookie1 </title> <script language="javascript"> function setCookie1() // write a function to set a cookie that is called on the event in the body { var name = prompt("What's your name?",""); // variable name is equal to the value entered into the prompt box var date1 = new Date("March 15, 2012"); //sets cookie expiry property to date above varcookiedate = date1.toGMTString(); var cookie1 = escape(name); // declares a variable called cookie1 document.cookie = cookie1 + cookiedate; //sets the cookie equal to the variable value set in the previous line } </script> </head> <body> Click here to <a href="#" onClick="setCookie1();">set cookie1</a><!-- onclick of hyperlink the setCookie1 function is called and cookie value is set--> <br> Then click here to see an example of <a href="Cookie2.html">the cookie being read</a>.<!-- click hyperlink to move to next page and read the set cookie value--> </body> </html>

  16. <html> <head> <title> Cookie1 </title> <script language="javascript"> function readCookie1() //readCookie1 function called onclick in the body of the code { var cookie1= document.cookie; var cookie1 = unescape(cookie1); //unescape function moves padding added when cookie was set varbreakcookie = cookie1.split(); var name = breakcookie[0]; //grabs the variable value after the colon, the breakcookie array starts at breakcookie[0] which would return username, //to access the value held in name variable we must refer to the second array element- breakcookie[1] alert("Your cookie is: " + name); //alert box returns the original value set by the cookie } </script> </head> <body> Click here to <a href="#" onClick="readCookie1();">read cookie1</a><!-- onclick of hyperlink the setCookie1 function is called and cookie value is read--> <br> </body> </html>

  17. Check Out • http://www.cookiecentral.com/ • http://www.bbc.co.uk/webwise/askbruce/articles/browse/cookie_1.shtml • http://www.microsoft.com/info/cookies.mspx

More Related