0% found this document useful (0 votes)
642 views

Web Essentials - IT3401 - Notes Full Unit

Uploaded by

saisuganya
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
642 views

Web Essentials - IT3401 - Notes Full Unit

Uploaded by

saisuganya
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 144

Click on Subject/Paper under Semester to enter.

Environmental Sciences
Professional English and Sustainability -
Professional English - - II - HS3252 Discrete Mathematics - GE3451
I - HS3152 MA3354
Statistics and Theory of Computation
Matrices and Calculus Numerical Methods - Digital Principles and - CS3452
3rd Semester

4th Semester
- MA3151 MA3251 Computer Organization
1st Semester

2nd Semester

- CS3351 Artificial Intelligence


Engineering Graphics and Machine Learning
Engineering Physics - - CS3491
- GE3251 Foundation of Data
PH3151
Science - CS3352
Database Management
Physics for
Engineering Chemistry System - CS3492
Information Science Data Structures and
- CY3151 - PH3256 Algorithms - CD3291
Web Essentials -
Basic Electrical and IT3401
Problem Solving and Electronics Engineering - Object Oriented
Python Programming - BE3251 Programming - CS3391 Introduction to
GE3151 Operating Systems -
Programming in C -
CS3451
CS3251

Computer Networks -
CS3591
Object Oriented
Full Stack Web Software Engineering - Human Values and
5th Semester

Development - IT3501 CCS356 Ethics - GE3791


7th Semester

8th Semester
6th Semester

Distributed Computing Open Elective-1 Open Elective 2


- CS3551 Project Work /
Elective-3 Open Elective 3 Intership
Embedded Systems and
IoT - CS3691 Elective-4
Open Elective 4

Elective 1 Elective-5
Management Elective

Elective-6
Elective 2
All Computer Engg Subjects - [ B.E., M.E., ] (Click on Subjects to enter)
Programming in C Computer Networks Operating Systems
Programming and Data Programming and Data Problem Solving and Python
Structures I Structure II Programming
Database Management Systems Computer Architecture Analog and Digital
Communication
Design and Analysis of Microprocessors and Object Oriented Analysis
Algorithms Microcontrollers and Design
Software Engineering Discrete Mathematics Internet Programming
Theory of Computation Computer Graphics Distributed Systems
Mobile Computing Compiler Design Digital Signal Processing
Artificial Intelligence Software Testing Grid and Cloud Computing
Data Ware Housing and Data Cryptography and Resource Management
Mining Network Security Techniques
Service Oriented Architecture Embedded and Real Time Multi - Core Architectures
Systems and Programming
Probability and Queueing Theory Physics for Information Transforms and Partial
Science Differential Equations
Technical English Engineering Physics Engineering Chemistry
Engineering Graphics Total Quality Professional Ethics in
Management Engineering
Basic Electrical and Electronics Problem Solving and Environmental Science and
and Measurement Engineering Python Programming Engineering
lOMoARcPSD|46830608

www.BrainKart.com

IT3401 Web Essentials

Unit-1 Website Basics


Internet
Internet is defined as an Information super Highway, to access information over the
web. However, It can be defined in many ways as follows:

• Internet is a world-wide global system of interconnected computer networks.


• Internet uses the standard Internet Protocol (TCP/IP).
• Every computer in internet is identified by a unique IP address.
• IP Address is a unique set of numbers (such as 110.22.33.114) which identifies
a computer location.
• A special computer DNS (Domain Name Server) is used to give name to the IP
Address so that user can locate a computer by a name.
• For example, a DNS server will resolve a name http://www.flipkart.com to a
particular IP address to uniquely identify the computer on which this website is
hosted.
• Internet is accessible to every user all over the world.
Evolution
The concept of Internet was originated in 1969 and has undergone several
technological & Infrastructural changes as discussed below:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 1
lOMoARcPSD|46830608

www.BrainKart.com

• The origin of Internet devised from the concept of Advanced Research Project
Agency Network (ARPANET).
• ARPANET was developed by United States Department of Defense.
• Basic purpose of ARPANET was to provide communication among the various
bodies of government.
• Initially, there were only four nodes, formally called Hosts.
• In 1972, the ARPANET spread over the globe with 23 nodes located at different
countries and thus became known as Internet.

Advantages
Internet covers almost every aspect of life, one can think of. Here, we will discuss
some of the advantages of Internet:

By the time, with invention of new technologies such as TCP/IP protocols, DNS,
WWW, browsers, scripting languages etc.,Internet provided a medium to
publish and access information over the web.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 2
lOMoARcPSD|46830608

www.BrainKart.com

• Internet allows us to communicate with the people sitting at remote locations.


There are various apps available on the wed that uses Internet as a medium for
communication. One can find various social networking sites such as:
o Facebo
ok
o Twitter
o
Yahoo
o
Google
+
o Flickr o
Orkut
• One can surf for any kind of information over the internet. Information regarding
various topics such as Technology, Health & Science, Social Studies,
Geographical Information, Information Technology, Products etc can be surfed
with help of a search engine.
• Apart from communication and source of information, internet also serves a
medium for entertainment. Following are the various modes for entertainment
over internet.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 3
lOMoARcPSD|46830608

www.BrainKart.com

o Online Television
o Online Games o
Songs o Videos
o
Social Networking Apps
 Internet allows us to use many services like:
o Internet Banking
o Matrimonial Services
o Online Shopping
o Online Ticket Booking
o Online Bill Payment
o Data Sharing
o E-mail
 Internet provides concept of electronic commerce, that allows the business
deals to be conducted on electronic systems

Disadvantages
However, Internet has prooved to be a powerful source of information in almost
every field, yet there exists many disadvanatges discussed below:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 4
lOMoARcPSD|46830608

www.BrainKart.com

• There are always chances to loose personal information such as name,


address, credit card number. Therefore, one should be very careful while
sharing such information. One should use credit cards only through
authenticated sites.
• Another disadvantage is the Spamming.Spamming corresponds to the
unwanted e-mails in bulk. These e-mails serve no purpose and lead to
obstruction of entire system.
• Virus can easily be spread to the computers connected to internet. Such virus
attacks may cause your system to crash or your important data may get deleted.
• Also a biggest threat on internet is pornography. There are many pornographic
sites that can be found, letting your children to use internet which indirectly
affects the children healthy mental life.
• There are various websites that do not provide the authenticated information.
This leads to misconception among many people.

2. Describe the Fundamentals of computer networking?

This tutorial will discover the definition of computer networking, its types, computer
networks work, networking concepts, commonly used terms, networking and internet,
how it works, and network topologies.

Computer Network
"A Computer Network is defined as a set of two or more computers that are linked
together?either via wired cables or wireless networks i.e., WiFi?with the purpose of
communicating, exchanging, sharing or distributing data, files and resources."

Computer Networks are built using a collection of hardware (such as routers,


switches, hubs, and so forth) and networking software (such as operating systems,
firewalls, or corporate applications).

Though one can also define the computer networks based on their geographic
location, a LAN (local area network) connects computers in a definite physical
dimension, such as home or within an office.

In contrast, a MAN (Metropolitan area network) connects computers ranging


between multiple buildings in a city.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 5
lOMoARcPSD|46830608

www.BrainKart.com

The Internet is the most significant example of WAN (Wide Area


Network), connecting billions of networking devices across the world.

One can also describe the concept of computer networking by its communicating
protocols, the physical arrangement of its networking elements, how it manages
network traffic, and it's functioning.

Computer networks are globally used by businesses, the entertainment industry,


education in the research field for communication and transferring their data from
source to destination node.

All the other technologies, including the internet, Google search, instant messaging
apps, online video streaming, social media, email, cloud kitchen, cloud data
storage, etc., all exist because of computer networks.

Computer Network Types


Below are the most common computer network types that are frequently used these
days:

o LAN [Local Area Network} o WLAN


[Wireless local area network] o CAN
[Campus Area Network] o MAN
[Metropolitan Area Network] o PAN
[Personal Area Network] o SAN
[Storage Area Network] o VPN [Virtual
Private Network] o WAN [ Wide Area
Network]

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 6
lOMoARcPSD|46830608

www.BrainKart.com

1. LAN

LAN or Local Area Network is a group of devices connecting the computers and
other devices such as switches, servers, printers, etc., over a short distance such as
office, home. The commonly used LAN is Ethernet LAN. This network is used as it
allows the user to transfer or share data, files, and resources.

2. MAN

MAN or Metropolitan Area Network is typically a more extensive network when


compared to LANs but is smaller than WANs. This network ranges between several

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 7
lOMoARcPSD|46830608

www.BrainKart.com

buildings in the same city. Man networks are connected via fiber optic cable (usually
high-speed connection). Cities and government bodies usually manage MANs.

3.WAN

WAN or Wide Area Network is the most significant network type connecting
computers over a wide geographical area, such as a country, continent. WAN
includes several LANs, MANs, and CANs. An example of WAN
the Internet, which connects billions of computers globally.

Networking terms and concepts


is

Some of the most commonly used terms in day-to-day networking life are as discussed
below:

1. IP address
An IP address or Internet Protocol is a unique number that represents the address
where you live on the Internet. Every device that is connected to the network has a
string of numbers or IP addresses unlike house addresses.

You won't find two devices connected to a network with an identical IP address. When
your computer sends data to another different, the sent data contains a 'header' that

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 8
lOMoARcPSD|46830608

www.BrainKart.com

further contains the devices' IP address, i.e., the source computer and the destination
device.

2. Nodes
A node refers to a networking connection point where a connection occurs inside
a network that further helps in receiving, transmitting, creating, or storing files
or data.

Multiple devices could be connected to the Internet or network using wired or wireless
nodes. To form a network connection, one requires two or more nodes where each
node carries its unique identification to obtain access, such as an IP address. Some
examples of nodes are computers, printers, modems, switches, etc.

3. Routers
A router is a physical networking device, which forwards data packets between
networks. Routers do the data analysis, perform the traffic directing functions on the
network, and define the top route for the data packets to reach their destination node.
A data packet may have to surpass multiple routers present within the network until
it reaches its destination.

4. Switches
In a computer network, a switch is a device that connects other devices and helps in
node-to-node communication by deciding the best way of transmitting data
within a network (usually if there are multiple routes in a more extensive
network).

Though a router also transmits information, it forwards the information only between
networks, whereas a switches forwards data between nodes present in a single
network.

Switching is further classified into three types, which are as follows:

o Circuit Switching
o Packet Switching o Message Switching

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 9
lOMoARcPSD|46830608

www.BrainKart.com

o Circuit Switching: In this switching type, a secure communication path is


established between nodes (or the sender and receiver) in a network. It
establishes a dedicated connection path before transferring the data, and this
path assures a good transmission bandwidth and prevents any other traffic from
traveling on that path. For example, the Telephone network.
o Packet Switching: With this technique, a message is broken into independent
components known as packets. Because of their small size, each packet is sent
individually. The packets traveling through the network will have their source
and destination IP address.
o Message Switching: This switching technique uses the store and forward
mechanism. It sends the complete unit of the message from the source node,
passing from multiple switches until it reaches its intermediary node. It is not
suitable for real-time applications.

5. Ports
A port allows the user to access multiple applications by identifying a connection
between network devices. Each port is allocated a set of string numbers. If you relate
the IP address to a hotel's address, you can refer to ports as the hotel room number.
Network devices use port numbers to decide which application, service, or method is
used to forward the detailed information or the data.

6. Network cable types


Network cables are used as a connection medium between different computers
and other network devices. Typical examples of network cable types are Ethernet
cables, coaxial, and fiber optic. Though the selection of cable type usually depends
on the size of the network, the organization of network components, and the distance
between the network devices.

Computer Networks and the Internet


The Internet is the major example of a WAN, which connects billions of computers
globally. Internet follows standard protocols that facilitate communication between
these network devices. Those protocols include:

1. HTTP (Hypertext Transfer Protocol)

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 10
lOMoARcPSD|46830608

www.BrainKart.com

2. IP (Internet protocol or IP addresses)


3. TCP (Transmission Control Protocol)
4. UDP (User Datagram Protocol)
5. FTP (File Transfer Protocol)

ISPs (Internet Service Providers) NSPs (Network Service Providers) effectively


support the internet infrastructure. The infrastructure allows the transportation of data
packets to the recipient device over the Internet.

Internet is a giant hub of information, but this information is not sent to every
computer connected to the Internet. The protocols and infrastructure are responsible
for managing to share the precise information the user has requested.

Network Topology
"Network topology is defined as the arrangement of computers or nodes of a
computer network to establish communication among all."

A node refers to a device that can transmit, receive, create, or store information. The
nodes are connected via a network link that could be either wired (cables, Ethernet) or
wireless (Bluetooth, Wi-Fi).

To help build a successful network in different situations, topologies are further classified
into several types. Though there are several topologies but in
this tutorial, we will discuss the commonly used ones, which are as
follows:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 11
lOMoARcPSD|46830608

www.BrainKart.com

1. Bus Topology

o A Bus network topology supports a common transmission medium where


each node is directly connected with the main network cable.
o The data is transmitted through the main network cable and is received by all
nodes simultaneously.
o A signal is generated through the source machine, which contains the address
of the receiving machine. The signal travels in both the direction to all the
nodes connected to the bus network until it reaches the destination node.
o Bus topology is not fault-tolerant and has a limited cable length.

2. Ring Topology

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 12
lOMoARcPSD|46830608

www.BrainKart.com

o A Ring topology is a modified version of bus topology where every node is


connected in a closed-loop forming peer-to-peer LAN topology.
o Every node in a ring topology has precisely two connections. The Adjacent node
pairs are connected directly, whereas the non-adjacent nodes are indirectly
connected via various nodes.
o Ring topology supports a unidirectional communication pattern where sending
and receiving of data occurs via TOKEN.

3. Star Topology

o In a Star network topology, every node is connected using a single central


hub or switch.
o

The hub or switch performs the entire centralized administration. Each node
sends its data to the hub, and later hub shares the received information to the
destination device.
o Two or more-star topologies can be connected to each other with the help of a
repeater.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 13
lOMoARcPSD|46830608

www.BrainKart.com

4. Mesh Topology

o In a Mesh topology, every node in the network connection is directly


connected to one other forming overlapping connections between the nodes.
o This topology delivers better fault tolerance because if any network device fails,
it won't affect the network, as other devices can transfer information.
o The Mesh networks self-configure and self-organize, finding the quickest, most
secure way to transmit the data.
o One can forpm a full mesh topology by connecting every single node to another
node in the network. Full mesh is expensive and is only used in the networks,
which demands high data redundancy.
o Another type of mesh topology is partial mesh topology, where only a few
devices are connected, and few are connected to the devices with which they
share the most information. This mesh type is applicable in the networks,
requiring less redundancy or a cost-effective network topology that is easy to
execute.

3. Explain the Types of Network protocols and their uses?

, there are vast numbers of users' communicating with different devices in different
languages. That also includes many ways in which they transmit data along with the
different software they implement. So, communicating worldwide will not be
possible if there were no fixed 'standards' that will govern the way user

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 14
lOMoARcPSD|46830608

www.BrainKart.com

communicates for data as well as the way our devices treat those data. Here we will
be discussing these standard set of rules.

Yes, we're talking about "protocols" which are set of rules that help in governing the
way a particular technology will function for communication. In other words, it can
be said that the protocols are digital languages implemented in the form of
networking algorithms. There are different networks and network protocols, user's
use while surfing.

Types of Protocols
There are various types of protocols that support a major and compassionate role in
communicating with different devices across the network. These are:

1. Transmission Control Protocol (TCP)


2. Internet Protocol (IP)
3. User Datagram Protocol (UDP)
4. Post office Protocol (POP)
5. Simple mail transport Protocol (SMTP)
6. File Transfer Protocol (FTP)
7. Hyper Text Transfer Protocol (HTTP)
8. Hyper Text Transfer Protocol Secure (HTTPS)
9. Telnet
10.Gopher
Let's discuss each of them briefly:

1. Transmission Control Protocol (TCP): TCP is a popular communication


protocol which is used for communicating over a network. It divides any
message into series of packets that are sent from source to destination and
there it gets reassembled at the destination.
2. Internet Protocol (IP): IP is designed explicitly as addressing protocol. It is
mostly used with TCP. The IP addresses in packets help in routing them
through different nodes in a network until it reaches the destination system.
TCP/IP is the most popular protocol connecting the networks.
3. User Datagram Protocol (UDP): UDP is a substitute communication protocol
to Transmission Control Protocol implemented primarily for creating
losstolerating and low-latency linking between different applications.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 15
lOMoARcPSD|46830608

www.BrainKart.com

4. Post office Protocol (POP): POP3 is designed for receiving incoming E-mails.
5. Simple mail transport Protocol (SMTP): SMTP is designed to send and
distribute outgoing E-Mail.
6. File Transfer Protocol (FTP): FTP allows users to transfer files from one
machine to another. Types of files may include program files, multimedia files,
text files, and documents, etc.
7. Hyper Text Transfer Protocol (HTTP): HTTP is designed for transferring a
hypertext among two or more systems. HTML tags are used for creating links.
These links may be in any form like text or images. HTTP is designed on
Client-server principles which allow a client system for establishing a
connection with the server machine for making a request. The server
acknowledges the request initiated by the client and responds accordingly.
8. Hyper Text Transfer Protocol Secure (HTTPS): HTTPS is abbreviated as Hyper
Text Transfer Protocol Secure is a standard protocol to secure the
communication among two computers one using the browser and other
fetching data from web server. HTTP is used for transferring data between the
client browser (request) and the web server (response) in the hypertext
format, same in case of HTTPS except that the transferring of data is done in
an encrypted format. So it can be said that https thwart hackers from
interpretation or modification of data throughout the transfer of packets.
9. Telnet: Telnet is a set of rules designed for connecting one system with
another. The connecting process here is termed as remote login. The system
which requests for connection is the local computer, and the system which
accepts the connection is the remote computer.
10.Gopher: Gopher is a collection of rules implemented for searching, retrieving
as well as displaying documents from isolated sites. Gopher also works on the
client/server principle.
Some Other Protocols
Some other popular protocols act as co-functioning protocols associated with these
primary protocols for core functioning. These are:

• ARP (Address Resolution Protocol)


• DHCP (Dynamic Host Configuration Protocol)
• IMAP4 (Internet Message Access Protocol)
• SIP (Session Initiation Protocol)
• RTP (Real-Time Transport Protocol)
• RLP (Resource Location Protocol)

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 16
lOMoARcPSD|46830608

www.BrainKart.com

• RAP (Route Access Protocol)


• L2TP (Layer Two Tunnelling Protocol)
• PPTP (Point To Point Tunnelling Protocol)
• SNMP (Simple Network Management Protocol)  TFTP (Trivial File Transfer
Protocol)

4. Explain Web Essentials briefly?

Web Essentials:

Server:

The software that distributes the information and the machine where the
information and software reside is called the server.

• provides requested service to client


• e.g., Web server sends requested Web page

The software that resides on the remote machine, communicates with the
server, fetches the information, processes it, and then displays it on the remote
machine is called the client.

•initiates contact with server (“speaks first”)


•typically requests service from server
•Web: client implemented in browser

Web server:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 17
lOMoARcPSD|46830608

www.BrainKart.com

Software that delivers Web pages and other documents to browsers using the

HTTP protocol Web Page:

A web page is a document or resource of information that is suitable for the


World Wide Web and can be accessed through a web browser.

Website:

A collection of pages on the World Wide Web that are accessible from the
same URL and typically residing on the same server.

URL

Uniform Resource Locator, the unique address which identifies a resource on the
Internet for routing purposes.

Client-server paradigm:

The Client-Server paradigm is the most prevalent model for distributed


computing protocols. It is the basis of all distributed computing paradigms at a higher
level of abstraction. It is service-oriented, and employs a request-response protocol.

A server process, running on a server host, provides access to a service. A


client process, running on a client host, accesses the service via the server
process.The interaction of the process proceeds according to a protocol.

The primary idea of a client/server system is that you have a central repository
of information—some kind of data, often in a database—that you want to distribute
on demand to some set of people or machines. The Internet:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 18
lOMoARcPSD|46830608

www.BrainKart.com

•Medium for communication and interaction in inter connected network.


• Makes information constantly and instantly available to anyone with a
connection.

Web Browsers

• User agent for Web is called a


browser: o Internet Explorer

Web

• Server for Web is called Web


server: o Apache (public

o MS Internet Information Server


Server:

domain)

Protocol:

Protocols are agreed formats for transmitting


data between devices. The protocol determines:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 19
lOMoARcPSD|46830608

www.BrainKart.com

i.The error checking required ii.Data


compression method used iii.The way the
end of a message is signaled iv.The way the
device indicates that it has received the
message

Internet Protocol:

There are many protocols used by the Internet and the WWW:
o TCP/IP
o HTTP
o FTP

o Electronic mail protocols IMAP


o POP
TCP/IP

The Internet uses two main protocols (developed by Vincent Cerf and Robert Kahn)
Transmission control protocol (TCP):Controls disassembly of message into packets
at the origin reassembles at the destination

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 20
lOMoARcPSD|46830608

www.BrainKart.com

Internet protocol (IP):Specifies the addressing details for each packet Each
packet is labelled with its origin and destination.

Hypertext Transfer Protocol (HTTP)

• The hypertext transfer protocol (HTTP) was developed by Tim BernersLee


in 1991
•HTTP was designed to transfer pages between machines
• The client (or Web browser) makes a request for a given page and the Server
is responsible for finding it and returning it to the client
•The browser connects and requests a page from the server
• The server reads the page from the file system, sends it to the client and

Electronic Mail Protocols:

• Electronic mail uses the client/server model


terminates the connection.
• The organisation has an email server devoted to handling email o Stores
and forwards email messages

•Individuals use email client software to read and send email o


(e.g. Microsoft Outlook, or Netscape Messenger)
• Simple Mail Transfer Protocol (SMTP) o Specifies format of mail
messages

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 21
lOMoARcPSD|46830608

www.BrainKart.com

• Post Office Protocol (POP) tells the email server to:


o Send mail to the user’s computer and delete it from the server

o Send mail to the user’s computer and do not delete it from the
server o Ask whether new mail has arrived.

Interactive Mail Access Protocol (IMAP)

Newer than POP, provides similar functions with additional features.

o e.g. can send specific messages to the client rather than all the
messages. A user can view email message headers and the
sender’s name before

downloading the entire message.


Allows users to delete and search mailboxes held on the email server.

The disadvantage of POP: You can only access messages from one PC.

The disadvantage of IMAP :Since email is stored on the email server, there is a
need for more and more expensive (high speed) storage space.

World Wide Web: comprises software (Web server and browser) and data
(Web sites).

Internet Protocol (IP) Addresses:


- Every node has a unique numeric address
- Form: 32-bit binary number

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 22
lOMoARcPSD|46830608

www.BrainKart.com

- New standard, IPv6, has 128 bits (1998)

- Organizations are assigned groups of IPs for their computers -


Domain names
- Form: host-name. domain-names
- First domain is the smallest (Google)
- Last domain specifies the type of organization (.com)
- Fully qualified domain name - the host name and all of the domain
names
- DNS servers - convert fully qualified domain names to IPs

HTTP:
Hypertext Transfer Protocol (HTTP) is the communication protocol
used by the Internet to transfer hypertext documents.

A protocol to transfer hypertext requests and information between


servers and browsers

Hypertext is text, displayed on a computer, with references (hyperlinks) to

other text that the reader can immediately follow, usually by a mouse HTTP is behind
every request for a web document or graph, every click of a hypertext link, and every
submission of a form.

HTTP specifies how clients request data, and how servers respond to
these requests.

The client makes a request for a given page and the server is responsible
for finding it and returning it to the client.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 23
lOMoARcPSD|46830608

www.BrainKart.com

The browser connects and requests a page from the server.

The server reads the page from the file system and sends it to the client and
then terminates the connection

HTTP Transactions

HTTP Message:

HTTP message is the information transaction between the client and server.

Two types of HTTP Message:

1.Requests
a.Client to server

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 24
lOMoARcPSD|46830608

www.BrainKart.com

2.Responses

a.Server to client

Fields
· Request line or Response line
· General header
· Request header or Response header
· Entity header
· Entity body

Request Message:
Request Line:

• A request line has three parts, separated by spaces o a method


name

o the local path of the requested resource o the version


of HTTP being used

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 25
lOMoARcPSD|46830608

www.BrainKart.com

•A typical request line is:


o GET /path/to/file/index.html HTTP/1.1
• Notes:

o GET is the most common HTTP method; it says "give me this resource".
Other methods include POST and HEAD. Method names are always
uppercase

o The path is the part of the URL after the host name, also called the
request URI o The HTTP version always takes the form
"HTTP/x.x", uppercase.

Request Header:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 26
lOMoARcPSD|46830608

www.BrainKart.com

Response Message:
Response Line:

• A request line has three parts, separated by


spaces o the HTTP version,

o a response status code that gives the result of the


request, and o an English reason phrase describing the
status code
• Typical status lines are:
o HTTP/1.0 200 OK or
o HTTP/1.0 404 Not Found
• Notes:
o The HTTP version is in the same format as in the request line,
"HTTP/x.x".

o The status code is meant to be computer-readable; the reason phrase


is meant to be human-readable, and may vary.

HTTP Request Header:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 27
lOMoARcPSD|46830608

www.BrainKart.com

EXAMPLE

HTTP Method:

• HTTP method is supplied in the request line and specifies the operation
that
the client has requested.

Some common methods:


•Options
•Get
•Head
•Post
•Put
•Move
•Delete

Two methods that are mostly used are the GET and
POST: o GET for queries that can be safely
repeated

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 28
lOMoARcPSD|46830608

www.BrainKart.com

o POST for operations that may have side effects


(e.g. ordering a book from an online store).

The GET Method

• It is used to retrieve information from a specified URI and


is assumed to be a safe, repeatable operation by browsers, caches and
other HTTP aware components

•Operations have no side effects and GET requests can be re-issued.

• For example, displaying the balance of a bank account has


no effect on the account and can be safely repeated.

• Most browsers will allow a user to refresh a page that


resulted from a GET, without displaying any kind of warning

• Proxies may automatically retry GET requests if they


encounter a temporary network connection problem.

• GET requests is that they can only supply data in the form
of parameters encoded in the URI (known as a Query String) –
[downside]

Cannot be unused for uploading files or other operations that require large amounts
of data to be sent to the server.

The POST Method

•Used for operations that have side effects and cannot be safely repeated.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 29
lOMoARcPSD|46830608

www.BrainKart.com

• For example, transferring money from one bank account to


another has side effects and should not be repeated without explicit
approval by the user.

If you try to refresh a page in Internet Explorer that resulted from a POST, it displays
the following message to warn you that there may be side effects:

The POST request message has a content body that is normally


used to send parameters and data

• The IIS server returns two status codes in its response for a POST request
o The first is 100 Continue to indicate that it has successfully
received the POST
request
o The second is 200 OK after the request has been processed.

HTTP response status codes

•Informational (1xx)
•Successful (2xx)
•Redirection (3xx) o 301: moved
permanently
• Client error (4xx)

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 30
lOMoARcPSD|46830608

www.BrainKart.com

o 403 : forbidden o
404: Not
found
• Server error (5xx) o 503: Service
unavailable o 505: HTTP version
not supported
5. Describe client side scripting?

Client side scripting is a process in which the code along with HTML web
page is sent to the client by the server. Here, the code refers to the script.
In other simple words, client side scripting is a process in which scripts are
executed by browsers without connecting the server.
The code executes on the browser of client’s computer either during the
loading of web page or after the web page has been loaded.
Client side scripting is mainly used for dynamic user interface elements,
such as pull-down menus, navigation tools, animation buttons, data
validation purpose, etc.
Today, it is rapidly growing and evolving day by day. As a result, writing
client side web programming is now easier and faster, thereby, reducing
load on the server.
JavaScript and jQuery are by far the most important client-side scripting
languages or web scripting languages and widely used to create a
dynamic and responsive webpage and websites.
The browser (temporarily) downloads the code in the local computer and
starts processing it without the server. Therefore, the client side scripting is
browser dependent.

A client-side script is a small program (or set of instructions) that is


embedded (or inserted) into a web page. It is processed within the client
browser instead of the web server.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 31
lOMoARcPSD|46830608

www.BrainKart.com

The client side script downloads at the client end from the server along
with the HTML web page it is embedded in. The web browser interprets
and executes the code and then displays the results on the monitor.
The script that executes on the user’s computer system is called client. It is
embedded (or inserted) within the HTML document or can be stored in an
external separate file (known as external script).
The script files are sent to the client machine from the web server (or severs)
when they are requested. The client’s web browser executes the script, then
displays the web page, including any visible output from the script. Look

Client side scripts may also have some instructions for the web browser to
follow in response to certain user actions, such as pressing a page button.
They can often be looked if client want to view the source code of web
page.
at the below figure to understand better.
Popular Client side Scripting Language
A language in which a client side script or program is written using syntax is
called client side scripting language or client side programming. The
most popular client side scripting languages is as follows:
1. JavaScript: It is the most widely client side scripting or programming
language. It is based on ECMAScript standard language.
JavaScript is an object based oriented, dynamically typed (or also called
weakly typed) scripting language. It runs directly on the browser with the
help of an inbuilt interpreter.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 32
lOMoARcPSD|46830608

www.BrainKart.com

Here, weakly typed means the variables are easily converted implicitly from
one data type to another.
2. VBScript: This scripting language is developed by Microsoft, based on
the Visual Basic. It is basically used to enhance the features of web pages in
Internet Explorer. VBScript is interpreted by Internet Explorer web browser.
3. jQuery: jQuery is a fast, small, lightweight JavaScript library. It is used to
facilitate a lot of JavaScript code into simple-to-use-functionality. Most of
the biggest companies such as Google, Microsoft, IBM, Netflix, etc. on the
Web are using jQuery language.

Client side Scripting Language Example


Let’s take a very simple example of JavaScript client side script. In this
example, a simple JavaScript client side script will run in the browser to
display the name of cities.
The HTML file located on the server will be the same one sent to the
browser, but JavaScript changes the HTML web page that is loaded in the
browser.
Program code:
<DOCTYPE html>

<html>

<head>

<title>List of cities</title>

<script> function displayCities()

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 33
lOMoARcPSD|46830608

www.BrainKart.com

var cities = ["New York", "Dhanbad", "Paris", "London", "Mumbai"];

var ulElement = document.getElementById("cityList");

for(var city in cities)

var listItem = ulElement.appendChild(document.createElement("li"));

listItem.appendChild(document.createTextNode(cities[city]));

</script>

</head>

<body onload = "displayCities()">

<ul id = "cityList"></ul>

</body>

</html>

Look at the below diagram that shows the flow of data between server and
browser.
Application of Client side Scripting
Client side scripting is used to make web pages or website more interactive.
It is primarily used at the frontend, where the user can see using the
browser. Some important applications of client side scripting are listed, as
below:
• To retrieve data from web browser or user’s screen.
• Used in the field of online games.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 34
lOMoARcPSD|46830608

www.BrainKart.com

• To customize the web page without reloading the page.


• Client side scripting is used for validation purpose. If the user enters
incorrect credentials on the login page, the web page displays an
error message on the client machine without submitting it to the web
server.
• To create ad banners that interact with the user, rather than simply
displaying graphics.
• To create animated images that change when we move the mouse
over them.
• Client side script can be used to detect installed plug-ins and notify
the user if a plugin is required.

Advantage of Client side Scripting


There are several great advantages of client side scripting that are as
follows:
1. The client side scripting language is quite easy to learn and use. It
requires minimum programming knowledge or experienced required.
2. The main advantage of client side scripting is that it is lightweight and
relatively easy to implement (syntax not too complex). The editing and
executing the code is fast.
3. Data processing is done on the client side from the server, which makes
it easier to scale applications with large numbers of users. Thereby, load
on the server reduces.
4. The client side data validation can be possible using the client side
scripting language like JavaScript.
5. The execution of client side script is more quickly because once the script
is downloaded from the server, it is executed by the browser directly on
the user’s computer.
6. Mathematical assessment is also possible using client side scripting.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 35
lOMoARcPSD|46830608

www.BrainKart.com

7. The client side programming helps to perform the complex tasks in


relatively few steps.
8. Script code only executed by the browser without connecting the server.
9. It takes too less time to execute script code.
10. Browser respond immediately when user presses any key, mouse
movement, clicks, etc.

Disadvantage of Client side Scripting


There are certain disadvantages of client side scripting that are as follows:
1. The main disadvantage of client side scripting is that it is unsecure
because the code is sent as is to the client and, therefore, visible to it if the
client looks at the sources of his web page. In short, code is usually visible.
2. Client side programming cannot be used if we need to access
databases or needs to transmit sensitive data over the internet.
3. There is no guarantee that user has enabled JavaScript on his
computer’s browser. Therefore, any required functionality must be loaded
on the server despite the possibility that it could be offloaded.
4. The smooth running of the script (or program) depends entirely on
the client’s browser, its configuration, and security level.
5. The web application based on the heavy JavaScript can be
complicated to debug and maintain.
6. Client side scripting languages are usually more limited in
functionality than server side scripting languages.

Client side Web Attacks


In this section, we will understand web attacks on the client side. They are
as follows:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 36
lOMoARcPSD|46830608

www.BrainKart.com

1. Malicious HTML tags embedded in web request can cause the server
to generate malformed pages. It can be dangerous if run on the server side.
Malformed pages sent back to the client may produce the further problems
if executes on the client side.
2. Malicious code can be sent to the server from the attackers in a
discussion group website. An example of malicious code can be like this:
Hello Group — Here is my message!

<script>Malicious code</script>

If JavaScript is enabled on the victim client’s browser, the browser will run
this code unexpectedly.
3. An attacker can send a file to a client and encourage him to post it to
the server. The file may contain malicious code that can hack the website.
4. When a client visits a website, a small text file called a cookie is often
placed in the client’s computer. At the next visiting, the web server scans
that cookie. If it found on the computer, the attacker can use the cookie
data to trigger the download of malicious code.
5. Tags like <FORM> can trouble if they are inserted at the wrong place.
These HTML tags can change the appearance of the web page.
6. Browsers interpret the information according to the character set
chosen by the client. If the client does not specify the character set, the
web browser uses the default setting, that can display the garbled
appearing or unintended meanings.

General Client side Attack Prevention


There are the following general measures to prevent client side attacks.
They are as follows:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 37
lOMoARcPSD|46830608

www.BrainKart.com

1. Client can use client side scripting to clean up form data before it is
transmitted.
2. Users can turn off JavaScript functions in the browser. It may disable
some web functionality.
3. They should set the security level high in the browser and lower it only
for those users you are sure will not violate that trust.
4. Scan all the files including cookie for viruses to prevent the injection of
malicious code.
5. Client should declare their character set when configuring browsers.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 38
lOMoARcPSD|46830608

www.BrainKart.com

UNIT-2 Web Designing

1. Explain the structure of the html webpage with an example?

• HTML stands for Hyper Text Markup Language

• HTML is the standard markup language for crea ng Web pages

• HTML describes the structure of a Web page

• HTML consists of a series of elements

• link", etc.

A Simple HTML Document

Example

<!DOCTYPE html>

<html>

<head>

< tle>Page Title</ tle>

</head>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>

</html>

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 39
lOMoARcPSD|46830608

www.BrainKart.com

Example explana on:

• The <!DOCTYPE html> declara on defines that this document is an HTML5 document

• The <html> element is the root element of an HTML page

• The <head> element contains meta informa on about the HTML page

• The < tle> element specifies a tle for the HTML page (which is shown in the browser's tle bar
or in the page's tab)

• The <body> element defines the document's body, and is a container for all the visible contents,
such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

• The <h1> element defines a large heading

• The <p> element defines a paragraph

HTML Element

An HTML element is defined by a start tag, some content, a nd an end tag:

<tagname> Content goes here... </tagname>

The HTML element is everything from the start tag to the end tag:

<h1>My First Heading</h1>

<p>My first paragraph.</p>

Web Browsers

The purpose of a web browser (Chrome, Edge, Firefox, Safari) is to read HTML documents and display them
correctly.

A browser does not display the HTML tags, but uses them to determine how to display the document:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 40
lOMoARcPSD|46830608

www.BrainKart.com

HTML Page Structure

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 41
lOMoARcPSD|46830608

www.BrainKart.com

2. Define form tag. Design a registra on page by using all form controls?

The form is basically used for the registra on process, logging into your profile on a website or to create
your profile on a website, etc … The informa on that is collected from the form is -1. Name 2.Email
Addresses etc. Now the form will take input from the form and post that data in backend applica ons (like
PHP). So the backend applica on will process the data which is received by them. There are various form
elements that we can use like text fields, text area, drop-down list, select, checkboxes, radio, etc.

Syntax:

<form> Form Content... </form>

Registra on page

Use a <form> element to process the input.

Example:

<form>

<div class="container">

<h1>Register Here</h1>

<p>Please fill in the details to create an account with us.</p> <hr>

<label for="email"><b>Enter Email</b></label >

<input type="text" placeholder="Enter Email" name="email"> <label


for="pwd"><b>Password</b></label>

<input type="password" placeholder="Enter Password" name="pwd">

<label for="confirm"><b>Confirm Password</b></label>

<input type="password" placeholder="Confirm Password" name="confirm">

<hr>

<p>By crea ng an account you agree to our <a href="#">Terms & Privacy</a>.</p>

<bu on type="submit" class="registerbtn"><strong>Register</strong></bu on> </div>

<div class="container signin">

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 42
lOMoARcPSD|46830608

www.BrainKart.com

<p>Already have an account? <a href="#">Sign in</a>.</p>

</div>

</form>

Output:

3. Explain about Cascading Style Sheet with an example?

Cascading Style Sheets (CSS) is used to format the layout of a webpage.


With CSS, you can control the color, font, the size of text, the spacing between elements, how elements
are posi oned and laid out, what background images or background colors are to be used, different
displays for different devices and screen sizes, and much more!

CSS can be added to HTML documents in 3 ways:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 43
lOMoARcPSD|46830608

www.BrainKart.com

• Inline - by using the style a ribute inside HTML elements

• Internal - by using a <style> element in the <head> sec on

• External - by using a <link> element to link to an external CSS file

CSS Example

<style>

body {background-color:lightblue; text-align:center;} h1


{color:blue; font-size:40px;}
p {font-family:verdana; font-size:20px;}

</style>

CSS Syntax

A CSS rule consists of a selector and a declara on block:

The selector points to the HTML element to style (h1).

The declara on block (in curly braces) contains one or more declara ons separated by
semicolons.

Each declara on includes a CSS property name and a value, separated by a colon.

In the following example all <p> elements will be center -aligned, red and have a font size of 32
pixels:

Example
<style>
p {font-size:32px; color:red; text-align:center;} </style>

Same example can also be wri en like this:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 44
lOMoARcPSD|46830608

www.BrainKart.com

<style> p {
font-size: 32px;
color: red;
text-align: center;
}
</style>

CSS Background

CSS background property is used to define the background effects on element. There are 5 CSS
background proper es that affects the HTML elements:

1. background-color

2. background-image

3. background-repeat

4. background-a achment

5. background-posi on

1) CSS background-color

The background-color property is used to specify the background color of the element.

2) CSS background-image

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 45
lOMoARcPSD|46830608

www.BrainKart.com

The background-image property is used to set an image as a background of an element. By


default the image covers the en re element. You can set the background image for a page like
this.

3) CSS background-repeat

By default, the background -image property repeats the background image horizontally and
ver cally. Some images are repeated only horizontally or ver cally.

The background looks be er if the image repeated horizontally only.

4) CSS background-a achment

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 46
lOMoARcPSD|46830608

www.BrainKart.com

The background-a achment property is used to specify if the background image is fixed or scroll
with the rest of the page in browser window. If you set fixed the background image then the
image will not move during scrolling in the browser.

5) CSS background-posi on

The background-posi on property is used to define the ini al posi on of the background image.
By default, the background image is placed on the top-le of the webpage.
You can set the following posi ons:

1. center

2. top

3. bo om

4. le

5. right

4. How to create CSS anima on and briefly explain about user interface.?

CSS anima on:

Anima on is a way using which we can create the illusion of mo on by placing s ll images one
a er another in a typical format. For example, we can have a ball rising up at some instant than
falling down as an anima on effect. CSS provides us some proper es to control the anima on
effect by changing some of its variables like ming and key frames etc.

• @keyframes

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 47
lOMoARcPSD|46830608

www.BrainKart.com

• animation-name
• animation-duration
• animation-delay
• animation-iteration-count •
animation-direction
• animation-timing-function
• animation-fill-mode
• animation

The @keyframes

When you specify CSS styles inside the @keyframes rule, the anima on will gradually change
from the current style to the new style at certain mes.

@keyframes example { from


{background-color: red;} to
{background-color: yellow;}
}

div { width: 100px;


height: 100px;
background-color: red;
anima on-name: example;
anima on-dura on: 4s;
}

Animation-duration

The animation-duration property defines how long an animation should take to complete.
If the animation-duration property is not specified, no animation will occur, because the default
value is 0s

Delay an Animation

The animation-delay property specifies a delay for the start of an animation.

div { width: 100px;


height: 100px; position:
relative; background-
color: red; animation-

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 48
lOMoARcPSD|46830608

www.BrainKart.com

name: example;
animation-duration: 4s;
animation-delay: 2s; }

Animation-iteration-count:

The animation-iteration-count property specifies the number of times


an animation should run. div { width: 100px; height: 100px; position: relative;
background-color: red; animation-name: example; animation-duration: 4s; animation-
iteration-count: 3; }

Animation-direction:

The animation-direction property specifies whether an animation should be played


forwards, backwards or in alternate cycles.

The animation-direction property can have the following values:

• normal - The animation is played as normal (forwards). This is default

• reverse - The animation is played in reverse direction (backwards)

• alternate - The animation is played forwards first, then backwards

• alternate-reverse - The animation is played backwards first, then forwards The

Speed Curve of the Animation:

The animation-timing-function property specifies the speed curve of the animation.

The animation-timing-function property can have the following values:

• ease - Specifies an animation with a slow start, then fast, then end slowly (this is
default)

• linear - Specifies an animation with the same speed from start to end

• ease-in - Specifies an animation with a slow start

• ease-out - Specifies an animation with a slow end

• ease-in-out - Specifies an animation with a slow start and end

• cubic-bezier(n,n,n,n) - Lets you define your own values in a cubic-bezier function

#div1 {animation-timing-function: linear;}


#div2 {animation-timing-function: ease;}
#div3 {animation-timing-function: ease-in;}

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 49
lOMoARcPSD|46830608

www.BrainKart.com

#div4 {animation-timing-function: ease-out;} #div5


{animation-timing-function: ease-in-out;} The fill-
mode For an Animation:

CSS animations do not affect an element before the first keyframe is played or after the last
keyframe is played. The animation-fill-mode property can override this behavior.

The animation-fill-mode property specifies a style for the target element when the animation is
not playing (before it starts, after it ends, or both).

The animation-fill-mode property can have the following values:

• none - Default value. Animation will not apply any styles to the element before or after it
is executing

• forwards - The element will retain the style values that is set by the last keyframe
(depends on animation-direction and animation-iteration-count)

• backwards - The element will get the style values that is set by the first keyframe
(depends on animation-direction), and retain this during the animation-delay period

• both - The animation will follow the rules for both forwards and backwards, extending
the animation properties in both directions

Anima on Shorthand Property:


div { anima on: example 5s linear 2s infinite
alternate;
}

User interface:

User Interface (UI) defines the way humans interact with the informa on systems. In Layman’s
term, User Interface (UI) is a series of pages, screens, bu ons, forms and other visual elements
that are used to interact with the device. Every app and every website has a user interface. The
user interface property is used to change any element into one of several standard user
interface elements.

• resize

• outline-offset

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 50
lOMoARcPSD|46830608

www.BrainKart.com

Resize Property: The resize property is used to resize a box by user. This property does not apply
to inline elements or block elements where overflow is visible. In this property, overflow must
be set to “scroll”, “auto”, or “hidden”.

Syntax:

resize: horizontal,ver cal,both;

• horizontal: This property is used to resize the width of the element.

Syntax:

resize: horizontal;

Supported Browsers: The browser supported by resize property are listed below:

Internet Explorer Not Supported

outline-offset: The outline-offset property in CSS is used to set the amount of space between an outline
and the edge or border of an element. The space between the element and its outline is transparent.
• Apple Safari 4.0

• Google Chrome 4.0

• Firefox 5.0 4.0 -moz-

• Opera 15.0

Syntax:

outline-offset: length;

Supported Browsers: The browser supported by outline-offset property are listed below:

• Apple Safari 3.1

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 51
lOMoARcPSD|46830608

www.BrainKart.com

• Google Chrome 4.0

• Firefox 3.5

• Opera 10.5

• Internet Explorer 15.0

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 52
lOMoARcPSD|46830608

www.BrainKart.com

UNIT-3

Introduc on to JavaScript

Part-b

1. Explain in details about variables and data types in java Script.?

JavaScript provides different data types to hold different types of values. There are two types of data
types in JavaScript.

1. Primi ve data type

2. Non-primi ve (reference) data type

JavaScript is a dynamic type language , means you don't need to specify type of the variable because it is
dynamically used by JavaScript engine. You need to use var here to specify the data type. It c an hold any
type of values such as numbers, strings etc. For example:

There are five types of primi ve data types in JavaScript. They are as follows:
1. var a=40;//holding number

2. var b="Rahul";//holding string

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 53
lOMoARcPSD|46830608

www.BrainKart.com

JavaScript primi ve data types

JavaScript non-primi ve data types

Data Type Descrip on

String represents sequence of characters e.g. "hello"

Number represents numeric values e.g. 100

Boolean represents boolean value either false or true

Undefined represents undefined value

Null represents null i.e. no value at all

The non-primi ve data types are as follows:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 54
lOMoARcPSD|46830608

www.BrainKart.com

Variable: local variable and

Data Type Descrip on

Object represents instance through which we can access members

Array represents group of similar values

RegExp represents regular expression

A JavaScript variable is simply a name of storage loca on. There are two types of variables in JavaScript :

There are some rules while declaring a JavaScript variable (also known as iden fiers).

1. Name must start with a le er (a to z or A to Z), underscore( _ ), or dollar( $ ) sign.

2. A er first le er we can use digits (0 to 9), for example value1.

3. JavaScript variables are case sensi ve, for example x and X are different variables.
global variable.

Correct JavaScript variables

1. var x = 10;

2. var _value="sonoo";

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 55
lOMoARcPSD|46830608

www.BrainKart.com

A JavaScript local variable is declared inside block or func on. It is accessible within the func on or block
Example of JavaScript variable

Let’s see a simple example of JavaScript variable.

<script> var

x = 10; var

y = 20; var

z=x+y;

document.w

rite(z);

</script>

Output of the above example

30

JavaScript local variable

only. For example: <script>

func on abc(){ var

x=10;//local variable

</script>

JavaScript global variable

A JavaScript global variable is accessible from any func on. A variable i.e. declared outside the func on
or declared with window object is known as global variable. For example:

<script> var

data=200;//gloabal variable

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 56
lOMoARcPSD|46830608

www.BrainKart.com

func on a(){

document.writeln(data);

func on b(){

document.writeln(data);

a();//calling JavaScript func on

b();

</script>

2. Explain in detail about operators and operator precedence in java Script.?

JavaScript Operators

JavaScript operators are symbols that are used to perform opera ons on operands. For example:

Operator Descrip on Example

+ Addi on 10+20 = 30

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 57
lOMoARcPSD|46830608

www.BrainKart.com

- Subtrac on 20-10 = 10

var sum=10+20;

Here, + is the arithme c operator and = is the assignment operator.

There are following types of operators in JavaScript.

* Mul plica on 10*20 = 200

/ Division 20/10 = 2

% Modulus (Remainder) 20%10 = 0

++ Increment var a=10; a++; Now a = 11

-- Decrement var a=10; a--; Now a = 9

1. Arithme c Operators

2. Comparison (Rela onal) Operators

3. Bitwise Operators

4. Logical Operators

5. Assignment Operators

6. Special Operators

JavaScript Arithme c Operators

Arithme c operators are used to perform arithme c opera ons on the operands. The following operators
are known as JavaScript arithme c operators.

follows:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 58
lOMoARcPSD|46830608

www.BrainKart.com

JavaScript Bitwise Operators

The bitwise operators perform bitwise opera ons on operands. The bitwise operators are as follows:

Operator Descrip on Example

&& Logical AND (10==20 && 20==33) = false

|| Logical OR (10==20 || 20==33) = false

! Logical Not !(10==20) = true

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 59
lOMoARcPSD|46830608

www.BrainKart.com

avaScript Logical Operators

JavaScript Assignment Operators

The following operators are known as JavaScript assignment operators.

Operator Descrip on

(?:) Condi onal Operator returns value based on the condi on. It is like if-else.

, Comma Operator allows mul ple expressions to be evaluated as single statement.

Delete Delete Operator deletes a property from the object.

In In Operator checks if object has the given property

instanceof checks if the object is an instance of given type

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 60
lOMoARcPSD|46830608

www.BrainKart.com

New creates an instance (object)

Operator Descrip on Example

= Assign 10+10 = 20

+= Add and assign var a=10; a+=20; Now a = 30

-= Subtract and assign var a=20; a-=10; Now a = 10

*= Mul ply and assign var a=10; a*=20; Now a = 200

/= Divide and assign var a=10; a/=2; Now a = 5

%= Modulus and assign var a=10; a%=2; Now a = 0

JavaScript Special Operators


The following operators are known as JavaScript special operators.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 61
lOMoARcPSD|46830608

www.BrainKart.com

Typeof checks the type of object.

Void it discards the expression's return value.

Yield checks what is returned in a generator by the generator's iterator.

Operator precedence:
Mul plica on (*) and division (/) have higher precedence than addi on (+) and subtrac on (-).

Expressions in parentheses are computed before the rest of the expression


Func on are executed before the result is used in the rest of the expression

Operator precedence describes the order in which opera ons are performed in an arithme c expression.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 62
lOMoARcPSD|46830608

www.BrainKart.com
Math Property Descrip on

SQRT2 Returns
square root
of 2.
PI Returns Π
value.
E\ Returns
Euler's
Constant.
LN2 Returns
natural
logarithm of
2.

3. Brief about various date and math related object with examples?

Math Object

• Math object is a built-in sta c object.

• It is used for performing complex math opera ons.

Math Proper es

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 63
lOMoARcPSD|46830608

www.BrainKart.com

LN10 Returns natural logarithm of 10.

LOG2E Returns base 2 logarithm of E.

LOG10E Returns 10 logarithm of E.

Math Methods
Methods Descrip on

abs() Returns the absolute value of a number.

acos() Returns the arccosine (in radians) of a number.

ceil() Returns the smallest integer greater than or equal to a number.

cos() Returns cosine of a number.

floor() Returns the largest integer less than or equal to a number.

log() Returns the natural logarithm (base E) of a number.

max() Returns the largest of zero or more numbers.

min() Returns the smallest of zero or more numbers.

pow() Returns base to the exponent power, that is base exponent.

Example: Simple Program on Math Object Methods

<html>
<head>
< tle>JavaScript Math Object Methods</ tle>

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 64
lOMoARcPSD|46830608

www.BrainKart.com

</head>
<body>
<script type="text/javascript">

var value = Math.abs(20);


document.write("ABS Test Value : " + value +"<br>");

var value = Math.acos(-1);


document.write("ACOS Test Value : " + value +"<br>");

var value = Math.asin(1);


document.write("ASIN Test Value : " + value +"<br>");

var value = Math.atan(.5);


document.write("ATAN Test Value : " + value +"<br>");
</script>
</body> </html>

Output

ABS Test Value : 20


ACOS Test Value : 3.141592653589793
ASIN Test Value : 1.5707963267948966
ATAN Test Value : 0.4636476090008061

2. Date Object

• Date is a data type.

• Date object manipulates date and me.

Date() constructor takes no arguments. • Date object allows you to get and
set the year, month, day, hour, minute, second and millisecond fields.

Syntax:
var variable_name = new Date();

Example:
var current_date = new Date();

Date Methods

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 65
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 66
lOMoARcPSD|46830608

www.BrainKart.com

Methods Descrip on

Date() Returns current date and me.

getDate() Returns the day of the month.

getDay() Returns the day of the week.

getFullYear() Returns the year.

getHours() Returns the hour.

getMinutes() Returns the minutes.

getSeconds() Returns the seconds.

getMilliseconds() Returns the milliseconds.

getTime() Returns the number of milliseconds since January 1, 1970 at 12:00 AM.

getTimezoneOffset() Returns the mezone offset in minutes for the current locale.

getMonth() Returns the month.

setDate() Sets the day of the month.

setFullYear() Sets the full year.

setHours() Sets the hours.

setMinutes() Sets the minutes.

setSeconds() Sets the seconds.

setMilliseconds() Sets the milliseconds.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 67
lOMoARcPSD|46830608

www.BrainKart.com

setTime() Sets the number of milliseconds since January 1, 1970 at 12:00 AM.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 68
lOMoARcPSD|46830608

www.BrainKart.com

Example : JavaScript Date() Methods Program

document.write("<b>Locale String:</b> " + d.toLocaleString()+"<br>");


document.write("<b>Hours:</b> " + d.getHours()+"<br>");
document.write("<b>Day:</b> " + d.getDay()+"<br>");
document.write("<b>Month:</b> " + d.getMonth()+"<br>");
document.write("<b>FullYear:</b> " + d.getFullYear()+"<br>");
document.write("<b>Minutes:</b> " + d.getMinutes()+"<br>");
</script>

setMonth() Sets the month.

toDateString() Returns the date por on of the Date as a human-readable string.

toLocaleString() Returns the Date object as a string.

toGMTString() Returns the Date object as a string in GMT mezone.

valueOf() Returns the primi ve value of a Date object.

<html>
<body>
<center>
<h2>Date Methods</h2>
<script type="text/javascript">
var d = new Date();

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 69
lOMoARcPSD|46830608

www.BrainKart.com

</center>
</body>
</html> Output:

4. Write a JavaScript code for valida ng new user registra on form which includes the fields like
username, password, confirm password, gender, date of birth, contact number and mail id.

<!DOCTYPE html>

<html>

<head>

< tle>Reg Form</ tle>

<style type="text/css">

body{ font-family:

Calibri;

input[type="text"] {

width: 250px;

input[type="submit"], input[type="reset"] {

width: 77px; height:

27px; posi on: rela ve;le :

180px;

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 70
lOMoARcPSD|46830608

www.BrainKart.com

form{ text-align:

center; font-family:

Calibri; font-size: 20px;

border: 3px solid black;

width: 600px; margin:

20px auto;

td {

padding: 10px;

td:first-child {

text-align: right; font-

weight: bold;

td:last-child {

text-align: le ;

</style> <script>

func on validate() {

var fname = document.reg_form.fname;

var lname = document.reg_form.lname;

var address = document.reg_form.address;

var ge nder = document.reg_form.gender;

var email = document.reg_form.email;

var mobile = document.reg_form.mobile; var course =


document.reg_form.course;

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 71
lOMoARcPSD|46830608

www.BrainKart.com

if (fname.value.length <= 0) {

alert("Name is required");

fname.focus(); return

false;

if (lname.value.length <= 0) {

alert("Last Name is required");

lname.focus(); return false;

if (address.value.length <= 0) {

alert("Address is required");

address.focus(); return

false;

if (gender.value.length <= 0) {

alert("Gender is required");

gender.focus(); return

false;

if (email.value.length <= 0) {

alert("Email Id is required");

email.focus(); return false;

if (mobile.value.length <= 0) {

alert("Mobile number is required");

mobile.focus(); return false;

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 72
lOMoARcPSD|46830608

www.BrainKart.com

if (course.value == "select course") {

alert("Course is required"); course.focus();

return false;

return false;

</script>

</head>

<body>

<center><h1>Form Valida on using HTML,CSS,JavaScript</h1></center>

<hr>

<form method="" ac on="" name="reg_form" onsubmit="return validate()" >

<td><label>Firs t Name: </label></td>

<input type="text" name="fname" placeholder="First Name" >


<h2>Registra on Form</h2>

<table>

<tr>

<td>

</td>

</tr>

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 73
lOMoARcPSD|46830608

www.BrainKart.com

<tr>

<td><label>Last Name: </label></td>

<td>

<td><label>Email Id: </label></td>

<input type="text" name="email" placeholder="[email protected]">

<td><label>Mobile: </label></td>
<input type="text" name="lname" placeholder="Last Name">

</td>

</tr>

<tr>

<td><label>Address: </label></td>

<td>

<input type="textarea" size="50" name="address" placeholder="Address">

</td>

</tr>

<tr>

<td><label>Gender: </label></td>

<td>

<input type="radio" name="gender" value="male">Male

<input type="radio" name="gender" value="femele">Female

</td>

</tr>

<tr>

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 74
lOMoARcPSD|46830608

www.BrainKart.com

<td>

<input type="submit" name="submit" value="Submit">

<input type="reset" name="reset" value="Reset" >


</td>

</tr>

<tr>

<td>

<input type="number" name="mobile">

</td>

</tr>

<tr>

<td><label>Course: </label></td>

<td>

<select name="course">

<op on value="select course">select course</op on>

<op on value="HTML">HTML</op on>

<op on value="CSS">CSS</op on>

<op on value="JavaScript">JAVASCRIPT</op on>

<op on value="Java">JAVA</op on>

</select>

</td>

</tr>

<tr>

<td>

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 75
lOMoARcPSD|46830608

www.BrainKart.com

</td>

</tr>

</table>

</form>

</body>

</html>

Output

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 76
lOMoARcPSD|46830608

www.BrainKart.com

UNIT-IV

SERVER-SIDE PROCESSING AND SCRIPTING-PHP

PHP is an open source programming and server scrip ng language that is par cularly well adapted to
Create Dynamic web pages and can be includes in HTML codes. It’s used to handle complex content,
databases, and session logging, as well as to create en re e-commerce websites. PHP is generally known
as Hypertext preprocessor but it was first known as Personal Home Page. It was Designed in 1994 by the
programmer named Rasmus Lerdorf. PHP would be rela vely simple .PHP is compa ble with a variety of
databases, including MySQL, PostgreSQL, Oracle, Sybase, Informix, and Microso SQL Server, and can
communicate with other services through protocols including LDAP, POP3, HTTP, IMAP, and COM.
And, PHP operates on a variety of pla orms, including Windows, Linux, Unix, and Mac OS X,etc.

Example of PHP Code!

<!DOCTYPE html>

<html>

<body> <?php echo "My

first PHP script!";

?>

</body>

</html>

PHP Works:

The PHP program interacts with the site server, which is the program that sends out web pages to the rest
of the world. When you type a URL into the address bar of your web browser, you’re telling the web server
at that URL to email you an HTML file. The requested file is sent by the web server in response. The HTML
file is read by your browser, and then shows the web page. When you press a source on a web page, you’re
also reques ng a file from the web server. Addi onally, when you press a web page bu on that submits a
form, the web server processes a file. When PHP is mounted, the procedure is exactly the same.
You submit a file, and the web server, which happens to be running PHP, responds with HTML, because of
PHP it all happens.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 77
lOMoARcPSD|46830608

www.BrainKart.com

Step 1 – Client send a page request to the web server.

Step 2 – Web server forwards that request to the PHP interpreter.

Step 3 – Now PHP interpreter will take the Date from Database and responce it back to the Web server.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 78
lOMoARcPSD|46830608

www.BrainKart.com

Step 4 – At last Web server responce to the client who has asked for the page request.

2. Explain PHP variables and constants?

Variables are "containers" for storing informa on.

PHP Variables

In PHP, a variable starts with the $ sign, followed by the name of the variable

Example:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 79
lOMoARcPSD|46830608

www.BrainKart.com

<?php
$txt = "Hello world!";
$x = 5;
$y = 10.5;
?>

A er the execu on of the statements above, the variable $txt will hold the value Hello world!, the
variable $x will hold the value 5, and the variable $y will hold the value 10.5.

PHP Variables

A variable can have a short name (like x and y) or a more descrip ve name (age, carname, total_volume).

Rules for PHP variables:

A variable starts with the $ sign, followed by the name of the variable

A variable name must start wi th a le er or the underscore character

A variable name cannot start with a number

A variable name can only contain alpha -numeric characters and underscores (A -z, 0-9, and _ )

Variable names are case -sensi ve ($age and $AGE are two different variables)

PHP variable names are case-sensi ve!

The PHP echo statement is o en used to output data to the screen.

The following example will show how to output text and a variable:

Output variables:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 80
lOMoARcPSD|46830608

www.BrainKart.com

Example:

<?php
$txt = "Msajce"; echo
"I love $txt!"; ?>

PHP Variables :

In PHP, variables can be declared anywhere in the script.

The scope of a variable is the part of the script where the variable can be referenced/used.
name: Specifies the name of the constant
PHP
has value: Specifies the value of the constant
three
case-insensi ve: Specifies whether the constant name should be case -insensi ve. Default is false
different variable :

• local

• global

• sta c

PHP Constants

A constant is an iden fier (name) for a simple value. The value cannot be changed during the script.

A valid constant name starts with a le er or underscore (no $ sign before the constant name).

Unlike variables, constants are automa cally global across the en re script.

Constants are like variables except that once they are defined they cannot be changed or undefined.

Create a PHP Constant:

To create a constant, use the define() func on.

Syntax define(name, value, case-insensi ve)

Parameters:

Example:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 81
lOMoARcPSD|46830608

www.BrainKart.com

<?php

// case-sensi ve constant name

define("GREETING", "Welcome to msajce!"); echo

GREETING;

?> o/p:

Welcome to msajce!

3. Explain PHP operators with example?


PHP Operators:

Operators are used to perform opera ons on variables and values.

PHP divides the operators in the following groups:

• Arithme c operators

• Assignment operators

• Comparison operators

• Increment/Decrement operators

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 82
lOMoARcPSD|46830608

www.BrainKart.com

• Logical operators

• String operators

• Array operators

• Condi onal assignment operators

PHP Arithme c Operators

The PHP arithme c operators are used with numeric values to perform common arithmet ical opera ons,
such as addi on, subtrac on, mul plica on etc.

PHP Assignment Operators:

The PHP assignment operators are used with numeric values to write a value to a variable.

The basic assignment operator in PHP is "=". It means that the le operand gets set to the value of the
assignment expression on the right.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 83
lOMoARcPSD|46830608

www.BrainKart.com

PHP Comparison Operators

The PHP comparison operators are used to compare two values (number or string):

PHP Increment / Decrement Operators

The PHP increment operators are used to increment a variable's value.

The PHP decrement operators are used to decrement a variable's value.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 84
lOMoARcPSD|46830608

www.BrainKart.com

PHP Logical Operators

The PHP logical operators are used to combine condi onal statements.

PHP String Operators

PHP has two operators that are s pecially designed for strings.

PHP Array Operators

The PHP array operators are used to compare arrays.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 85
lOMoARcPSD|46830608

www.BrainKart.com

PHP Condi onal Assignment Operators


The PHP condi onal assignment operators are used to set a value depending on condi ons:

4. Explain Flow controls and Looping in PHP? With examples.

Condi onal statements are used to perform different ac ons based on different condi ons.

Condi onal statements are flow controls.

PHP Condi onal Statements

In PHP we have the following condi onal statements:


• if statement - executes some code if one condi on is true

• if...else statement - executes some code if a condi on is true and another code if that condi on is
false

• if...elseif...else statement - executes different codes for more than two condi ons

• switch statement - selects one of many blocks of code to be executed

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 86
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 87
lOMoARcPSD|46830608

www.BrainKart.com

Example:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 88
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 89
lOMoARcPSD|46830608

www.BrainKart.com

o/p:

o/p:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 90
lOMoARcPSD|46830608

www.BrainKart.com

o/p:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 91
lOMoARcPSD|46830608

www.BrainKart.com

o/p:

5. Explain arrays and strings in PHP?

An array is a special variable, which can hold more than one value at a me.

If you have a list of items (a list of car names, for example), storing the cars in single variables could look
like this:

An array can hold many values under a single name, and you can access the values by referring to an
index number.

Create an Array in PHP

In PHP, the array() func on is used to create an array:

array();

In PHP, there are three types of arrays:

• Indexed arrays - Arrays with a numeric index

• Associa ve arrays - Arrays with named keys

• Mul dimensional arrays - Arrays containing one or more arrays

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 92
lOMoARcPSD|46830608

www.BrainKart.com

PHP String Func ons:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 93
lOMoARcPSD|46830608

www.BrainKart.com

6. Explain the func ons in PHP?

The real power of PHP comes from its func ons.

PHP has more than 1000 built-in func ons, and in addi on you can create your own custom func ons.

PHP Built-in Func ons

PHP has over 1000 built-in func ons that can be called directly, from within a script, to perform a specific
task.

PHP User Defined Func ons

Besides the built-in PHP func ons, it is possible to create your own func ons.

• A func on is a block of statements that can be used repeatedly in a program.

• A func on will not execute automa cally when a page loads.

• A func on will be executed by a call to the func on.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 94
lOMoARcPSD|46830608

www.BrainKart.com

Create a User Defined Func on in PHP

A user-defined func on declara on starts w ith the word func on:

Syntax

func on func onName (){

code to be exeuted;

A func on name must start with a le er or an underscore. Func on names are NOT case -sensi ve.

In the example below, we create a func on named "writeMsg()". The openi ng curly brace ( { ) indicates
the beginning of the func on code, and the closing curly brace ( } ) indicates the end of the func on. The
func on outputs "Hello world!". To call the func on, just write its name followed by brackets ():

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 95
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 96
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 97
lOMoARcPSD|46830608

www.BrainKart.com

7. Explain File Handling and uploading in PHP?

PHP file handling:

File handling is an important part of any web applica on. You o en need to open and process a file for
different tasks.

PHP Manipula ng Files:

PHP has several func ons for crea ng, reading, uploading, and edi ng files.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 98
lOMoARcPSD|46830608

www.BrainKart.com

PHP Read File - fread()

The fread() func on reads from an open file.

The first parameter of fread() contains the name of the file to read from and the second parameter
specifies the maximum number of bytes to read.

The following PHP code reads the "webdic onary.txt" file to the end:

fread($myfile,filesize("webdic onary.txt"));

PHP Close File - fclose()

The fclose() func on is used to close an open file.

It's a good programming prac ce to close all files a er you have finished with them. You don't want an
open file running around on your server taking up resources!

The fclose() requires the name of the file (or a variable that holds the filename) we want to close:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 99
lOMoARcPSD|46830608

www.BrainKart.com

PHP Read Single Line - fgets()

The fgets() func on is used to read a single line from a file.

The example below outputs the first line of the "webdic onary.txt" file: Example

PHP Check End-Of-File - feof()

The feof() func on checks if the "end -of-file" (EOF) has been reached.

The feof() func on is useful for looping through data of unknown length.

The example below reads the "webdic onary.txt" file line by line, un l end -of-file is reached:

PHP Read Single Character - fgetc()

The fgetc() func on is used to read a single character from a file.

The example below reads the "webdic onary.txt" file character by character, un l end-of-file is reached:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 100
lOMoARcPSD|46830608

www.BrainKart.com

PHP Create File - fopen()

The fopen() func on is also used to create a file. Maybe a li le confusing, but in PHP, a file is created
the same func on used to open files.

If you use fopen() on a file that does not exist, it will create it, given that the file is opened for wri ng (w)
or appending (a).

The example below creates a new file called "tes ile.txt". The file will b e created in the same directory
where the PHP code resides:

PHP Write to File - fwrite()

The fwrite() func on is used to write to a file.

The first parameter of fwrite() contains the name of the file to write to and the second parameter is the
using string to be wri en.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 101
lOMoARcPSD|46830608

www.BrainKart.com

The example below writes a couple of names into a new file called "newfile.txt":

PHP Overwri ng

Now that "newfile.txt" contains some data we can show what happens when we open an exis ng file for
wri ng. All the exis ng data will be ERASED and we start with an empty file.

PHP Append Text

You can append data to a file by using the "a" mode. The "a" mode appends text to the end of the file,
while the "w" mode overrides (and erases) the old content of the file.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 102
lOMoARcPSD|46830608

www.BrainKart.com

PHP File Upload:

With PHP, it is easy to upload files to the server.

However, with ease comes danger, so always be careful when allowing file uploads!

Configure The "php.ini" File

First, ensure that PHP is configured to allow file uploads.

In your "php.ini" file, search for the file_uploads direc ve.

8. Explain E-mail basics in PHP?


PHP Mail Introduc on

The mail() func on allows you to send emails directly from a script.

Requirements

For the mail func ons to be available, PHP requires an installed and working email syst em. The program
to be used is defined by the configura on se ngs in the php.ini file.

Installa on

The mail func ons are part of the PHP core. There is no installa on needed to use these func ons.

Run me Configura on

The behavior of the mail func ons is affected by se ngs in php.ini:

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 103
lOMoARcPSD|46830608

www.BrainKart.com

PHP mail() Func on

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 104
lOMoARcPSD|46830608

www.BrainKart.com

9. Explain Database with PHP in Detail?

PHP MySQL Database

With PHP, you can connect to and manipulate databases.

MySQL is the most popular database system used with PHP.

MySQL

• MySQL is a database system used on the web

• MySQL is a database system that runs on a server

• MySQL is ideal for both small and large applica ons

• MySQL is very fast, reliable, and easy to use

• MySQL uses standard SQL

• MySQL compiles on a number of pla orms

• MySQL is free to download and use

• MySQL is developed, distributed, and supported by Oracle Corpora on

• MySQL is named a er co-founder Monty Widenius's daughter: My

The data in a MySQL database are stored in tables. A table is a collec on of related data, and it consists of
columns and rows.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 105
lOMoARcPSD|46830608

www.BrainKart.com

Databases are useful for storing informa on categorically. A company may have a database with the
following tables:

• Employees

• Products

• Customers

• Orders

PHP + MySQL Database System

PHP combined with MySQL are cross -pla orm (you can develop in Windows and serve on a Unix

We can query a database for specific informa on and have a recordset returned.

Look at the following query (using standard SQL):

SELECT LastName FROM Employees

The query above selects all the data in the "LastName" column from the "Employees" table.

MySQL is the- de facto standard database system for web sites with HUGE volumes of both data and end
-

Another great thing about MySQL is that it can be scaled down to support embedded database
• pla orm)

Database Queries

A query is a ques on or a request. users (like

Facebook, Twi er, and Wikipedia).

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 106
lOMoARcPSD|46830608

www.BrainKart.com

applica ons.

PHP 5 and later can work with a MySQL database using:

• MySQLi extension (the "i" stands for improved)

• PDO (PHP Data Objects) we demonstrate three ways of working with PHP and MySQL:

• MySQLi (object-oriented)

• MySQLi (procedural)

• PDO

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 107
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 108
lOMoARcPSD|46830608

www.BrainKart.com

UNIT-V
Servlets and Database Connectivity

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.
Java Servlets often serve the same purpose as programs
implemented using the Common Gateway Interface (CGI). But
Servlets offer several advantages in comparison with the CGI.
• Performance is signi icantly better.
• Servlets execute within the address space of a Web
server. It is not necessary to create a separate process to
handle each client request.
• Servlets are platform-independent because they are
written in Java.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 109
lOMoARcPSD|46830608

www.BrainKart.com

• Java security manager on the server enforces a set of


restrictions to protect the resources on a server
machine. So servlets are trusted.
• The full functionality of the Java class libraries is
available to a servlet. It can communicate with applets,
databases, or other software via the sockets and RMI
mechanisms that you have seen already.
Servlets Architecture The following diagram shows the
position of Servlets in a Web
Application.

Servlets Tasks
Servlets perform the following major tasks −
• Read the explicit data sent by the clients (browsers). This
includes an HTML form on a Web page or it could also
come from an applet or a custom HTTP client program.
• Read the implicit HTTP request data sent by the clients
(browsers). This includes cookies, media types and

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 110
lOMoARcPSD|46830608

www.BrainKart.com

compression schemes the browser understands, and so


forth.
• Process the data and generate the results. This process
may require talking to a database, executing an RMI or
CORBA call, invoking a Web service, or computing the
response directly.
• Send the explicit data (i.e., the document) to the clients
(browsers). This document can be sent in a variety of
formats, including text (HTML or XML), binary (GIF
images), Excel, etc.
• Send the implicit HTTP response to the clients
(browsers). This includes telling the browsers or other
clients what type of document is being returned (e.g.,
HTML), setting cookies and caching parameters, and
other such tasks.
Servlets Packages
Java Servlets are Java classes run by a web server that has an
interpreter that supports the Java Servlet speci ication.
Servlets can be created using the javax.servlet and
javax.servlet.http packages, which are a standard part of the
Java's enterprise edition, an expanded version of the Java class
library that supports largescale development projects.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 111
lOMoARcPSD|46830608

www.BrainKart.com

These classes implement the Java Servlet and JSP


speci ications. At the time of writing this tutorial, the versions
are Java Servlet 2.5 and JSP 2.1.
Java servlets have been created and compiled just like any
other Java class. After you install the servlet packages and add
them to your computer's Classpath, you can compile servlets
with the JDK's Java compiler or any other current compiler.
Architecture Diagram
The following igure depicts a typical servlet life-cycle
scenario.

• FirstAdvantages
the HTTPOfrequests
Servlets :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 of a single instance of the servlet.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 112
lOMoARcPSD|46830608

www.BrainKart.com

1. As servlets support all protocols like FTP, SMTP, HTTP


etc. they can be used to develop any kind of web
applications like E-commerce, Content management
systems, chat based or ile based web applications etc.

2. As servlets are fully compatible with Java, you can make


use of wide range of available Java APIs inside the
servlets.

3. As they run on Java enabled servers, You need not to


worry about garbage collection and memory leaks. JVM
handles them for you.

4. Since servlets are written in Java, they are portable and


platform independent. You can run them on any
operating systems and on any web servers available
today.

5. Servlets inherit security features from JVM and web


server.

6. As servlets are written in Java, you can extend them


according to your requirements.

7. As servlets are compiled into bytecodes, they are faster


than any other server-side scripting languages.

2.EXPLAIN SERVLET LIFECYCLE.?

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 113
lOMoARcPSD|46830608

www.BrainKart.com

A servlet life cycle can be defined as the entire process from its creation
till the destruction. The following are the paths followed by a servlet.
• 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.
Now let us discuss the life cycle methods in detail.

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, just as with the init method of applets.
The servlet is normally created when a user first invokes a URL
corresponding to the servlet, but you can also specify that the servlet
be loaded when the server is first started.
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
formatted response back to the client.
Each time the server receives a request for a servlet, the server spawns
a new thread and calls service. The service() method checks the HTTP

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 114
lOMoARcPSD|46830608

www.BrainKart.com

request type (GET, POST, PUT, DELETE, etc.) and calls doGet, doPost,
doPut, doDelete, etc. methods as appropriate.
Here is the signature of this method −
public void service(ServletRequest request, ServletResponse response)
throws ServletException, IOException { }

The service () method is called by the container and service method


invokes doGet, doPost, doPut, doDelete, etc. methods as appropriate.
So you have nothing to do with service() method but you override either
doGet() or doPost() depending on what type of request you receive from
the client.
The doGet() and doPost() are most frequently used methods with in
each service request. Here is the signature of these two methods.

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 }

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 115
lOMoARcPSD|46830608

www.BrainKart.com

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, write cookie lists or hit counts to
disk, 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...
}

3.Explain Form GET and POST actions in servlets?


GET Method The GET method sends the encoded user
information appended to the page request. The page and the
encoded information are separated by the ? (question mark)
symbol as follows − http://www.test.com/hello?key1 =
value1&key2 = value2
The GET method is the default method to pass information
from browser to web server and it produces a long string that
appears in your browser's Location:box. Never use the GET
method if you have password or other sensitive information
to pass to the server. The GET method has size limitation: only
1024 characters can be used in a request string.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 116
lOMoARcPSD|46830608

www.BrainKart.com

This information is passed using QUERY_STRING header and


will be accessible through QUERY_STRING environment
variable and Servlet handles this type of requests using
doGet() method.
POST Method
A generally more reliable method of passing information to a
backend program is the POST method. This packages the
information in exactly the same way as GET method, but
instead of sending it as a text string after a ? (question mark)
in the URL it sends it as a separate message. This message
comes to the backend program in the form of the standard
input which you can parse and use for your processing. Servlet
handles this type of requests using doPost() method.
Reading Form Data using Servlet Servlets handles form data
parsing automatically using the following methods depending
on the situation −
• 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.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 117
lOMoARcPSD|46830608

www.BrainKart.com

GET Method Example using URL


Here is a simple URL which will pass two values to HelloForm
program using GET method.
http://localhost:8080/HelloForm? irst_name =
ZARA&last_name = ALI
Given below is the HelloForm.java servlet program to handle
input given by web browser. We are going to use
getParameter() method which makes it very easy to access
passed information −
// Import required java libraries
import java.io.*; import
javax.servlet.*; import
javax.servlet.http.*;

// Extend HttpServlet class public class HelloForm extends


HttpServlet {

public void doGet(HttpServletRequest request,


HttpServletResponse response) throws ServletException,
IOException {

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 118
lOMoARcPSD|46830608

www.BrainKart.com

// Set response content type


response.setContentType("text/html");

PrintWriter out = response.getWriter(); String title =


"Using GET Method to Read Form Data"; String docType =
"<!doctype html public \"-//w3c//dtd html 4.0 " +
"transitional//en\">\n";

out.println(docType + "<html>\n" +
"<head><title>" + title + "</title></head>\n" + "<body
bgcolor = \"#f0f0f0\">\n" + "<h1 align = \"center\">"
+ title + "</h1>\n" + "<ul>\n" + " <li><b>First
Name</b>: " + request.getParameter(" irst_name")
+ "\n" + " <li><b>Last Name</b>: " +
request.getParameter("last_name") + "\n" + "</ul>\n"
+ "</body>" + "</html>" );
}
}
Assuming your environment is set up properly, compile
HelloForm.java as follows −
$ javac HelloForm.java If everything goes ine, above
compilation would produce HelloForm.class ile. Next you
would have to copy this class ile in

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 119
lOMoARcPSD|46830608

www.BrainKart.com

<Tomcatinstallationdirectory>/webapps/ROOT/WEB-
INF/classes and create following entries in web.xml ile
located in <Tomcat-installation-
directory>/webapps/ROOT/WEBINF/ <servlet>

</servlet>

<servlet-mapping> <servlet-name>HelloForm</servlet-
name> <url-pattern>/HelloForm</url-pattern> </servlet-
mapping> Now
type http://localhost:8080/HelloForm? irst_name=ZARA&last
_name=ALI in your browser's Location:box and make sure you
already started tomcat server, before iring above command in
the browser. This would generate following result −
Using GET Method to Read Form Data
• First Name: ZARA
• Last Name: ALI
GET Method Example Using Form
Here is a simple example which passes two values using HTML
FORM and submit button. We are going to use same Servlet
HelloForm to handle this input.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 120
lOMoARcPSD|46830608

www.BrainKart.com

<html> <body> <form action = "HelloForm" method =


"GET"> First Name: <input type = "text" name =
" irst_name"> <br /> Last Name: <input type = "text"
name = "last_name" /> <input type = "submit" value =
"Submit" /> </form> </body>
</html>
Keep this HTML in a ile Hello.htm and put it in
<Tomcatinstallationdirectory>/webapps/ROOT directory.
When you would access http://localhost:8080/Hello.htm, here
is the actual output of the above form.
First Name: Last Name:

Try to enter First Name and Last Name and then click submit
button to see the result on your local machine where tomcat
is running. Based on the input provided, it will generate
similar result as mentioned in the above example.
POST Method Example Using Form
Let us do little modi ication in the above servlet, so that it can
handle GET as well as POST methods. Below is
HelloForm.java servlet program to handle input given by
web browser using GET or POST methods. // Import required
java libraries import java.io.*; import javax.servlet.*; import
javax.servlet.http.*;

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 121
lOMoARcPSD|46830608

www.BrainKart.com

// Extend HttpServlet class public class HelloForm extends


HttpServlet {

// Method to handle GET method request.


public void doGet(HttpServletRequest request,
HttpServletResponse response) throws ServletException,
IOException {

// Set response content type


response.setContentType("text/html");

PrintWriter out = response.getWriter();


String title = "Using GET Method to Read Form Dat a";

String docType = "<!doctype html public \"-


//w3c//dtd html 4.0 " + "transitional//en\">\n";

out.println(docType + "<html>\n" +

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 122
lOMoARcPSD|46830608

www.BrainKart.com

"<head><title>" + title + "</title></head>\n" +


"<body bgcolor = \"#f0f0f0\">\n" + "<h1 align =
\"center\">" + title + "</h1>\n" + "<ul>\n" + "
<li><b>First Name</b>: " +
request.getParameter(" irst_name") + "\n" + "
<li><b>Last Name</b>: " +
request.getParameter("last_name") + "\n" + "</ul>\n"
+ "</body>" "</html>" );
}
// Method to handle POST method request.
public void doPost(HttpServletRequest request,
HttpServletResponse response) throws ServletException,
IOException {

doGet(request, response);
}
}
Now compile and deploy the above Servlet and test it using
Hello.htm with the POST method as follows −

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 123
lOMoARcPSD|46830608

www.BrainKart.com

<html> <body>

<form action = "HelloForm" method = "POST" >


First Name: <input type = "text" name = " irst_name">

Last Name: <input type = "text" name = "last_name" />


<input type = "submit" value = "Submit" />
<br />

</form> </body> </html>


Here is the actual output of the above form, Try to enter First
and Last Name and then click submit button to see the result
on your local machine where tomcat is running.
First Name: Last Name:

4. Explain Cookies in servlets?


Cookies in Servlet
A cookie is a small piece of information that is persisted
between the multiple client requests.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 124
lOMoARcPSD|46830608

www.BrainKart.com

A cookie has a name, a single value, and optional attributes


such as a comment, path and domain quali iers, a maximum
age, and a version number.
How Cookie works
By default, each request is considered as a new request. 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.

Types of Cookie
There are 2 types of cookies in servlets.
PlayNext
Unmute Current TimeA 0:00
/
DurationA 18:10 Loaded: 0.37%
A

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 125
lOMoARcPSD|46830608

www.BrainKart.com

Fullscreen

Backward Skip 10sPlay VideoForward Skip 10s


1. Non-persistent cookie
2. 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 signout.
Advantage of Cookies

1. Simplest technique of maintaining the state.

2. Cookies are maintained at client side.


Disadvantage of Cookies

1. It will not work if cookie is disabled from the browser.

2. Only textual information can be set in Cookie object.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 126
lOMoARcPSD|46830608

www.BrainKart.com

Note: Gmail uses cookie technique for login. If you disable the
cookie, gmail won't work. Cookie class
javax.servlet.http.Cookie class provides the functionality of
using cookies. It provides a lot of useful methods for cookies.
Constructor of Cookie class

Constructor Description

Cookie() constructs a cookie.

Cookie(String name, constructs a cookie with a


String value) speci ied name and value.

Useful Methods of Cookie class


There are given some commonly used methods of the Cookie
class.

Method Description

public void Sets the maximum age of


setMaxAge(int the cookie in seconds.
expiry)

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 127
lOMoARcPSD|46830608

www.BrainKart.com

public String Returns the name of the


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

public String Returns the value of the


getValue() cookie.

public changes
void the name of the
setName(String
name)

public void changes the value of the


setValue(String cookie.
value)

Other methods required for using Cookies

For adding cookie or getting the value from the cookie, we need some
methods provided by other interfaces. They are:

1. public void addCookie(Cookie ck)


2. public Cookie[] getCookies()

To create Cookie
Let's see the simple code to create cookie.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 128
lOMoARcPSD|46830608

www.BrainKart.com

Cookie ck=new Cookie("user","sonoo jaiswal");//creating


cookie object response.addCookie(ck);//adding cookie in
the response To delete Cookie
Let's see the simple code to delete cookie. It is mainly used to
logout or signout the user.
Cookie ck=new Cookie("user","");//deleting value of cooki
e ck.setMaxAge(0);//changing the maximum age to 0
secon ds
response.addCookie(ck);//adding cookie in the response
How to get Cookies?
Let's see the simple code to get all the 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
}

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 129
lOMoARcPSD|46830608

www.BrainKart.com

Simple example of Servlet Cookies


In this example, we are storing the name of the user in the
cookie object and accessing it in another servlet. As we know
well that session corresponds to the particular user. So if you
access it from too many browsers with different values, you
will get the different value.

index.html <form action="servlet1" method="post">


Name:<input type="text" name="userName"/><br/> <input
type="submit" value="go"/> </form>
FirstServlet.java import
java.io.*; import
javax.servlet.*; import
javax.servlet.http.*;

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 130
lOMoARcPSD|46830608

www.BrainKart.com

public class FirstServlet extends HttpServlet {

public void doPost(HttpServletRequest request, HttpSer

response.setContentType("text/html");
PrintWriter out = response.getWriter();
vletResponse response){
try{

String n=request.getParameter("userName");
out.print("Welcome "+n);

Cookie ck=new Cookie("uname",n);//creating cookie ob


ject response.addCookie(ck);//adding cookie in the
respons e

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 131
lOMoARcPSD|46830608

www.BrainKart.com

//creating submit button out.print("<form


action='servlet2'>"); out.print("<input
type='submit' value='go'>");
out.print("</form>");

}catch(Exception e){System.out.println(e);}
out.close();

}
}
SecondServlet.java import
java.io.*; import
javax.servlet.*; import
javax.servlet.http.*;
public class SecondServlet
extends HttpServlet {

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 132
lOMoARcPSD|46830608

www.BrainKart.com

public void doPost(HttpServletRequest request, HttpServ


letResponse response){
try{

<servlet -mapping>
response.setContentType("text/html");
<servlet -name>s1</servlet
PrintWriter -name>
out = response.getWriter();
<url-pattern>/servlet1</url-pattern>

Cookie ck[]=request.getCookies();
out.print("Hello "+ck[0].getValue());

out.close();

}catch(Exception e){System.out.println(e);}
}

}
web.xml <web-app>

<servlet> <servlet-name>s1</servlet-name> <servlet-


class>FirstServlet</servlet-class> </servlet>

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 133
lOMoARcPSD|46830608

www.BrainKart.com

</servlet-mapping>

<servlet> <servlet-name>s2</servlet-name> <servlet-


class>SecondServlet</servlet-class> </servlet>

<servlet-mapping> <servlet-name>s2</servlet-name>
<url-pattern>/servlet2</url-pattern> </servlet-
mapping>

</web-app>
Output

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 134
lOMoARcPSD|46830608

www.BrainKart.com

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 135
lOMoARcPSD|46830608

www.BrainKart.com

5.Explain Database Connectivity using JDBC?


Database connectivity in servlet. There are different
approaches to communicating with databases through servlet
components. We need to perform the servlet to database
communication due to the following main reasons: -
• To save the inputs coming from the end -user through
forms to database software. Example: - Email Id
registration.
• To save the result generated by servlet Component in
database software. Example: - Bill generation
• To get inputs from the database software to the Servlet
component.
statement generation
Example:- Balance inquiry, account

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 136
lOMoARcPSD|46830608

www.BrainKart.com

For servlet to database software


communication, we need to place JDBC
code/Hibernate code/Spring
JDBC/Spring ORM/Spring Data code in
Servlet Component. Since JDBC is the most
basic one therefore here we will discuss
servlet to database communication
through JDBC code.
Different Approaches for Database Connectivity in Servlet
There are 4 approaches for Database Connectivity in Servlet.
Approach-1:- Writing logics in multiple methods.
• Create JDBC Connection in the init()
• Use the JDBC Connection in the service(-,-)/doXxx(-,-)
• Close JDBC Connection in the destroy method.
Here JDBC Connection (con) must be taken as an instance
variable of the Servlet Component class.
The disadvantage of this approach:- Since JDBC Connection is
an instance variable, it is not thread-safe by default. So, we
should use the synchronization concept.
Advantage:- All the requests coming to Servlet Component
will use a single JDBC Connection to interact with database
software, due to this the performance will be improved.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 137
lOMoARcPSD|46830608

www.BrainKart.com

Note:- This approach is outdated and nowadays no one is


using this approach (except the maintenance side).
Approach-2:- Write all the logics in service(-,-) or doXxx(,-)
method.
• Create JDBC Connection in service(-,-
)/doXxx(-,-) method.
• Use JDBC Connection in service(-,-)/doXxx(-,-) method.
• Close JDBC Connection in service(-,-)/doXxx(-,-) method.
Note:- Here JDBC Connection (con) will be a local variable to
service(-,-)/doXxx(-,-) method.
Disadvantage:- The JDBC Connection (con) is a local variable
so, every request which is given to the servlet will create one
JDBC Connection object with database software, hence the
performance will be poor.
Advantage:- Since JDBC Connection is a local variable, it is
thread-safe by default. Hence there is no need to work with
the synchronization concept.
Approach-3:- Use server-managed JDBC connection from
the connection pool.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 138
lOMoARcPSD|46830608

www.BrainKart.com

• Get JDBC Connection object from JDBC Connection pool


being from service(-,-)/doXxx(-,-) • Use JDBC Connection
object in service(-,-)/doXxx(-,-) • Return JDBC connection
back to JDBC connection pool being from service(-,-
)/doXxx(-,-)
Advantage:- Here JDBC connection is local to service(-
,)/doXxx(-,-) method. So, it becomes thread-safe.
We can get all the advantages of the JDBC connection pool. The
main advantages of the JDBC connection pool are,
• Reusability of JDBC connection objects.
• With minimum JDBC connection objects, we can make
max clients/requests talking with database software.
• Programmer is free from creating connection objects,
managing connection objects, and destroying connection
objects.
Web servers are also supplying existing created JDBC
connections. Therefore programmers should not worry about
how to create JDBC connections, manage them and destroy
them. These tasks will be done by the web server itself. The
programmer will just fetch those JDBC connections and use
them in the servlet component. Moreover, one JDBC
connection can be used for multiple requests, therefore
performance will be good compared to approach2.
Approach4:- Use DAO class for the persistence operation.

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 139
lOMoARcPSD|46830608

www.BrainKart.com

What is DAO:- The Java class/component that separates


persistence logic from other logics of the application and
makes that logic as lexible logic to modify and reusable logic
is called DAO (Data access object).
In this approach, we can use either approach-2 or approach3
to get the JDBC connection. The main task in this approach,
• Write JDBC code (persistence logic) in DAO class either by
using direct connection object or server-managed pooled
connection object.
• Create a DAO class object in Servlet Component and use its
persistence logic in Servlet Component

https://play.google.com/store/apps/details?id=info.therithal.brainkart.annauniversitynotes 140
Click on Subject/Paper under Semester to enter.
Environmental Sciences
Professional English and Sustainability -
Professional English - - II - HS3252 Discrete Mathematics - GE3451
I - HS3152 MA3354
Statistics and Theory of Computation
Matrices and Calculus Numerical Methods - Digital Principles and - CS3452
3rd Semester

4th Semester
- MA3151 MA3251 Computer Organization
1st Semester

2nd Semester

- CS3351 Artificial Intelligence


Engineering Graphics and Machine Learning
Engineering Physics - - CS3491
- GE3251 Foundation of Data
PH3151
Science - CS3352
Database Management
Physics for
Engineering Chemistry System - CS3492
Information Science Data Structures and
- CY3151 - PH3256 Algorithms - CD3291
Web Essentials -
Basic Electrical and IT3401
Problem Solving and Electronics Engineering - Object Oriented
Python Programming - BE3251 Programming - CS3391 Introduction to
GE3151 Operating Systems -
Programming in C -
CS3451
CS3251

Computer Networks -
CS3591
Object Oriented
Full Stack Web Software Engineering - Human Values and
5th Semester

Development - IT3501 CCS356 Ethics - GE3791


7th Semester

8th Semester
6th Semester

Distributed Computing Open Elective-1 Open Elective 2


- CS3551 Project Work /
Elective-3 Open Elective 3 Intership
Embedded Systems and
IoT - CS3691 Elective-4
Open Elective 4

Elective 1 Elective-5
Management Elective

Elective-6
Elective 2
All Computer Engg Subjects - [ B.E., M.E., ] (Click on Subjects to enter)
Programming in C Computer Networks Operating Systems
Programming and Data Programming and Data Problem Solving and Python
Structures I Structure II Programming
Database Management Systems Computer Architecture Analog and Digital
Communication
Design and Analysis of Microprocessors and Object Oriented Analysis
Algorithms Microcontrollers and Design
Software Engineering Discrete Mathematics Internet Programming
Theory of Computation Computer Graphics Distributed Systems
Mobile Computing Compiler Design Digital Signal Processing
Artificial Intelligence Software Testing Grid and Cloud Computing
Data Ware Housing and Data Cryptography and Resource Management
Mining Network Security Techniques
Service Oriented Architecture Embedded and Real Time Multi - Core Architectures
Systems and Programming
Probability and Queueing Theory Physics for Information Transforms and Partial
Science Differential Equations
Technical English Engineering Physics Engineering Chemistry
Engineering Graphics Total Quality Professional Ethics in
Management Engineering
Basic Electrical and Electronics Problem Solving and Environmental Science and
and Measurement Engineering Python Programming Engineering

You might also like