labguide presentation tier ed113a day1

INTERNAL

Lab Guide for Presentation tier using JSP and JSF

Author(s) Yuvarani Meiyappan

Authorized by Srikantan Moorthy

Creation/Revision Date Jun-2010

Version 1.1

COPYRIGHT NOTICE

All ideas and information contained in this document are the intellectual property of

Education and Research Department, Infosys Technologies Limited. This document is not for

general distribution and is meant for use only for the person they are specifically issued to.

This document shall not be loaned to anyone, within or outside Infosys, including its

customers. Copying or unauthorized distribution of this document, in any form or means

including electronic, mechanical, photocopying or otherwise is illegal.

Education and Research Department

Infosys Technologies Limited

Electronic City

Hosur Road

Bangalore - 561 229, India.

Tel: 91 80 852 0261-270

Fax: 91 80 852 0362

www.infy.com

mailto:E&[email protected]
http://www.infy.com/mailto:E&[email protected]

Infosys Technologies Limited Document Revision History

ER/CORP/CRS/ED113A/007 Version No: 1.1 i

Document Revision History

Version Date Author(s) Reviewer(s) Comments

1.0 Jun-2009 Vaishali S Mudkhedkar

Raoke

Initial Draft

1.1 Jun 2010 Shashidhar H Basavaraju Yuvarani

Meiyappan

Infosys Technologies Limited Table of Contents

ER/CORP/CRS/ED113A/007 Version No. 1.1 ii

Contents

COPYRIGHT NOTICE ...................................................................................................... II

DOCUMENT REVISION HISTORY ......................................................................................... I

CONTENTS .................................................................................................................. II

CONTEXT ................................................................................................................... 1

DAY 1 ASSIGNMENTS ..................................................................................................... 1

ASSIGNMENT 1: DEVELOPING WEB APPLICATION WITH ECLIPSE ............................................................. 1

ASSIGNMENT 2: DEVELOP GENERIC AND HTTP SERVLETS AND LEARN THE SERVLET LIFECYCLE ............................ 13

ASSIGNMENT 3: DEVELOP A SERVLET, DEPLOY IT ON TOMCAT WEB CONTAINER, AND ACCESS IT THROUGH HTML ......... 24

ASSIGNMENT 4: EXPORTING THE PROJECT INTO A WAR AND CREATING THE MANUAL DEPLOYMENT FOR TOMCAT WEB

CONTAINER ............................................................................................................... 26

ASSIGNMENT 5: DEVELOPING WEB APPLICATION USING SERVLETS AND DEPLOYING IT ON TOMCAT WEB CONTAINER, IN

ABSENCE OF IDE .......................................................................................................... 30

SELF REVIEW QUESTIONS ................................................................................................. 39

Infosys Technologies Limited Lab Guide for Presentation tier using JSP and JSF

ER/CORP/CRS/ED113A/007 Version No. 1.1 1

Context

This document contains assignments to be completed as part of the hands on for the subject

Presentation tier using JSP and JSF (Course code: ED113A).

Note: In order to complete the course, assignments in this document must be completed in the

sequence mentioned.

Day 1 Assignments

Assignment 1: Developing Web Application with Eclipse

Objective: To understand how to develop and deploy a simple web application using Eclipse.

Problem Description: Develop a simple web application using Eclipse.

Estimated time: 30 Min

Theory: IDEs (Integrated Development Environment) help us in developing and deploying web

applications easily.

IDE provides environment, which facilitates creation, compilation/building (compiling) and

deploying of the web application on click of a button.

Eclipse is one such IDE, which is open source and most popularly used in Java web application

development. We will use Eclipse Ganymede V3.4.2 in our hands on.It has built-in editor,

debugger, compiler and Auto deployment capability (Run on Server) under one umbrella.

Other popular IDEs are NetBeans, JDeveloper, etc

Step 1: Let us build our first web application using eclipse. Create a new workspace, say

PresentationTier.



Step 2: Now Eclipse is opened up with the below welcome screen. It provides you with many icons

to use how to help facility. Close this window. You will see the Eclipse opened in Java

perspective; change it to Java EE perspective. Till now, you were working in Java perspective,

from this course, you will be using Java EE perspective, as in this perspective, you will find all the

required tools required to develop and deploy web applications/enterprise application.



Step 3: Let us add server to the perspective. We can do that many ways. Let us do it in the easiest

way. Right click on the server tab, as shown in the screen shot. It will open up a dialog box, which

is a wizard to add a new server. Many servers are listed, locate Apache - > Tomcat v6.0 server

Note: We are going to add Tomcat 6.0 server, but the same steps could be

used to add JBoss Application Server. It is under JBoss -> JBoss v5.0

On your systems, Tomcat would be located through softgrid. So to select the

installation directory, browse through Computer -> SoftGrid (Q:) ->

JBOSS.002 -> Soft ->tomcat 6



So, after selecting Tomcat v6.0 server, click on Next button. You get the below screen shot, as you

are performing this activity for the first time.



Now we will select the Application Server Directory, by clicking Browse button. Locate your

servers installation directory, as already mentioned in first assignment, our Tomcat 6.0

installation directory is D:\Program Files\Apache Software Foundation\Tomcat 6.0

On your systems, Tomcat would be located through softgrid. So to select the installation directory,

browse through Computer -> SoftGrid (Q:) -> JBOSS.002 -> Soft ->tomcat 6



Click on OK, and then Finish. Now you see a server is added to the Server tab. There on the same

tab you see a small green arrow button, this is to start the server. A small rectangle red button is

to stop the server.

Now let us create a web application.

Step 4: In order to create web application, choose Dynamic Web Project as shown below:

File -> New -> Dynamic Web Project

It opens up a wizard, which helps to create a new dynamic web project. Provide a name to your

project. Screen shots are given on next page

Note: Project Name should not have spaces in it. It should not start with

digits. Here, we have given, ServletDemoOne, as project name



Note: Observe the web application folder structure created.

Root folder is Application folder (ServletDemoOne), which has src,

WebContent sub-folders. All the packaged classes, having business logic need

to be under src folder. Resources which you want to publish - like html

pages, JSP pages, need to be stored under WebContent folder. Apart from

these, this folder contains WEB-INF sub-folder. Contents of WEB-INF are not

visible to user. It contains web.xml, the deployment descriptor and lib sub-

folder. All the library files required for your web application like,

classes12.jar, servlet-api.jar should be kept under the lib folder.



Step 5: Let us create a Servlet named, ClientBrowserInfoServlet. Right Click on the Application

Folder name. Select New->Servlet, a wizard will open up, wherein you need to give name of the

class (ClientBrowserInfoServlet), and the package in which you need to create it.



Click on Next, and you will be prompted with next dialog box as below:

Here you can enter servlet deployment descriptor specific information. We can provide description

for our servlet, initialization parameters, if any. We are going to change the URL Mappings, we

want user to access this servlet using /info url appended to

http://localhost:8080/ServletDemoOne

i.e. in order to access our servlet, the URL would be

http://localhost:8080/ServletDemoOne/info

Click on Finish, and then add the business logic, to create the dynamic content in the servlet class.

Business Logic: We are going to display the browser specific details, received by the server

through HttpServletRequest object.



Open web.xml, observe the and tags added. In

tag, make change as per below:

This tag specifies the default page to be displayed when this web application is accessed.

Step 6: Create a Home.html page which has been configured to run on start of this web application

in the previous step.

ClientBrowserInfoServlet.java package com.infy.enr.servlets;

import java.io.IOException;

import java.io.PrintWriter;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

/**

* Servlet implementation class ClientBrowserInfoServlet

*/

public class ClientBrowserInfoServlet extends HttpServlet {

private static final long serialVersionUID = 1L;

/**

* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse

response)

*/

protected void doGet(HttpServletRequest request, HttpServletResponse

response) throws ServletException, IOException {

PrintWriter out = response.getWriter();

response.setContentType("text/html");

out.print("Servlet gives Browser Information

");

out.print("User-Agent:"+request.getHeader("User-Agent")+"

");

out.print("Accept-Language:"+request.getHeader("Accept-Language") +"

");

out.print("Can accept data of mime type:" +request.getHeader("Accept")

+"
");

out.print("");

}

}

home.html



Home.html is a simple page with a hyper link with the url pattern info in the href (as

shown in the screenshot).

Step 7: To deploy/publish this web application, right click on the project and select Run As Run

on Server.

Complete the wizard and click on Finish. You can see the following output.



Clicking on the link, you are trying to access the servlet

Observe the url in the browser address bar and the contents of the response page.

Summary of this assignment:

You have just learnt:

To create, and deploy a simple dynamic web project having html and servlet in Eclipse IDE.



Assignment 2: Develop Generic and HTTP servlets and learn the Servlet

Lifecycle

Objective: To understand the Generic and HTTP servlet lifecycle.

Problem Description: Develop Generic and HTTP servlets and understand the lifecycle of the servlets. Estimated time: 20 Min.

Artifacts to be developed:

1. ServletHome.html

2. GenServletDemo.html

3. HttpServletDemo.html

4. GenServletDemo.java GenericServlet (javax.servlet.GenericServlet)

5. HttpServletDemo.java HTTPServlet (javax.servlet.http.HttpServlet)

6. web.xml the deployment descriptor

Step 1: Create a new dynamic web project ServletDemo as in Assignment 1



Do remember to include servlet-api.jar in the lib folder

Step 2: Create the html pages listed below



1. ServletHome.html

ServletHome.html

Servlet Home

Generic Servlet Demo

HTTP Servlet Demo



2. GenServletDemo.html

GenServletDemo.html



GET method form

Name:

Take a look @ the url after

submit

POST method form

Name:



3. HttpServletDemo.html

HttpServletDemo.html

HTTP Servlet Demo

HTTP Servlet Demo

GET method form

Name:

Take a look @ the url after submit

POST method form

Name:



Step 3: Create GenericServlet: GenServletDemo.java that implements javax.servlet.GenericServlet



Once the servlet is created, type in the code as below

GenServlet.java

package com.infy.enr.servlets;



import javax.servlet.GenericServlet;

import javax.servlet.Servlet;

import javax.servlet.ServletConfig;


import javax.servlet.ServletRequest;

import javax.servlet.ServletResponse;

// continued



// continued

public class GenServletDemo extends GenericServlet implements Servlet {


public GenServletDemo() {

super();

System.out.println("-----------------------------------------------");

System.out.println("GenServletDemo:Constructor, Object created");

System.out.println("Memory is allocated to the GenServlet in the

heap");


}

public void init(ServletConfig config) throws ServletException {


System.out.println("GenServletDemo: init");


}

public void destroy() {


System.out.println("GenServletDemo: destroy");

System.out.println("GenServlet has no more presence in the heap");


}

public void service(ServletRequest request, ServletResponse response)

throws ServletException, IOException {

//HTTP request will run this method irrespective of the POST or

GET method


System.out.println("GenServletDemo: service");

System.out.println("Servicing the request");



out.println("");

out.println("Hello, "+ request.getParameter("name")+" welcome to

GenServletDemo, service!!");

out.println("
Go back!!");

out.println("");

}

}



Step 4: Create HTTPServlet: HttpServletDemo.java that implements javax.servlet.GenericServlet

Once the servlet is created, type in the code as below



HttpServletDemo.java

package com.infy.enr.servlets;



import javax.servlet.ServletConfig;





public class HttpServletDemo extends HttpServlet {


public HttpServletDemo() {

super();


System.out.println("HttpServletDemo: Constructor");

System.out.println("Servlet created");


}

public void init(ServletConfig config) throws ServletException {


System.out.println("HttpServletDemo: init");


}

public void destroy() {


System.out.println("HttpServletDemo: destroy");


}

// continued



// continued

protected void doGet(HttpServletRequest request, HttpServletResponse



System.out.println("HTTP request type: GET");



out.println("");

out.println("HttpServlet: GET service method");

out.println("Take a look into the server console to user stand the

servlet life cycle");

out.println("
Go back!!");

out.println("");

}

protected void doPost(HttpServletRequest request, HttpServletResponse



System.out.println("HTTP request type: POST");



out.println("");

out.println("HttpServlet: POST service method");

out.println("Take a look into the server console to user stand the

servlet life cycle");

out.println("
Go back!!");

out.println("");

}

}



Step 4: web.xml should have the following servlet description as shown in the picture below

Step 5: Run the project and analyze the output.

Assignment 3: Develop a servlet, deploy it on Tomcat web container, and

access it through HTML

Objective:

To develop, deploy and access a servlet in a web application

Problem Description: Infy Bank needs to authenticate the users based on their roles. The Infy Bank

login page should accept the details (username and password) from the user. The details should be

accepted in a HTML form and submitted to Login Servlet. The Login Servlet should validate the role

of the user and display the homepage links as per the role of the user given below:

o If username is admin, links are: Add Account, Display Account Details.

o If username is staff, links are: Display Account Details

o If username is customer, links are: Display Account Details, Modify account

o If any other value is sent for username than above usernames, display error message

Invalid username! Login failed

Note: The username and password could be hardcoded in a collection object

(in Login Servlet) for simplicity which will be usually checked against the

database records for Login credentials



Estimated time: 20 Min.

Artifacts to be developed:

7. loginForm.html

8. LoginServlet.java


Expected output:

On click of Login Button, LoginServlet will be invoked.



Assignment 4: Exporting the project into a WAR and creating the manual

deployment for Tomcat web container

Objective:

To have a visual understanding of the deployment folder structure

Theory:

Deployment is process of installing a web application on to web container / application server.

Here we are going to use a web container; Tomcat 6.0 for first two assignments.

Web application could be deployed in various ways:

1. Statically, web application is deployed before server startup

2. Dynamically, web application is deployed after server startup

In this assignment, we are going to perform it statically.

Web application could be deployed in the Web ARchive (WAR) format or in exploded format.

Procedure: Consider the web project done in Assignment 1

Step 1: Export the project as WAR. Right-click on the project ServletDemoOne and select Export ->

WAR file.

On selecting Export -> WAR file you will get the following screen



Step 2: Choose the destination to place the created .war file by clicking on Browse and choosing

the desired path on your hard drive.



Note: Make sure you check the Export source files, if you want the all the

.java source files to be added to the archive which comes under

folder in eclipse.

Step 3: Once done open the command prompt, go to the destination folder where the .war file is

created and type the command jar xvf ServletDemoOne.war

Step 4: Now navigate to the folder where you have created the deployment on the drive you will

see the files created in the following folder structure.



We can deploy the application by copying the files into the root folder of the application

server (tomcat 6.0) as shown below

Step 5: Start the server and access the corresponding URL.



Assignment 5: Developing web application using servlets and deploying it

on Tomcat web container, in absence of IDE

Objective:

To develop a web application using servlets

To understand the folder structure of a Java EE web application and deploy it on a web

container (such as Tomcat 6 or 5.5)

Note : This assignment is for your study reference only. You may not be able to implement it as access to web containers (Tomcat) folder hierarchy is not given to you directly.

Problem Description: Infy Bank needs to authenticate the users based on their roles. The Infy Bank

login page should accept the details (username and password) from the user. The details should be

accepted in a HTML form and submitted to Login Servlet. The Login Servlet should validate the role

of the user and display the homepage links as per the role of the user given below:

o If username is admin, links are: Add Account, Display Account Details.

o If username is staff, links are: Display Account Details

o If username is customer, links are: Display Account Details, Modify account

o If any other value is sent for username than above usernames, display error message

Invalid username! Login failed

Note: The username and password are hardcoded (in Login Servlet) for

simplicity which will be usually checked against the database records for

Login credentials

Estimated time: 40 Min.

Theory:

Deployment is process of installing a web application on to web container / application server.

Here we are going to use a web container; Tomcat 6.0 for first two assignments.

Web application could be deployed in various ways:

3. Statically, web application is deployed before server startup

4. Dynamically, web application is deployed after server startup

In this assignment, we are going to perform it statically.

Web application could be deployed in the Web ARchive (WAR) format or in exploded format.

Artifacts to be developed (Use Textpad/Notepad editor to develop the artifacts)

10. loginForm.html

11. LoginServlet.java




The typical web application folder structure is as shown below:

Step 1: Create loginForm.html as shown

loginForm.html

Login Page

Enter Login Details

UserName

Password



Step 2: Create LoginServlet.java as shown

LoginServlet.java

package edu.infy.servlets;



import java.util.ArrayList;





public class LoginServlet extends HttpServlet

{

StringBuffer message = new StringBuffer();

ArrayList names;

public LoginServlet()

{

super();

names = new ArrayList();

names.add("Admin");

names.add("Staff");

names.add("Customer");

}

protected void doPost(HttpServletRequest request,

HttpServletResponse response)throws ServletException, IOException

{

String username = request.getParameter("username");

if((username == null) || (username.length()==0))

{

message.append("Username required field");

}

else

{

validate(username);

}

response.setContentType("text/html");


out.println("Login Page"+

"" "+ message+" " +

"");

}

Continued on next page



Step 3: Create web.xml as shown

LoginServlet continued

private void validate(String name)

{

if(message.length()!=0)

{

message.delete(0, message.length());

}

if(names.contains(name))

{

String msg = "Hello "+name+" !!!. Login successful
";

if(name.equalsIgnoreCase("admin"))

{

message.append(msg + "
");

message.append("Add

Account
");

message.append("

Display Account
");

}

else if (name.equalsIgnoreCase("staff"))

{

message.append("

Display Account
");

}

else if (name.equalsIgnoreCase("customer"))

{

message.append("

Display Account
");

message.append("

Modify Account
");

}

}

else {

message.append("Hello guest! Login is invalid...");

}

}

}

web.xml (elements of web.xml are discussed in Day 1 slides)

ServletDemoManual



web.xml continued

Simple Login

Login

Login

edu.infy.servlets.LoginServlet

Login

/Login

loginForm.html

Step 4: Create the folder structure as shown below

Step 5: Compiling Servlet

We have created ServletDemoManual folder in D:\



You need to create it in your local machine, where you are able to create folders.

Consider the Tomcat installation directory is in

D:\Program Files\Apache Software Foundation\Tomcat 6.0

It has a servlet-api.jar file in its lib folder, which needs to be in classpath, as it contains all

the classes and interfaces required for servlet development.

Compile the packaged servlet, as below:

On below command prompt execute the command:

D:\ServletDemoManual\WEB-INF\src\edu\infy\servlets>

javac classpath .;D:\Program Files\Apache Software Foundation\Tomcat

6.0\lib\servlet-api.jar d D:\ServletDemoManual\WEB-INF\classes LoginServlet.java

Considering you already know, how to compile .java files into .class file, we are just re-

iterating the above command components.

javac : java compiler command

-classpath classpath: option to specify the classpath to use when you run javac command,

it overrides CLASSPATH environment variable

-d directory: option to set the destination directory for class files

So after this command, see your folder structure again. In the classes folder,

LoginServlet.class file would be created in the proper directory structure.

Step 6: Our web application is ready to deploy. We are going to deploy this web application in the

exploded format.

Locate webapps folder in the tomcat installation directory.

In our machine, it is D:\Program Files\Apache Software Foundation\Tomcat

6.0\webapps

Step 7: Copy the ServletDemoManual folder into webapps folder

Thats it!!! copying is done, now the application is ready for deployment



Step 8: Now start the server.

Locate the bin folder in tomcat installation directory, and double click on tomcat6 icon

(Service Runner). One command prompt window will open up, and you can see, tomcat

server running. DO NOT CLOSE THIS WINDOW. [If you close this window, Server will stop

working.]

Let us test, whether Server is running or not!!!

Running Server

1) Hope same window is displayed on your machines screen.

2) Open Internet Explorer / Mozilla browser, and type:

http://localhost:8080

Our tomcat server is configured on 8090 port.

So we will type: http://localhost:8090
http://localhost:8080/http://localhost:8090/



If you are getting any of the above screens, which means tomcat server is running in your

system.

Step 9: Let us execute our web application.

Web applications are accessed using web browsers. So, open browser and type below link:

http://localhost:8080/ServletDemoManual

On click of Login Button, LoginServlet will be invoked.
http://localhost:8080/ServletDemoManual



Step 7: Test the application for all testcases, such as: username as Staff, Customer and other

than, the given 3. And see the result. We have not added more functionality to our web

application, hence if you try to click on any of the Add Account, Display Account or Modify

Account link, it will result in the Page Not Found error (Status code 404).

Why this error?

This is because all these resources are not present in our web application folder which is

deployed on to the server.

Observation: Once you deploy your application on Tomcat (i.e. copying of the web

application folder in webapps folder in tomcat installation directory), and you start the

server, open the tomcat installation directory and locate the below folder in it:

work\Catalina\localhost

What did you find there?

It has the copy of your web application folder, which is accessed / executed, when you

request for the web application using web browser.

Summary of this assignment:

You have just learnt:

To develop a simple web application using servlet and deploy it on the web container,

Tomcat 6; in the absence of sophisticated IDE.

The web application folder structure



Self Review Questions

1. Consider we have created a Servlet named BuyProduct.java in servlets package of web

application folder, which performs online transaction when user wants to buy a product

through your web application. In which file of web application folder, will you describe

about your Servlet?

2. In order to describe the servlet, which tags need to be used in deployment descriptor file?

What is the name of deployment descriptor of web application? Can you give any other

name to the deployment descriptor? Or is web.xml a mandatory name?

3. If my servlet is described in web.xml with following tags:

buy bp servlets.BuyProduct bp /buyonline

How will we write a URL to access it?

Consider, the Application name is OnlineStore, and deployed on http://localhost:8080

Consider, we have a html page buyProductForm.html, which displays all required

field details to be accepted from user for this transaction, on click of a button this

servlet needs to be invoked. How will we perform this functionality?

If in the form, if we want to post the data in the body of the Http Request, how will

we ensure this functionality?

If we are posting the data through POST method, and if we do not implement

doPost() method in the HttpServlet, what will happen?

labguide presentation tier ed113a day1

Documents

jsf ercorpcrsed113a007

tomcat web container

web application

subject presentation

contents copyright notice

jsf authors yuvarani

jsf course code

http servlets