 Web pages originally static  Page is delivered exactly as stored on server  Same information displayed for all users, from all contexts  Dynamic pages allow page content to change base on user actions, contexts, or other conditions  Page layout and content created separately  Content is often retrieved from an external source (e.g., database)  Content is placed within the layout only when needed or requested 2Client-Side Scripting

 Two classes of dynamic content  Distinction lies in where the code is executed  Client-side  Code is executed on the computer running the client (i.e., web browser)  Server-side  Code is executed by the server based on a client request  Result provided to the client  Can be static or provide for client-side content  Most modern web sites make use of both client- side and server-side scripting  Advantages, disadvantage, and risks associated with both 3Client-Side Scripting

 Client-side  JavaScript  VBScript  ActionScript (Adobe Flash)  Asynchronous JavaScript and XML (AJAX)  Server-side  Perl Common Gateway Interface (CGI)  JavaScript  PHP  Active Server Pages (ASP)  ASP.NET  JavaServer Pages (JSP)  ColdFusion 4Client-Side Scripting

 Computational resources  Which system does the work?  Data access  Which system has access to the required data?  Security  Which system carries the risk?  Which system can an attacker target?  What attack vectors are available? 5Client-Side Scripting

 Used to provide enhanced users interfaces and dynamic web sites  Interpreted language  Scripts are executed without compiling  Relies on a run-time environment to interact with “the outside world”  Interprets JavaScript code and generates machine code executed by the CPU  Enables browser to handle Content-Type text/javascript 6Client-Side Scripting

 JavaScript can be attached to a web page  In the header ( … )  In the body ( … )  As an event handler/listener  Code executed when an action is taken (e.g., click mouse button)  JavaScript embedded in the header or body is included within the tag  … 7Client-Side Scripting

 JavaScript can be stored in separate file  Large scripts  Code used in multiple pages  JavaScript files traditionally use.js extension  example.js  Syntax   Note: the src attribute doesn’t have to point to a file on the same site as the webpage using it  8Client-Side Scripting

 Scripts contained in the header or body are executed as they are encountered (when the page loads)  Code included in a function is NOT executed unless the function is called  Code that manipulates page elements MUST be defined (or called) after the element it manipulates  Execution assumes user has JavaScript enabled  Most browsers allow the user to disable JavaScript 9Client-Side Scripting

 Scripts without ability to interact with webpage are of limited utility  Scripts interact with webpage via the DOM  Allows scripts to change any aspect of the page  DOM is a convention for representing and interacting with objects in HTML  Constructed from a page’s HTML file  Reflects the structure of the page  Browser’s internal representation of a webpage  Most browsers have a similar (but not identical) DOM 10Client-Side Scripting

 The DOM is accessed via the document object  document.write(…)  Allows script to write HTML code to the page  document.location  Holds the URL for the current page  Can view the current URL  Ex: alert(document.location);  Can also set the current URL  Ex: document.location = “  Used to redirect users to another site 11Client-Side Scripting

 Almost all clients support attachments  Can attach an HTML to  If recipient opens attachment, the page will be rendered in the recipients browser  Including embedding JavaScript  Can be used for redirection (or more malicious purposes)  Most clients support HTML formatting  Client renders HTML-formatted s  Embedded scripts can be executed if the client supports script execution  Just opening the can cause scripts to execute 12Client-Side Scripting