Web Technology

Unit- III
Topic:
Servlets, XML & Ajax-
 Syllabus

Servlet:
XML:
● Servlet architecture overview,
● XML documents and
● Servlet life cycle,
vocabularies,
● A “Hello World” servlet, AJAX:
● XML declaration,
● Servlets generating dynamic content,
● XML Introduction,
● Namespaces,
● parameter data,
● DOM ● based
Working
XMLofprocessing,
AJAX.
● sessions, cookies, URL rewriting,
● transforming XML documents,
● other Servlet capabilities,
● DTD: Schema, elements,
● data storage, Servlets concurrency,
attributes.
databases (MySQL) and Java Servlets.
Servlets
Java Servlets

Servlet

Server Side Dynamic Database

Scripting Operations
Language are possible
 What are Servlets?

● Java Servlets are programs that run on a Web or Application server and act as a middle
layer between a requests coming from a Web browser or other HTTP client and databases
or applications on the HTTP server.

● Using Servlets, you can collect input from users through web page forms, present records
from a database or another source, and create web pages dynamically.
Servlets Architecture
 Servlet Life Cycle Diagram

First the HTTP requests coming to the

server are delegated to the servlet
container.

The servlet container loads the servlet

before invoking the service() method.

Then the servlet container handles multiple

requests by spawning multiple threads,
each thread executing the service() method
 Servlet Life Cycle

● The servlet is initialized by calling the init() method.

● The servlet calls service() method to process a client's request.
● The servlet is terminated by calling the destroy() method.
● Finally, servlet is garbage collected by the garbage collector of the JVM
 The init() Method

● The init method is called only once.

● It is called only when the servlet is created, and not called for any user requests afterwards.
● So, it is used for one-time initializations.
● When a user invokes a servlet, a single instance of each servlet gets created, with each user request resulting in
a new thread that is handed off to doGet or doPost as appropriate.
● The init() method simply creates or loads some data that will be used throughout the life of the servlet.
● The init method definition looks like this −
public void init() throws ServletException {
// Initialization code… }
 The service() Method

● The service() method is the main method to perform the actual task.
● The servlet container (i.e. web server) calls the service() method to handle requests coming from the client(
browsers) and to write the response back to the client.
● When server receives a request for a servlet, the service() method checks the HTTP request type (GET, POST)
and calls doGet, doPost, methods as appropriate.

● Here is the signature of this method −

public void service(ServletRequest request, ServletResponse response)
throws ServletException, IOException { }
 The doGet() Method

● A GET request results from a normal request for a URL or from an HTML form that has no
METHOD specified and it should be handled by doGet() method.

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {
// Servlet code
}
The doPost() Method

A POST request results from an HTML form that specifically lists POST as the
METHOD and it should be handled by doPost() method.

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {
// Servlet code
}
 The destroy() Method

● The destroy() method is called only once at the end of the life cycle of a servlet.
● This method gives your servlet a chance to close database connections, halt background threads, and
perform other such cleanup activities.
● After the destroy() method is called, the servlet object is marked for garbage collection.

● The destroy method definition looks like this −

public void destroy() {

// Finalization code...
}
 Example 1-
To Print Hello World directly

import java.io.*;
import javax.servlet.*; {
import javax.servlet.http.*; response.setContentType("text/html");
public class HelloWorld extends HttpServlet { PrintWriter out = response.getWriter();
out.println("<h1> Hello World </h1>");
public void init() throws ServletException { } }
public void destroy() { }
}
public void doGet(HttpServletRequest request,
HttpServletResponse response) throws
ServletException, IOException
 Reading Form Data using Servlet

● getParameter() − You call request.getParameter() method to get the value

of a form parameter.

● getParameterValues() − Call this method if the parameter appears more

than once and returns multiple values, for example checkbox.

● getParameterNames() − Call this method if you want a complete list of all

parameters in the current request.
Example 2-
To read data from HTML file and print that .

● It requires 2 files:
○ 1. HTML (s1.html)File
○ 2. Servlet (s2.java) File

● First Run HTML file and after clicking on submit button it will run
servel(.java) file.
Example 2-
To read data from HTML file and print that .
S1.html (html code)
<html>
<form method=“post” action=“s2”>
Enter Your Name
<input type=text name=“t1”>
<br>
<input type=“submit” value=“submit”>
</form>
</body>
</html>
Example 2-
To read data from HTML file and print that .
S2.java (Servlet Code)
import java.io.*;
import javax.servlet.*;
public class s2 extends HttpServlet {
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
response.setContentType("text/html");
String a= request.getParameter("t1");
PrintWriter out= response.getWriter();
out.print("<br>Your Name is: "+a);
}
}
Session Tracking (Management)

● Session Tracking is a way to maintain state (data) of an user. It is also known as session management
in servlet.
● Http protocol is a stateless so we need to maintain state using session tracking techniques.
● Each time user requests to the server, server treats the request as the new request.
● So we need to maintain the state of an user to recognize to particular user.

● Why use Session Tracking?

● To recognize the user It is used to recognize the particular user.
Session Tracking Techniques

Cookies
Hidden Form Field
URL Rewriting
HttpSession
Session Tracking- Using Cookies

● A cookie is a small piece of information that is persisted between the multiple client requests.
● A cookie has a name, a single value, and optional attributes such as a comment, path and
domain qualifiers, a maximum age, and a version number.
● How Cookie works
○ In cookies technique, we add cookie with response from the servlet. So cookie is stored in the cache
of the browser. After that if request is sent by the user, cookie is added with request by default. Thus,
we recognize the user as the old user.
Session Tracking- Using Cookies

● Types of Cookie
○ Non-persistent cookie
○ Persistent cookie
● Non-persistent cookie
○ It is valid for single session only. It is removed each time when user closes the browser.
● Persistent cookie
○ It is valid for multiple session . It is not removed each time when user closes the browser.
It is removed only if user logout or sign out.
Session Tracking- Using Cookies

● Advantage of Cookies
○ Simplest technique of maintaining the state.
○ Cookies are maintained at client side.
● Disadvantage of Cookies
○ It will not work if cookie is disabled from the browser.
○ Only textual information can be set in Cookie object.
 Session Tracking- Using Cookies

Useful Methods of Cookie class

Method Description
Sets the maximum age of the cookie in
public void setMaxAge(int expiry)
seconds.
Returns the name of the cookie. The name
public String getName()
cannot be changed after creation.
public String getValue() Returns the value of the cookie.
public void setName(String name) changes the name of the cookie.
public void setValue(String value) changes the value of the cookie.
 Session Tracking- Using Cookies

● How to create Cookie?

Cookie ck=new Cookie("user","sonu"); //creating cookie object  
response.addCookie(ck); //adding cookie in the response  
 Session Tracking- Using Cookies

● How to delete Cookie?

Cookie ck=new Cookie("user","") ;//deleting value of cookie  
ck.setMaxAge(0); //changing the maximum age to 0 seconds  
response.addCookie(ck); //adding cookie in the response  
 Session Tracking- Using Cookies

● How to get Cookies?

Cookie ck[]=request.getCookies();  
for(int i=0; i<ck.length; i++){  
 out.print("<br>"+ck[i].getName()+" "+ck[i].getValue());
//printing name and value of cookie  
}  
Session Tracking- Using Cookies Simple example of
Servlet Cookies
Session Tracking- Using Cookies Simple example of
Servlet Cookies

? index.html

<form action="servlet1" method="post">

Name:<input type="text" name="userName"/><br/>
<input type="submit" value="go"/>
</form>
Session Tracking- Using Cookies Simple example of
Servlet Cookies
Servlet1.java
     try{  
     String n=request.getParameter("userName");  
    out.print("Welcome "+n);  
     Cookie ck=new Cookie("uname",n); //creating cookie object  
    response.addCookie(ck); //adding cookie in the response  
    
  //creating submit button  
    out.print("<form action='servlet2'>");  
    out.print("<input type='submit' value='go'>");  
    out.print("</form>");  
     out.close();  
   }
 Session Tracking- Using Cookies Simple example of
Servlet Cookies

Servlet2.java

{  
    response.setContentType("text/html");  
    PrintWriter out = response.getWriter();  
      
    Cookie ck[]=request.getCookies();  
    out.print("Hello "+ck[0].getValue());  
  
    out.close();  
    }
 Session Tracking- URL Rewriting
● If the client has disabled cookies in the browser then session management using cookie wont work.
● In that case URL Rewriting can be used as a backup. URL rewriting will always work.
● In URL rewriting, a token(parameter) is added at the end of the URL.
● The token consist of name/value pair separated by an equal(=) sign.
● For Example:
 Session Tracking- URL Rewriting
● When the User clicks on the URL having parameters, the request goes to the Web Container with extra bit of
information at the end of URL.
● The Web Container will fetch the extra part of the requested URL and use it for session management.
● The getParameter() method is used to get the parameter value at the server side.
● Advantage of URL Rewriting
○ It will always work whether cookie is disabled or not (browser independent).
○ Extra form submission is not required on each pages.
● Disadvantage of URL Rewriting
○ It will work only with links.
○ It can send only textual information.
 Session Tracking- URL Rewriting

index.html

<form method="post" action="validate">

Name:<input type="text" name="user" /><br/>
Password:<input type="text" name="pass" ><br/>
<input type="submit" value="submit">
</form>
 Session Tracking- URL Rewriting

Validate.java

{
response.setContentType("text/html;charset=UTF-8");
String name = request.getParameter("user");
String pass = request.getParameter("pass");
if(pass.equals("1234")) {
response.sendRedirect("First?user_name="+name+"");
}
 Session Tracking- URL Rewriting

First.java
{
response.setContentType("text/html;charset=UTF-8");
PrintWriter out = response.getWriter();
String user = request.getParameter("user_name");
out.println("Welcome "+user);
}
}
Servlet- Data Storage

● Almost all web applications (servlets or related dynamic

web server software) store and retrieve data –
○ Typical web app uses a data base management
system (DBMS)
○ Another option is to use the file system
Servlet: Concurracy-
https://docplayer.net/215469659-Data-storage-servlets-and-concurrency.html

One common web application problem: concurrency

 Servlet: Concurracy
Concurrency means multiple computations are happening at the same time.
•Ex: Web browser loading several images at the same time, or web browser can respond
to your mouse clicks while it is still downloading information from a web server are
examples of concurrent processing in action on the client side.
•On a server side, multiple requests to the same servlet may be executed at the same
time. So concurrency container or web server is multithreaded.
Servlet: Concurracy
● A thread is a single execution process.
● It is a basic unit of CPU utilization, consisting of own program
counter, a stack, and a set of registers.
● A program is multithreaded when multiple threads execute a
single instance of a program.
Servlet: Concurracy
Threading Issues

● Two threads running in

HelloCounter
concurrently.
● The initial value of visits
is assumed to be 17.
 Thread Synchronization

● A servlet must be capable of serving more than one client at a time.

● If several clients issue requests at the same time, methods will serve each client in
a different thread.
● service( ), doGet( ), and doPost( ) can handle many concurrent clients.
● It uses lock mechanism to synchronize the threads.
Web Technology
Unit- III
Topic:
XML- Extensible Markup Language
XML

XML

Extensible Markup Language

XML Properties

XML is platform &

XML is a markup XML was designed to programming language
language be self-descriptive independent.

XML was designed to

XML is a W3C
XML focuses on data store and transport
Recommendation
data
 Why we need XML?

Machine-1 Machine-2 Machine-3 Machine-4

OS- Windows OS- Linux OS- MAC OS OS- Ubuntu

All having different

Operating System & Data Format
 Why we need XML?
Machine-1 Machine-2 Machine-3 Machine-4

OS- Windows OS- Linux OS- MAC OS OS- Ubuntu

Data Problem Data

Transfer ? Transfer

Data Transfer from one machine to another…..

They need to convert in Compatible Formats
 Why we need XML?
Machine-1 Machine-2 Machine-3 Machine-4

OS- Windows OS- Linux OS- MAC OS OS- Ubuntu

Data Data
Transfer
Solution Transfer

XML
 Why we need XML?
Machine-1 Machine-2 Machine-3 Machine-4

OS- Windows OS- Linux OS- MAC OS OS- Ubuntu

Data Data
Transfer
Solution Transfer

With XML, it is so easy to transfer data between such systems as

XML doesn’t depend on platform and the language
XML Uses

XML used to exchange the XML use to simplify the

XML used to store & creation of a HTML
information between
arrange Data document
organizers and systems

XML can easily be

used for unloading and XML ican express any type
merged with style
reloading a database of XML document
sheets to create
desired output.
XML Vs HTML

XML HTML
Is Case Sensitive Is not Case Sensitive
Has user defined tags Has its own predefined tags
Used for Transferring Data Used for Displaying Data
Closing tags are mandatory Closing tags are not always mandatory
It is Dynamic It is Static
XML preserve white spaces HTML does not preserve white spaces
 XML Syntax & Example
<?xml version="1.0" encoding="UTF-8"?>
<note>
<root>
<child> <to>Amisha</to>

<subchild>.....</subchild> <from>Janvi</from>
</child> <heading>Reminder</heading>
</root> <body>Don't forget Meeting!</body>
</note>
 XML Tree Structure
<?xml version="1.0" encoding="UTF-8"?>
<bookstore>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="children">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
</bookstore>
XSL
T
• XSLT (eXtensible Stylesheet Language Transformations) is
the
recommended style sheet language for XML.
• XSLT is far more sophisticated than CSS.
• With XSLT you can add/remove elements and attributes to or
from the output file.
• You can also rearrange and sort elements, perform tests and
make decisions about which elements to hide and display, and
a lot more.
Displaying XML with XSLT

Create XML Page

Create XSLT Page according to your design

criteria Link XML page with XSLT Page

Get output on browser

Step 1 : Create XML
Document:
students.xml
<?xml version = "1.0"?>
<class>
<student rollno = "393">
<firstname>Dinkar</firstname>
<lastname>Kad</lastname>
</student>
<student rollno = "493">
<firstname>Vaneet</firstname>
<lastname>Gupta</lastname>
</student>
</class>
Step 2: XSLT Conversion
criteria
• We need to define an XSLT style sheet document for
the above XML document to meet the following criteria
−
• Page should have a title Students.
• Page should have a table of student details.
• Columns should have following headers:
• Roll No, First Name, Last Name
• Table must contain details of the students accordingly.
Step 2: Create XSLT document
according to design criteria:
students.xsl <?xml version = "1.0" encoding = "UTF-8"?>
<xsl:stylesheet version = "1.0" xmlns:xsl =
"http://www.w3.org/1999/XSL/Transform">
<xsl:template match = "/">
<html> <body>
<h2>Students</h2>

<table border = "1">

<tr bgcolor = "#9acd32">
<th>Roll No</th>
<th>First Name</th>
<th>Last Name</th>
</tr>

<xsl:for-each select="class/student">
<tr>
<td><xsl:value-of select = "@rollno"/></td>
<td><xsl:value-of select = "firstname"/></td>
<td><xsl:value-of select = "lastname"/></td>
</tr>
</xsl:for-each> </table>
</body> </html>
</xsl:template>
Step 3: Link the XSLT Document
to the XML Document
• <?xml version = "1.0"?>
• <?xml-stylesheet type = "text/xsl" href =
"students.xsl"?>
• <class>
• ...
• </class>
Step 4: View the XML Document
in Internet Explorer
<?xml version = "1.0"?>
<?xml-stylesheet type = "text/xsl" href =
"students.xsl"?>
<class>
<student rollno = "393">
<firstname>Dinkar</firstname>
<lastname>Kad</lastname>
</student>
<student rollno = "493">
<firstname>Vaneet</firstname>
<lastname>Gupta</lastname>
</student>
</class>
Output
Web Technology
Unit- III
Topic:
DTD- Document Type Defination
DTD

DTD

Document Type Defination

Why TO Use DTD?
A DTD defines the structure and the legal elements and attributes of an XML
document

With a DTD, groups of people can agree on a standard DTD for

interchanging data.

An application can use a DTD to verify that XML data is valid

Types of DTD

Types of DTD

Internal External
Internal DTD- DTD is declared inside the XML file, and wrapped
inside the <!DOCTYPE> definition

<?xml version="1.0"?> XML Prolog

<!DOCTYPE note [
<!ELEMENT note (to,from,heading,body)>
<!ELEMENT to (#PCDATA)> XML
<!ELEMENT from (#PCDATA)> Elements
<!ELEMENT heading (#PCDATA)>
<!ELEMENT body (#PCDATA)>
]>
<note>
<to> Amisha </to>
<from> Janhvi</from>
<heading> Meeting Reminder</heading> XML Code
<body>Today at 5:00PM </body>
</note>
DTD Explained

❏ !DOCTYPE note defines that the root element of this document is note
❏ !ELEMENT note defines that the note element must contain four elements:
"to,from,heading,body"
❏ !ELEMENT to defines the to element to be of type "#PCDATA"
❏ !ELEMENT from defines the from element to be of type "#PCDATA"
❏ !ELEMENT heading defines the heading element to be of type "#PCDATA"
❏ !ELEMENT body defines the body element to be of type "#PCDATA"
 External DTD- Requires 2 Files
1> XML and 2>DTD
XML File

<?xml version="1.0"?> <!ELEMENT note

<!DOCTYPE note SYSTEM "note.dtd"> (to,from,heading,body)>
<note>
<to> Amisha </to>
<!ELEMENT to (#PCDATA)>
<from> Janhvi</from>
<!ELEMENT from (#PCDATA)>
<heading> Meeting Reminder </heading>
<body>Today at 5:00PM </body> <!ELEMENT heading (#PCDATA)>
</note> <!ELEMENT body (#PCDATA)>

DTD File- note.dtd

 DTD point of view - XML documents

● XML Building blocks for DTD: ●Example:

○ Elements ○ <book> c </book>
○ Attributes ○ <book type=“Education”> c </book>
○ Entities ○ <salary> &gt; 5000 </salary>
○ PCDATA ○ text data (Parsing Character Data)
○ CDATA ○ Character Data ( > < ‘ “ &)
Web Technology
Unit- III
Topic:
XML Schema
 XML Schema

❏ An XML Schema describes the structure of an XML document, just like a DTD.
❏ XML Schema is an XML-based alternative to DTD
❏ XML Schemas are More Powerful than DTD
❏ XML Schemas are written in XML
❏ XML Schemas are extensible to additions
❏ XML Schemas support data types
❏ XML Schemas support namespaces
XML Schema- Example
<?xml version="1.0"?>
<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">
<xs:element name="emp">
<xs:complexType>
<xs:sequence>
<xs:element name="name" type="xs:string"/>
<xs:element name="address" type="xs:string"/>
<xs:element name="salary" type="xs:int"/>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:schema>
 XML Schema Example Explained

❏ <xs:element name="emp"> defines the element called "emp"

❏ <xs:complexType> the "emp" element is a complex type
❏ <xs:sequence> the complex type is a sequence of elements
❏ <xs:element name="name" type="xs:string"> the element "name" is of type string (text)
❏ <xs:element name="address" type="xs:string"> the element "address" is of type string
❏ <xs:element name="salary" type="xs:int"> the element "salary" is of type int
 DTD VS XML Schema

DTD XML Schema

It doesn’t support namespace. It supports namespace.

It is comparatively harder than XSD. It is relatively more simpler than DTD.

It doesn’t support datatypes. It supports datatypes.

SGML syntax is used for DTD. XML is used for writing XSD.

It is not extensible in nature. It is extensible in nature.

 XML
Advantages & Limitations(Disadvantages)

Advantages
XML is platform independent and programming language independent, thus it can be used on any
system and supports the technology change

It supports Unicode, allowing almost any information in any written human language to be
communicated

The data stored and transported using XML can be changed at any point of time without affecting the
data presentation

XML allows validation using DTD and Schema. This validation ensures that the XML document is free
from any syntax error.

It is XML simplifies data sharing between various systems because of its platform independent nature
 XML
Advantages & Limitations(Disadvantages)

Disadvantages
XML syntax is verbose and redundant compared to other text-based data transmission formats such as
JSON.

The redundancy in syntax of XML causes higher storage and transportation cost when the volume of
data is large.

XML document is less readable compared to other text-based data transmission formats such as JSON.

XML doesn’t support array.

XML file sizes are usually very large due to its verbose nature, it is totally dependent on who is writing it.
Web Technology
Unit- III
Topic:
Ajax
 AJAX

● What is AJAX?

○ AJAX = Asynchronous JavaScript And XML.

○ AJAX is not a programming language.
○ AJAX just uses a combination of:
○ A browser built-in XMLHttpRequest object (to request data from a web server)
○ JavaScript and HTML DOM (to display or use the data)
 AJAX - Technologies

● AJAX cannot work independently. It is used in combination with other technologies to create interactive webpages.
● JavaScript
○ Loosely typed scripting language.
○ JavaScript function is called when an event occurs in a page.
○ Glue for the whole AJAX operation.
● DOM
○ API for accessing and manipulating structured documents.
○ Represents the structure of XML and HTML documents.
● CSS
○ Allows for a clear separation of the presentation style from the content and may be changed programmatically by JavaScript
● XMLHttpRequest
○ JavaScript object that performs asynchronous interaction with the server.
 AJAX – Real Time Examples

Here is a list of some famous web applications that make use of AJAX.
● Google Maps
○ A user can drag an entire map by using the mouse, rather than clicking on a button.
● Google Suggest
○ As you type, Google offers suggestions. Use the arrow keys to navigate the results.
● Gmail
○ Gmail is a webmail built on the idea that emails can be more intuitive, efficient, and useful.
● Yahoo Maps (new)
○ Now it's even easier and more fun to get where you're going!
How AJAX Works
 AJAX Processing Steps

● Steps of AJAX Operation

○ A client event occurs.
○ An XMLHttpRequest object is created.
○ The XMLHttpRequest object is configured.
○ The XMLHttpRequest object makes an asynchronous request to the Webserver.
○ The Webserver returns the result containing XML document.
○ The XMLHttpRequest object calls the callback() function and processes the result.
○ The HTML DOM is updated.
 AJAX Example – table.html

function getInfo(){
<html>
if (request.readyState==4) {
<head>
var val=request.responseText;
<script>
document.getElementById('amit').innerHTML=val;
var request;
}
}
function sendInfo() { </script>
var v=document.f1.t1.value; </head>
var url="index.jsp?val="+v;
<body>
if(window.XMLHttpRequest){ <h1>This is an example of ajax</h1>
request=new XMLHttpRequest(); <form name=“f1">
} <input type="text" name="t1">
<input type="button" value="ShowTable"
onClick="sendInfo()">
request.onreadystatechange=getInfo;
</form>
request.open("GET",url,true);
<span id="amit"> </span>
request.send(); </body>
} </html>
 AJAX Example- index.jsp

<%
int n=Integer.parseInt(request.getParameter("val"));
for(int i=1;i<=10;i++)
out.print(i*n+"<br>");
%>
AXAX Example output