330 likes | 344 Views
ECA 225. Applied Online Programming. cookies. cookies. cookies are small text files stored on the client’s computer they can be used to store bits of information that can be used again and again user’s name password date of last visit preferences. serving cookies.
E N D
ECA 225 AppliedOnline Programming cookies ECA 225 Applied Interactive Programming
cookies • cookies are small text files stored on the client’s computer • they can be used to store bits of information that can be used again and again • user’s name • password • date of last visit • preferences ECA 225 Applied Interactive Programming
serving cookies • cookies must be served up from a server, not simply loaded into a browser • Servers include: • IIS • Apache • Xitami • PWS ECA 225 Applied Interactive Programming
multiple cookie example strInitialVisit3/13/2003 at 15:23.www.justustwo.com/ECA225/034709853442961766120982864029592910*userNameMichael Barathwww.justustwo.com/ECA225/034709853442961766120982864029592910*lastVisit10/7/2003 at 11:41.www.justustwo.com/ECA225/034709853442961766120982864029592910*compareLastVisitTue Oct 7 23:41:25 EDT 2003www.justustwo.com/ECA225/034709853442961766121042864029592910*visitCounter38www.justustwo.com/ECA225/034709853442961766121092864029592910* ECA 225 Applied Interactive Programming
multiple cookie example cont … • previous example holds 5 cookies • strInitialVisit • userName • lastVisit • compareLastVisit • visitCounter ECA 225 Applied Interactive Programming
cookie parts • name / value pair • mandatory • expiration date • domain name • path • secure mode ECA 225 Applied Interactive Programming
cookie parts cont … name/value pair userName Michael Barath www.justustwo.com/ECA225/ 073082316829570567294051024029546435* domain & path expiration date ECA 225 Applied Interactive Programming
cookie parts cont … • name / value pair • mandatory • EG, userName = Michael • name of the cookie is userName • value associated with userName is ‘Michael’ • all names and values must be strings ECA 225 Applied Interactive Programming
cookie parts cont … • expiration date • by default, cookies only last through the current browser session • when the browser is closed, the cookie perishes • to create a cookie which persists, set the expires attribute • expiration date can be any valid string date ECA 225 Applied Interactive Programming
cookie parts cont … • domain and path • a cookie always contains the address of the server that sent it • a cookie can only be read by the server which created it to begin with • by default, the browser sets the domain and path to the directory where the script resides – only scripts within that directory can access the cookie • to make the cookie accessible to all scripts on the server overwrite the default: http://www.domain_name.com/ ECA 225 Applied Interactive Programming
cookie parts cont … • secure • tells the server whether or not a secure connection is needed to access the cookie • if the attribute is set, the cookie can only be sent over a secure connection ECA 225 Applied Interactive Programming
writing a cookie • a cookie is an object • the cookie object is an attribute of the document object • refer to the cookie using dot notationdocument.cookie ECA 225 Applied Interactive Programming
writing a cookie cont … • to write a cookie holding the user’s name • get user input • variable userName holds value, eg, ‘Michael’ • write the cookie by assigning a properly formatted string to document.cookie var userName = prompt( ‘Please enter your name’, ‘ ‘ ); ECA 225 Applied Interactive Programming
writing a cookie cont … • the cookie after it is written • the syntax for writing the cookie userNameMichael document.cookie = “userName=” + userName; ECA 225 Applied Interactive Programming
writing a cookie cont … • the previous example is a temporary cookie – it will perish as soon as the browser is closed • to set a cookie that persists, add an expiration date • to set a date object to 6 months in the future: var exp = new Date( );exp.setMonth( exp.getMonth( ) + 6 ); ECA 225 Applied Interactive Programming
writing a cookie cont … • use the same document.cookie assignment to add an expiration date • separate the name/value pair from the expiration date with a ; ( semicolon ) • after the semicolon, type the keyword expires • assign the newly set expiration date to expires ECA 225 Applied Interactive Programming
writing a cookie cont … • cookies can only contain strings • convert the exp Date object to a string the JavaScript method .toGMTString( ) • concatenate, assign to document.cookie variable string document.cookie = “userName=” + username + “;expires=” + exp.toGMTString( ); string Date object converted to string ECA 225 Applied Interactive Programming
cookie script if( document.cookie != "" ) { userName = cookieVal( "userName" );} // end ifelse { userName = window.prompt( "Please enter your first name", "" ); setUserName(); } // end elsefunction setUserName() { document.cookie = "userName=" + userName + ";expires=" + exp.toGMTString(); } // end function ECA 225 Applied Interactive Programming
cookie script cont … • test to see if any cookies from this particular server already exist • if cookies exist, this statement returns TRUE • if no cookies exist, the else statement is executed if( document.cookie != "" ) { userName = cookieVal( "userName" );} ECA 225 Applied Interactive Programming
cookie script cont … • the else statement calls a prompt box asking for the user’s name • a user-defined function named setUserName( ) is called to write the string to a cookie else { userName = window.prompt(‘Please enter your first name’, ‘ ‘); setUserName( );} ECA 225 Applied Interactive Programming
cookie script cont … • a cookie named userName is created, holding the value ‘Michael’, and expires in 6 months • a drawback to this example is the expiration date never changes function setUserName() { document.cookie = "userName=" + userName + ";expires=" + exp.toGMTString(); } // end of function ECA 225 Applied Interactive Programming
reading cookies • if the cookie already exists, we call cookieVal( ) to obtain the value associated with the cookie • in the function call we pass cookieVal( ) the name of the cookie (‘userName’) and assign the result to a variable of the same name if( document.cookie != "" ) { userName = cookieVal( "userName" );} ECA 225 Applied Interactive Programming
reading cookies cont … function cookieVal( cookieName ) { thisCookie = document.cookie.split("; "); for( i = 0; i < thisCookie.length; i++ ) { if( cookieName == thisCookie[i].split("=")[0] ) { return thisCookie[i].split("=")[1]; } // end if } // end for return 0; } // end function ECA 225 Applied Interactive Programming
reading cookies cont … • the split( ) method takes one argument, a string delimiter • the delimiter separates the cookie string into distinct parts • split( ) returns an array of values, split where ever the delimiter occurs thisCookie = document.cookie.split("; "); ECA 225 Applied Interactive Programming
reading cookies cont … • a cookie string which originally reads aswill now be an array named thisCookie which contains one element ( ‘userName=Michael) thisCookie = ( ‘userName=Michael’ ) ECA 225 Applied Interactive Programming
reading cookies cont … • multiple cookies, eg, ECA225 website • contains 5 cookies • each name=value pair is separated by a semicolon strInitialVisituserNamelastVisitcompareLastVisitvisitCounter ECA 225 Applied Interactive Programming
reading cookies cont … thisCookie = document.cookie.split("; "); creates the following array with 5 elements thisCookie = (‘strInitialVisit=3/13/2003 at 15:23’, ‘userName=Michael’, ’lastVisit=10/7/2003 at 11:41’, ’compareLastVisit=Tue Oct 7 23:41:25 EDT 2003’, ‘visitCounter=38’ ) ECA 225 Applied Interactive Programming
reading cookies cont … • run the array through a for loop which evaluates each value of the thisCookie array for( i = 0; i < thisCookie.length; i++ ) { if( cookieName == thisCookie[i].split("=")[0] ) { return thisCookie[i].split("=")[1]; } // end if } // end for ECA 225 Applied Interactive Programming
reading cookies cont … • inside the for loop is another split( )method which separates each value of the thisCookie array into a second array, split on the =the new arrays look like this: if( cookieName == thisCookie[i].split("=")[0] ) { ( ‘userName’ , ‘Michael’ ) ECA 225 Applied Interactive Programming
reading cookies cont … • the if statement checks if the cookie name we passed into the function matches any of the array values at index 0, after the second split ( ‘userName’ , ‘Michael’ ) if( cookieName == thisCookie[i].split("=")[0] ) { userName userName ECA 225 Applied Interactive Programming
reading cookies cont … • if it matches, the function returns the array value at index 1, after the second split userName userName if( cookieName == thisCookie[i].split("=")[0] ) { return thisCookie[i].split("=")[1]; Michael ECA 225 Applied Interactive Programming
reading cookies cont … • if a value is returned, it is assigned to a variable in the initial if statement, which we can use in our script as we want if( document.cookie != "" ) { userName = cookieVal( "userName" );} ECA 225 Applied Interactive Programming
updating expiration date if( document.cookie != "" ) { userName = cookieVal( "userName" ); setUserName( ); } // end ifelse { userName = window.prompt( "Please enter your first name", "" ); setUserName(); } // end elsefunction setUserName() { document.cookie = "userName=" + userName + ";expires=" + exp.toGMTString(); } // end function ECA 225 Applied Interactive Programming