Interactive Web Applications:

thickbugSoftware and s/w Development

Oct 28, 2013 (3 years and 5 months ago)

77 views

Application Architectures for

Interactive Web Applications:

Java JSP and
Model/View/Controller

Techniques

Jeff Schmitt

November 16, 2001

ABSTRACT

This talk is the report of my sabbatical leave during Spring 2001 in

which I explored some new techniques in using the Java language to

develop interactive web applications.


Java Server Pages technology (JSP) facilitates the development of

interactive websites with dynamically generated content. JSP programs

contain ordinary HTML tags mixed with Java code. Custom tag libraries

and Template processing are techniques which allow the Java code to be

isolated from the HTML. This application architecture is

based on the principles of Model/View/Controller.

Web Application Components


Client
--

typically a Web Browser


HTTP
--

request, response protocol between client and server


HTML files
--

static web content


Webserver
--

serves HTML files and


looks for certain request patterns, then forwards request to
servlet engine, for example:
/servlet/*


Servlet Engine
--

supports execution of servlets


Servlet
--

handles request from client, generates response to
client


JSP Engine
--

supports the compilation of files into Servlets


Web Application
--

a collection of HTML files, Servlets and
JSP pages to implement an information system on the web.

Tiered Systems

Single Tier
--

Mainframe

LAN

Two Tier
-

Client
-
Server

INTERNET

Database

Server

Application

Server

Web

Server

N
-
Tier
--

Web Application

Servlet Lifecycle

init()

destroy()

service()

Servlet Sequence Diagram

Client

Webserver

Servlet

request()

init()

destroy()

service()

Process request

response

response

Servlet Multithreading

Client 1

Servlet

request

Client 2

request

response

response

Servlets

Advantages



Disadvantages


Scalable


Persistent


Simple


Flexible


Support


Stable API


Run in separate
memory space
from Server


Servlet mapping

(servlet is not a web
page)


Hard for Web Designer
to change the HTML
part of the code


HTML (presentation)
and Java code (business
logic) mixed together


XML Notation


Begin and end within same tag:


<something/>


Begin and end as two separate tags:


<something>






</something>


Document Type Definition

<?xml version="1.0" encoding="ISO
-
8859
-
1"?>


<!DOCTYPE web
-
app PUBLIC "
-
//Sun Microsystems,
Inc.//DTD Web Application 2.2//EN"

"
http://java.sun.com/j2ee/dtds/web
-
app_2_2.dtd
">


JSP
--

Java Server Pages


Similar to servlets, but they resemble HTML
pages


Placed in web folders mixed with HTML files,
acts like an HTML file


Compiled automatically to a servlet when first
referenced or when the file is changed by
programmer.


Intended to help separate the presentation (HTML
response) from the logic (processing logic).


Similar to Microsoft's Application Server Pages
(ASP)

JSP Lifecycle

Client

Webserver

Servlet

request

service()

init()

Process request

response

response

JSP

request


JSP to Servlet

Compile Servlet

servlet

JSP scripting elements


JSP Comments

<%
--

jsp comment
--
%>



Declarations: placed in static part of servlet

<%! String filePath="/users";%>



Expressions: evaluate to a string

<%= request.getParameter("NAME")%>



Scriptlets: any Java statements

<%
(java statements)

%>



Template Text: inserted into response

<TABLE BORDER=1>

<TR><TH>Name:<TD><INPUT NAME="NAME" size=50
MAXLENGTH=50>

JSP Default Objects

Object

Class

Scope

Comments

request

HttpServletReq
uest

Request

The client request

response

HttpServletRes
ponse


Page

The servlet
response


out

JspWriter

page

An object for
writing to the
output stream

session

HttpSession

Session

Created to track
same user as they
visit and return to
pages in web
application

application

ServletContext

Application

Allows servlets to
communicate with
each other

JSP Object Scope

Scope

Meaning

Page

Available to the handling page only

Request

Available to the handling page and to any servlelt or
JSP that control is forwarded to or included

Session

Available to any servlet or JSP within the same session
(across repeat visits to web application)

Application

Available to any servlet or JSP within the same web
application

Custom JSP tags


Assemble reusable JSP code for easy use


An XML
-
like front end to access Java
programming


Designed to bridge the intersection between java
programmers and web designers


Tag library holds definitions of custom tags

<%@ taglib uri="jakarta
-
taglib/dbtags"
prefix="sql" %>


Custom tags save in Tag Library File
.tld


Many useful Tag Libraries exist for the common
tasks such as database access, email, file access


DBTags


From Apache Jakarta project


Allow use of JDBC with Java details hidden


Easy to use


Invisible exception handling

<sql:connection>



establish connection to server

<%
--

open a database connection
--
%>

<sql:connection id="conn1">


<%
--

required
--
%>


<sql:url>jdbc:mysql://localhost/test</sql:url>



<%
--

optional
--
%>


<sql:driver>org.gjt.mm.mysql.Driver</sql:driver>



<%
--

optional
--
%>


<sql:userId>root</sql:userId>



<%
--

optional
--
%>


<sql:password>notVerySecure</sql:password>


</sql:connection>

Statement and Query




The "escapeSql" tag can be used inside a SQL query to
SQL
-
escape your input values if they contain single
quotes.

<%
--

insert a row into the database
--
%>

<sql:statement id="stmt1" conn="conn1">


<%
--

set the SQL query
--
%>

<sql:query>


insert into test_books (id, name) values (3,


'<sql:escapeSql>


<%=request.getParameter("book_title")%></sql:escapeSql>')

</sql:query>


<%
--

execute the query
--
%>

<sql:execute/>


</sql:statement>

<sql:resultset>


<table>

<sql:statement id="stmt1" conn="conn1">

<sql:query>


select id, name, description from test_books order by 1

</sql:query>

<%
--

loop through the rows of your query
--
%>

<sql:resultSet id="rset2">


<tr> <td><sql:getColumn position="1"/></td>


<td><sql:getColumn position="2"/></td>


<td><sql:getColumn position="3"/>


<%
--

print out a comment if the book has no description
--
%>


<sql:wasNull>[no description]</sql:wasNull></td>

</tr>

</sql:resultSet>

</sql:statement>

</table>

JSP Action Elements


Control Tags for request
-
time include




Optional parameters for Control tags





Allow JSP programs to implement the Controller
aspect of the Model
-
View
-
Controller architecture

<jsp:include page="header.jsp"/>


<jsp:forward page="html.jsp/>


<jsp:forward page="html.jsp">


<jsp:param name="page" value="guestview"/>


</jsp:forward>

JSP Forward

Client

Webserver

Servlet 1

request

service()

Process

request

response

response

JSP

request


JSP to Servlet

Compile Servlet

servlet

Servlet 2

request


JSP to Servlet

Compile Servlet

servlet

Process

request

service()

Classical Model
-
View
-
Controller
Architecture

View

Controller

Model

Example: A Clock Application

Change Notification

User Events

Select a View

Model Changes

Model Queries

Problems with JSP


Although intended to help separate the
presentation logic (VIEW) from the business logic
(MODEL), JSP does not go far enough


JSP programs are often a mix of HTML and
business logic, which creates a problem if the
design of the page (VIEW) needs to be changed


HTML changes need to be made by web designers
who are not necessarily programmers


Solutions to this problem include WebMacro,
Struts, FreeMarker, Velocity

FreeMarker Template Processing


Makes substitutions of text in a template based on
a set of identifiers in a table ModelRoot)


Works with any form of text files including
HTML, XML. and Data files

Template

Cache

Freemarker

ModelRoot

Resulting

web page

FreeMarker Data Structures



SimpleHash

--

a random access table of words.

Each word is associated with a value which can be
any of the three Freemarker structures


SimpleList

--

a sequential access list of any of the
three Freemarker structures


SimpleScalar

--

a String of text


ModelRoot

--

the root of the structure

must be a SimpleHash

Freemarker RootHash

rootHash

guestbook

NAME

AFF1

AFF2

EMAIL

NAME

AFF1

AFF2

EMAIL

NAME

AFF1

AFF2

EMAIL

Joe

Towson U

COSC

joe@towson

Freemarker Template Scripting


Value Substitution from rootHash

${request.NAME}


Freemarker Comments

<comment> . . . </comment>


List iteration

<loop guestbook as entry> . . . </list>


Conditional

<if> . . . <else> . . . </if>


Text inclusion from another template file

<include "footer.html">

FreeMarker Template Cache


Manages the folder where templates are stored


Loads and compiles templates into tokenized form
for efficiency


Recognizes changes to templates while application
is running

Guestbook: Java Web Application

html.jsp?page=guestbook

html.jsp?page=login.jsp

html.jsp?page=guestsign

html.jsp?page=guestview

guestview.jsp

guestsign.jsp

guestview.jsp

checklogin.jsp

guestview.jsp

delete?id=34

jsp:forward

action


or link


Guestbook Demo

http://www.mycgiserver.com/~fontanini/intro
fm/html.jsp?page=guestbook

I18N


Internationalization


Language and Cultural differences


Dates Times


Browser sends header:
Accept
-
language: en
-
us


First two characters choose template file:


guestbook_en.html


guestbook_it.html


Example:

http://www.mycgiserver.com/~fontanini/fm/guestbook.jsp

Conclusion


JSP is Java that looks like HTML


Custom Tags make programming “easy”


Separation of business logic and presentation is
desirable for larger “Enterprise” projects


JSP alone does not achieve this separation


EJB, and other technologies are complicated


Template processing provides the desired
separation, rather easily and elegantly.


Thank you for attending. Any questions?