1 / 29

Working with Cookies

Working with Cookies. Goals. By the end of this lecture you should … Understand the different types of cookies. Understand how JavaScript keeps track of cookies using the document.cookie object. continued …. Goals. By the end of this lecture you should …

varuna
Download Presentation

Working with Cookies

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. Working with Cookies

  2. Goals By the end of this lecture you should … • Understand the different types of cookies. • Understand how JavaScript keeps track of cookies using the document.cookie object. continued …

  3. Goals By the end of this lecture you should … • Understand how to create new cookies. • Understand how to set an expiration date for a cookie. • Understand how to delete a cookie. • Understand how to update a cookie’s value.

  4. What is a Cookie? • A cookie is a small text file that JavaScript can use to store customized information about a user. • There are two types of cookies: • Session Cookies (aka Transient Cookies) • Persistent Cookies

  5. Session Cookies • A browser stores session cookies in memory. • Once a browser session ends, browser loses the contents of a session cookie.

  6. Persistent Cookies • Browsers store persistent cookies to a user’s hard drive. • We can use persistent cookies to customize information about a user that we can use when the user returns to a website at a later date.

  7. Cookies as Objects • JavaScript deals with cookies as objects. • Specifically, JavaScript works with cookies using the document.cookie attribute. • We can read information from cookies by examining the document.cookie object.

  8. Examples of Cookie Uses • User preferences • Saving form data • Assisting with conveying information to back-end programs • Tracking online shopping habits

  9. Parts of a Cookie Object • name – An identifier by which we reference a particular cookie. • value – The information we wish to save, in reference to a particular cookie. • expires – A GMT-formatted date specifying the date (in milliseconds) when a cookie will expire.

  10. Parts of a Cookie Object • path – Specifies the path of the web server in which the cookie is valid. By default, set to the path of the page that set the cookie. However, commonly specified to /, the root directory. • domain – Specifies the domain for which the cookie is valid. Set, by default, only to the full domain of a page. You may wish to extend the domain to include other computers in your domain. • secure – Specifies that a web browser needs a secure HTTP connection to access a cookie.

  11. Cookie Limitations • A given domain may only set 20 cookies per machine. • A single browser may only store 300 cookies. • Browsers limit a single cookie to 4KB.

  12. Setting a Cookie – General Form window.document.cookie = “cookieName = cookieValue[; expires = expireDate][; path = pathName][; domain = domainName][; secure]”;

  13. Escape Sequences • When we set cookie values, we must first convert the string values that set a cookie so that the string doesn’t contain white space, commas or semi-colons. • We can use JavaScript’s intrinsic escape() function to convert white space and punctuation with escape sequences. • Conversely, we can use unescape() to view text encoded with escape().

  14. Using the Cookie Library • A great, open-source, tool is Bill Dortch’s Cookie Library, which contains a plethora of useful functions for dealing with cookies. • To use the functions, include the syntax on the next slide in your scripts …

  15. Including the Cookie Library <script language=“JavaScript 2.1” type = “text/javascript” src = “cookieLibrary.js”> </script>

  16. Calculation Expiration Dates • JavaScript stores dates as the number of milliseconds since 01/01/1970. • To calculate a new date, we would use a formula derived from milliseconds. • For example, 1 year in milliseconds:year = (365 * 24 * 60 * 60 * 1000)

  17. Calculating Expiration Dates var dNow = new Date(); var intTime = new Number(); intTime = dNow.getTime() + (365 * 24 * 60 * 60 * 1000); var dExpire = new Date(intTime);

  18. Calling SetCookie() • We can call the SetCookie() function from the Cookie Library using the following syntax:SetCookie(name, value [, expires] [, path] [, domain] [, secure]);

  19. Open the file called usingCookies_01.html

  20. Calling GetCookie() • We can call the GetCookie() function from the Cookie Library using the following syntax:GetCookie(cookieName);

  21. Open the file called usingCookies_02.html

  22. Calling DeleteCookie() • We can call the DeleteCookie() function from the Cookie Library using the following syntax:DeleteCookie(name, [, path] [, domain]);

  23. Open the file called usingCookies_03.html

  24. Modifying a Cookie • We can call the SetCookie() function from the Cookie Library to modify a cookie, essentially overwriting the previous cookie.

  25. Open the file called usingCookies_04.html

  26. Summary • Session cookies are available to a browser so long as a browser session is active; once the browser closes, it loses all session cookies. • Browsers save persistent cookies to a user’s hard drive; the values of persistent cookies are available across multiple browser sessions. continued …

  27. Summary • Cookies consist of a name, value, expiration date, path, domain and secure flag. • Browsers store cookie modification dates in milliseconds, from 01/01/1970. continued …

  28. Summary • We can use the SetCookie() function from the open-source Cookie Library to set or modify a cookie. • We can use the GetCookie() function from the open-source Cookie Library to retrieve an existing cookie’s value. • We can use the DeleteCookie() function from the open-source Cookie Library to delete a cookie.

  29. Resources • Spain-McDuffie, Tina. JavaScript Concepts & Techniques: Programming Interactive Web Sites. Wilsonville, OR: Franklin, Beedle & Associates, 2003.

More Related