comp9321 web application engineeringcs9321/17s2/lectures/lec02/lec-02.pdfpresentation layer...

COMP9321 Web Application EngineeringSemester 2, 2017

Dr. Amin BeheshtiService Oriented Computing Group, CSE, UNSW Australia

Week 2

1COMP9321, 17s2, Week 2

http://webapps.cse.unsw.edu.au/webcms2/course/index.php?cid= 2465

Different Layers in an Application

2COMP9321, 17s2, Week 2

Presentation Layer

3COMP9321, 17s2, Week 2

HTML is a markup language for describing Web documents (Web pages).

set of markup tags

is-a

describe

different document content

html -> describes an HTML document.head -> provides information about the document.title -> provides a title for the document.body -> describes the visible page content.h1 -> describes a heading.p -> describes a paragraph

Presentation Layer

4COMP9321, 17s2, Week 2

HTML forms are used to collect user input.

If you click "Submit", the form-data will be sent to a page called "main.jsp".

Presentation Layer

5COMP9321, 17s2, Week 2

HTML <form> method attribute

how to send form-data

URL variables (with method="get") , or HTTP post transaction (with method="post").

specifies

as

Method? Get/Post

Presentation Layer

6COMP9321, 17s2, Week 2


GET:• Appends form-data into the URL in name/value pairs• The length of a URL is limited (about 2-3k characters)• Never use GET to send sensitive data! (will be visible in the URL)• Useful for form submissions where a user want to bookmark the result,

to enable quick access in future.

Google("HTML Links - Create a Bookmark“)

• GET is better for non-secure data, like query strings in Google.• GET is supposed to be used for getting things - information retrieval

With the GET method, the HTTP request looks like this:

action_page.jsp?firstname=Tim&lastname=Berners-Lee

Presentation Layer

7COMP9321, 17s2, Week 2


POST:• Appends form-data inside the body of the HTTP request (data is not

shown in URL).• Has no size limitations.• Form submissions with POST cannot be bookmarked.

Clicking a bookmark will always fire a GET request!

• POST is supposed to be used for sending data to be processed - update or change something on the server

When sent using the POST method, the HTTP request looks like this:

Static vs. Dynamic Web Page

8COMP9321, 17s2, Week 2

A static web page is delivered to the user exactly as stored, in contrast to dynamic web pages which are generated by a web application, and on demand!

Static websites:• Quick to develop• Cheap to develop• Cheap to host

Dynamic websites:• Much more functional website• Much easier to update• New content brings people back to the site and helps in the search engines• Can work as a system to allow staff or users to collaborate• Slower / more expensive to develop• Hosting costs

Static vs. Dynamic Web Page

9COMP9321, 17s2, Week 2

A static web page is delivered to the user exactly as stored, in contrast to dynamic web pages which are generated by a web application, and on demand!

web page whose construction is controlled by an application server processing server-side scripts.

software framework that provides both facilities to create web applications and a server environment to run them.

is-a

is-a

Java application servers

e.g.

It's core set of API and features are defined by Java EE.

The Web modules include Java Servlets and Java Server Pages.

http://docs.oracle.com/javaee/6/tutorial/doc/

Java Servlets

10COMP9321, 17s2, Week 2

http://java.sun.com/products/servlet/index.jsphttp://docs.oracle.com/javaee/6/tutorial/doc/bnafd.html

Apache Tomcat

11COMP9321, 17s2, Week 2

An open source implementation of the Java Servlet, JavaServer Pages, Java Expression Language and Java WebSocket technologies..

Tomcat's Installed Directory Structure:• bin: for Tomcat's binaries and startup scripts.• conf: global configuration applicable to all the webapps.• lib: Keeps the JAR-file that are available to all webapps.• logs: contains the engine logfile Catalina ("Catalina" is the codename

for Tomcat 5 and above).• webapps: the default appBase - web applications base directory of the

host localhost.• work: contains the translated servlet source files and classes of JSP.• temp: temporary files.

Making servlets available in the Web container

12COMP9321, 17s2, Week 2

e.g., Ant tasks for Tomcat, Eclipse Web Tools Platform (WTP)

Google(“what is 8080 port”)

How container handles the Servlet request

13COMP9321, 17s2, Week 2

1. Client Browse Servlet URL: User clicks a link that has a URL of Servlet.

2. HttpServletRequest and HttpServletResponse: Container (e.g. Apache Tomcat) sees that the request is for servlet , so create two objects : Request and Response

((HeadFirst) p.42)http://www.jitendrazaa.com/blog/java/servlet/


14COMP9321, 17s2, Week 2

3. Create Thread for Servlet: Container finds correct servlet using “web.xml” file; and Creates/Allocate thread for that request …

4. Service method of servlet: Container calls the servlets service() method, on the type of request, service calls doGet() or doPost() methods.


A thread is a single sequential flow of control within a program.

Google( Thread, computing )


15COMP9321, 17s2, Week 2

5. Servlet response object: Lets assume that service calls the doPost() method. doPost() method generates dynamic page and add the page in response object.

6. destroy response and request object: Thread completes, container converts the response object into HttpResponse object and destroys the response and request object.


Google( garbage collection, programming )

Your Servlet inherits "lifecycle" methods

16COMP9321, 17s2, Week 2

A typical Servlet looks like this

17COMP9321, 17s2, Week 2

Note: No main() - the container calls the servlet methods like doGet() through service()

Servlet Names

18COMP9321, 17s2, Week 2

Servlet Names

19COMP9321, 17s2, Week 2

Why do we need a servlet name?It allows you to have multiple servlet mappings on a single servlet instance without the unnecessary need to create a separate instance per mapping. More?

<servlet><servlet-name>someServlet</servlet-name><servlet-class>com.example.SomeServlet</servlet-class>

</servlet><servlet-mapping>

<servlet-name>someServlet</servlet-name><url-pattern>/enroll</url-pattern>

</servlet-mapping><servlet-mapping>

<servlet-name>someServlet</servlet-name><url-pattern>/pay</url-pattern>

</servlet-mapping><servlet-mapping>

<servlet-name>someServlet</servlet-name><url-pattern>/bill</url-pattern>

</servlet-mapping>

A Lifecycle of a Servlet

20COMP9321, 17s2, Week 2

The Web container controls the lifecycle of a servlet class:

Servlet's Life

21COMP9321, 17s2, Week 2((HeadFirst) p.99)

Why care about this initialisation details?

22COMP9321, 17s2, Week 2

Once the servlet is initialised, the servlet gets access to two important objects: ServletConfig and ServletContext

ServletConfig:• It is implemented by the servlet container to initialize a single servlet using init();• you can pass initialization parameters to the servlet using the web.xml;• For understanding, this is similar to a constructor in a java class;• One ServletConfig object per servlet;• Use it to pass deploy-time information to the servlet (any info. that you do not want to

hard-code into the servlet);• Parameters are configured in the deployment descriptor;• Use it to access the ServletContext;

<servlet><servlet-name>ServletConfigTest</servlet-name><servlet-class>com.javapapers.ServletConfigTest</servlet-class><init-param>

<param-name>topic</param-name><param-value>Difference between ServletConfig and ServletContext</param-value>

</init-param></servlet>


23COMP9321, 17s2, Week 2

Once the servlet is initialised, the servlet gets access to two important objects: ServletConfig and ServletContext

ServletContext:• It is implemented by the servlet container for all servlets to communicate with its

servlet container;• For example, to get the MIME type of a file, to get dispatch requests, or to write to a

log file. That is to get detail about its execution environment;• For understanding, this is like a application global variable mechanism for a single

web application deployed in only one JVM;• One ServletContext per Web application (they should have named it AppContext);• Use it to access parameters that are Web application-wide;

• The ServletContext object is contained within the ServletConfig object, and can be accessed using the ServletConfig object within a servlet; You can specify param-value pairs for ServletContext object in <context-param> tags in web.xml file.

<context-param><param-name>globalVariable</param-name><param-value>comp9321</param-value>

</context-param>


24COMP9321, 17s2, Week 2

So to sum up there is only one ServletContext for an entire app and all the parts of the web app share it. But each servlet in the app has its own ServletConfig.

Remember if you change a value you must redeploy the web app in order to get the new value because a servlet is only initialized once at the beginning of its life.

ServletRequest & ServletResponse Interfaces

25COMP9321, 17s2, Week 2

The container implements HttpServletRequest and HttpServletRequest

All you should care about is when servlet is called, the service() passes two objects to your servlet.

HttpServletRequest, HttpServletResponse

26COMP9321, 17s2, Week 2

A simple servlet that generates a text message

27COMP9321, 17s2, Week 2

RequestDispatcher in Servlet

28COMP9321, 17s2, Week 2

• The RequestDispatcher interface provides the facility of dispatching the request to another resource, e.g., servlet, jsp, or html.

• This interface can also be used to include the content of another resource also.• It is one of the way of servlet collaboration.

http://www.javatpoint.com/

The RequestDispatcher interface provides two methods: forward and include• Forward: Forwards a request from a servlet to another resource

(servlet, JSP file, or HTML file) on the server.

public void forward(ServletRequest request,ServletResponse response)

RequestDispatcher in Servlet

29COMP9321, 17s2, Week 2

• The RequestDispatcher interface provides the facility of dispatching the request to another resource, e.g., servlet, jsp, or html.

• This interface can also be used to include the content of another resource also.• It is one of the way of servlet collaboration.

http://www.javatpoint.com/

The RequestDispatcher interface provides two methods: forward and include• Include: Includes the content of a resource (servlet, JSP page, or HTML file)

in the response.

public void include(ServletRequest request,ServletResponse response)

Attributes and Sharing Attributes

30COMP9321, 17s2, Week 2

Who has access to the board and how long does it live?

31COMP9321, 17s2, Week 2

Attributes API

32COMP9321, 17s2, Week 2

HeadFirst, p. 189The return type for attributes is an Object, whereas the return type for a parameter is a String.

Request attributes and Request dispatching

33COMP9321, 17s2, Week 2

Managing the User State

34COMP9321, 17s2, Week 2

Managing the User State

35COMP9321, 17s2, Week 2

A problem in HTTP request/response:• HTTP is a stateless protocol.

• A single request/response;• Nothing is remembered 'between requests' from the same user;

• Web applications need to maintain users + their data.

It is a programmer's responsibility:• The term "session" is used to represent the data associated with one user while

she navigates around a Web application.• Session is a conversional state between client and server.• Session can consists of multiple request and response between client and server.• Since HTTP is stateless, the only way to maintain a session is when some unique

information about the session (session id) is passed between server and client in every request and response.

Session Management

36COMP9321, 17s2, Week 2

same-as

Session Management

37COMP9321, 17s2, Week 2

Session Management

38COMP9321, 17s2, Week 2

URL Rewriting

39COMP9321, 17s2, Week 2

HTML hidden fields

40COMP9321, 17s2, Week 2

Cookies

41COMP9321, 17s2, Week 2

• Cookies are text files stored on the client computer and they are kept for various information tracking purpose.

• Java Servlets transparently supports HTTP cookies.

• There are three steps involved in identifying returning users:• Server script sends a set of cookies to the browser. e.g. session id• Browser stores this information on local machine for future use.• Next time, browser sends request + those cookies to the server

and server uses that information to identify the user.

Cookies

42COMP9321, 17s2, Week 2

The Anatomy of a Cookie:• Cookies are usually set in an HTTP header.• JavaScript can also set a cookie directly on a browser.• A servlet that sets a cookie might send headers that look something like this:

HTTP/1.1 200 OKDate: Mon, 03 Aug 2015 17:03:38 GMTServer: Apache…Set-Cookie: name=xyz; expires=Monday, 03-Aug-15 22:00:00 GMT;

path=/; domain=comp9321.comConnection: closeContent-Type: text/html

• Set-Cookie header contains a name value pair, a GMT date, a path and a domain.

• The name and value will be URL encoded.

• Expires field is an instruction to the browser to "forget" the cookie after the given time/date.

Servlet Cookies Methods

43COMP9321, 17s2, Week 2

Method Name Method Description

setDomain() sets the domain to which cookie applies, for example comp9321.com.

getDomain() gets the domain to which cookie applies, for example comp9321.com.

setMaxAge() sets how much time (in seconds) should elapse before the cookie expires. If you don't set this, the cookie will last only for the current session.

getMaxAge() returns the maximum age of the cookie, specified in seconds, By default, -1 indicating the cookie will persist until browser shutdown.

getName() returns the name of the cookie. The name cannot be changed after creation.

setValue() sets the value associated with the cookie.

getValue() gets the value associated with the cookie.

setPath() sets the path to which this cookie applies. If you don't specify a path, the cookie is returned for all URLs in the same directory as the current page as well as all subdirectories.

getPath() gets the path to which this cookie applies.

setSecure() sets the boolean value indicating whether the cookie should only be sent over encrypted (i.e. SSL) connections.

setComment() specifies a comment that describes a cookie's purpose. The comment is useful if the browser presents the cookie to the user.

getComment() returns the comment describing the purpose of this cookie, or null if the cookie has no comment.

http://www.tutorialspoint.com/servlets/

Setting Cookies with Servlet

44COMP9321, 17s2, Week 2

Setting cookies with servlet involves three steps:

1. Creating a Cookie object:

Keep in mind, neither the name nor the value should contain white space or any of the following characters: [ ] ( ) = , " / ? @ : ;

2. Setting the maximum age (in seconds):

3. Sending the Cookie into the HTTP response headers

Cookie cookie = new Cookie("key","value");

cookie.setMaxAge(60*60*24);

response.addCookie(cookie);

http://www.tutorialspoint.com/servlets/

HTTP Sessions with JSESSIONID cookie

45COMP9321, 17s2, Week 2

HTTP Sessions Interface

46COMP9321, 17s2, Week 2

An example of using HttpSession object: the scenario

47COMP9321, 17s2, Week 2

The Journey Object

48COMP9321, 17s2, Week 2

Using a Journey Object

49COMP9321, 17s2, Week 2

How session tracking works ...

50COMP9321, 17s2, Week 2

Getting rid of Sessions

51COMP9321, 17s2, Week 2

Servlets ...

52COMP9321, 17s2, Week 2

Servlet Examples!

53COMP9321, 17s2, Week 2

Installing Apache Tomcat…

54COMP9321, 17s2, Week 2

download

unzip


55COMP9321, 17s2, Week 2

Next: Verifying Tomcat's Java Dependencies

Tomcat 8.0 requires Java 7 or later …

System variables: “Java_Home”

How to Set JAVA_HOME environment variable onMacWindows…

Didn’t set? thenGoogle

Check

Notice: we use JDK (not JRE) as we like to experiment and make changes to the example servlets, so we need to compile Java code in the servlets and produce .class files …


56COMP9321, 17s2, Week 2

e.g. in Windows …

click

Start and Stop Tomcat

57COMP9321, 17s2, Week 2

Start and Stop Tomcat

58COMP9321, 17s2, Week 2

Servlet Examples

59COMP9321, 17s2, Week 2

• Download the Servlet-Example zip file

• Unzip and copy the folder under “webapps” folder

Servlet Examples

60COMP9321, 17s2, Week 2

Servlet Examples: Hello World

61COMP9321, 17s2, Week 2

Servlet Examples: Request Info

62COMP9321, 17s2, Week 2

Servlet Examples: Request Headers

63COMP9321, 17s2, Week 2

Other Examples, LAB

64COMP9321, 17s2, Week 2

65COMP9321, 17s2, Week 2

comp9321 web application engineeringcs9321/17s2/lectures/lec02/lec-02.pdfpresentation layer...

Documents