CSE 190 Internet ECommerce Lecture 7 HTML Templates

HTML Templates • Designed to separate server side logic from HTML presentation • Key

HTML Template languages • JSP (Java Server Pages) • ASP (Active Server Pages) –

Template systems: CGI differences CGI Most template systems • One process per • Are

JSP: Start with HTML (Source for hello. jsp) <html> <head><title>Hello World</title></head> <body bgcolor=#FFFFFF> <h

JSP: Variable substitution <html> <% String title. String = “Hello World”; %> <head><title> <%=

JSP: Page Composition <jsp: include page=“header. html” /> <body bgcolor=#FFFFFF> <h 2>Hello World</h 2>

JSP: Page composition • <jsp: include>: Also evaluates any JSP tags within the included

JSP: Server side code <html> <head> </head> <body> <%-- Generate two Prime Tables --%>

JSP: Server side (cot’d) // Check for primes for(int i=2; i<=max; i++) { boolean

JSP: Object scope • Three major scopes – Request – Session – Application •

Session scope: Cookies • Cookies: Allow HTTP server to recognize when the same browser

JSP: Implementation import java. io. *; import javax. servlet. http. *; public class Hello.

ASP (Active Server Pages) Examples • Variable substitution …<%= variable. Name %>…. • Page

PHP Examples • Variable substitution: <? php echo $HTTP_USER_AGENT; ? > • Page composition

Slides: 15

Download presentation

CSE 190: Internet E-Commerce Lecture 7

HTML Templates • Designed to separate server side logic from HTML presentation • Key features – Escapes from HTML into template language – Page compositing – Variable substitution – Executing server side code

HTML Template languages • JSP (Java Server Pages) • ASP (Active Server Pages) – Javascript, VBScript • Text: : Template (Perl module) • PHP (PHP Hypertext Processor) • Roll your own implementation

Template systems: CGI differences CGI Most template systems • One process per • Are processed within request a thread of the server process • Request data given by – Faster performance environment variable or via stdin • Input passed by a reference to a standard “request” variable

JSP: Start with HTML (Source for hello. jsp) <html> <head><title>Hello World</title></head> <body bgcolor=#FFFFFF> <h 2>Hello World</h 2> </body> </html>

JSP: Variable substitution <html> <% String title. String = “Hello World”; %> <head><title> <%= title. String %></title></head> <body> <h 2><%= title. String %></h 2> </body> </html>

JSP: Page Composition <jsp: include page=“header. html” /> <body bgcolor=#FFFFFF> <h 2>Hello World</h 2> <jsp: include page=“footer. html” />

JSP: Page composition • <jsp: include>: Also evaluates any JSP tags within the included document (allows nesting) • To avoid nested evaluation, use <%@ include file=“filename. html” %>

JSP: Server side code <html> <head> </head> <body> <%-- Generate two Prime Tables --%> The primes to 10: <%= get. Primes(10) %> The primes to 20: <%= get. Primes(20) %> <%-- Separate primes from non primes and generate a table This time as an expression tag defining a function. --%> <%! private String get. Primes(int max) { String. Buffer sb = new String. Buffer(); // Table headers sb. append("<table>"); sb. append(" < tr>"); sb. append(" < th>"); sb. append(" number"); sb. append(" </ th>"); sb. append(" < th>"); sb. append(" prime"); sb. append(" </ th>"); sb. append(" </ tr>");

JSP: Server side (cot’d) // Check for primes for(int i=2; i<=max; i++) { boolean found = false; for(int j=2; j<=Math. sqrt(i); j++) { if(i%j == 0) { found=true; break; } // Table body sb. append(" <tr>"); sb. append(" <td>"); sb. append(" "+i); sb. append(" </td>"); sb. append(" <td>"); if (found) { sb. append(" no"); } else { sb. append(" yes"); } sb. append(" </td>"); sb. append(" </tr>"); } // End of the table sb. append("</table>"); return sb. to. String(); } %> </body> </html>

JSP: Object scope • Three major scopes – Request – Session – Application • Detail: JSP supports “page” scope • What happens to “session” variable if JSP server stops running?

Session scope: Cookies • Cookies: Allow HTTP server to recognize when the same browser makes a new follow up request • Two types of cookies: session, persistent • HTTP header syntax – Request Cookie: NAME 1=OPAQUE_STRING 1; NAME 2=OPAQUE_STRING 2. . . – Response Set-Cookie: NAME=VALUE; expires=DATE; path=PATH; domain=DOMAIN_NAME; secure • Specification: http: //www. netscape. com/newsref/std/cookie_spec. html

JSP: Implementation import java. io. *; import javax. servlet. http. *; public class Hello. World extends Http. Servlet { public void do. Get(Http. Servlet. Request req, Http. Servlet. Response res) throws Servlet. Exception, IOException { res. set. Content. Type( "text/html"); Print. Writer out = res. get. Writer(); out. println("<HTML>"); out. println("<HEAD><TITLE>Hello World</TITLE></HEAD>"); out. println("<BODY>"); out. println("<BIG>Hello World</BIG>"); out. println("</BODY></HTML>"); } }

ASP (Active Server Pages) Examples • Variable substitution …<%= variable. Name %>…. • Page composition  • Server side code <%@ language="javascript" %> <html> <head> <% function jsproc(num 1, num 2) { Response. Write(num 1*num 2) } %> </head><body> The result of the calculation is: <%jsproc(3, 4)%> </body></html> • Reference: http: //www. w 3 schools. com/asp_intro. asp

PHP Examples • Variable substitution: <? php echo $HTTP_USER_AGENT; ? > • Page composition <? php require( "header. inc"); ? > <? php include( "header. inc"); ? > • Server side code <? php if( strstr( $HTTP_USER_AGENT, "MSIE")) { echo "You are using Internet Explorer "; } ? > • Reference: http: //www. php. net/manual/en/