CS8651 – Internet Programming Department of CSE

ANJALAI AMMAL MAHALINGAM ENGINEERING COLLEGE

KOVILVENNI

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

CS8651 – Internet Programming

Question Bank – Unit - I

1. What is web 2.0?

A Web 2.0 site may allow users to interact and collaborate with each other in a social media
dialogue as creators of user-generated content in a virtual community, in contrast to Web sites
where people are limited to the passive viewing of content. Examples of Web 2.0 include social
networking sites, blogs, wikis, folksonomies, video sharing sites, hosted services, Web
applications, and mashups.
2. Define RIA.
A Rich Internet Application (RIA) is a Web application designed to deliver the same features and
functions normally associated with deskop applications. RIAs generally split the processing
across the Internet/network divide by locating the user interface and related activity and
capability on the client side, and the data manipulation and operation on the application server
side.
3. Define Collaboration.
Collaboration is a process defined by the recursive interaction of knowledge and mutual learning
between two or more people who are working together, in an intellectual endeavour, toward a
common goal which is typically creative in nature.
4. List the collaborations tools.
AnswerGaedan, Thinkature, DotVoting, ePlals, Glass, Tricider
5. What are the collaborative processes?
 Team creation
 Idea Generation
 Decision Making
 Work or Production
 Evaluation or Recap
6. Define Web services.
A Web service is a method of communication between two electronic devices over a network. It
is a software function provided at a network address over the Web with the service always on as
in the concept of utility computing.
7. Write short notes on Social networking.
A social network is a social structure made up of a set of social actors (such as individuals or
organizations) and a set of the dyadic ties between these actors. The social network perspective
provides a set of methods for analyzing the structure of whole social entities as well as a variety
of theories explaining the patterns observed in these structures.
8. Define Website.
A website is hosted on at least one web server, accessible via a network such as the Internet or a
private local area network through an Internet address known as a uniform resource locator
URL). All publicly accessible websites collectively constitute the World Wide Web.
CS8651 – Internet Programming Department of CSE

9. Differences between websites and web server.

Website:
A website is a set of linked documents associated with a particular person, organization or topic
that is held on a computer system and can be accessed as part of the World Wide Web. (Not to be
confused with: Web page, a document on the World Wide Web written in HTML and displayed
in a web browser.)
Web server:
The web server on the other side is a computer program, which delivers content, such as websites
or web pages, for example, over the World Wide Web from a web server to your computer.
10. Define Internet.
The Internet is a global system of interconnected computer networks that use the standard Internet
protocol suite (TCP/IP) to link several billion devices worldwide. It is a network of networks that
consists of millions of private, public, academic, business, and government networks of local to
global scope, linked by a broad array of electronic, wireless, and optical networking technologies.
11. Define Intranet.
An intranet is a computer network that uses Internet Protocol technology to share information,
operational systems, or computing services within an organization. This term is used in contrast
to extranet, a network between organizations, and instead refers to a network within an
organization. Sometimes, the term refers only to the organization's internal website, but may be a
more extensive part of the organization's information technology infrastructure, and may be
composed of multiple local area networks. The objective is to organize each individual's desktop
with minimal cost, time and effort to be more productive, cost efficient, timely, and competitive.
12. Differentiate between internet and intranet.
internet intranet
It is general to PCs all over the world It is specific to few PCs
It has wider access and provides a better It is restricted.
access to websites to large population
It is not as safe as Intranet. It can be safely private as per the need.

13. Define HTML.

HTML is a simple web page description language, which enables document creation for the web.
HTML is the set of mark-up symbols or codes placed in a file intended for display on the web
browser page. These mark-up symbol and codes identify structural elements such as paragraphs,
heading, and lists. HTML can be used to place media (such as graphics, video, and audio) on the
Web page and describe fill-in-forms. A method is an implementation of an objects behavior.
14. Explain briefly HTTP connection.
It is a communication channel between web browser and web server. It begins on the client side
with the browser sending a request to the web server for a document.
Request Header Fields are
1. From
2. Reference
3. If_modified_since
4. Pragma
5. User Agent
15. Define cascading.
Cascading refers to a certain set of rules that browsers use, in cascading order, to determine how
to use the style information. Such a set of rules is useful in the event of conflicting style
information because the rules would give the browser a way to determine which style is given
precedence.
CS8651 – Internet Programming Department of CSE

16. State the use of web server logs and lists the contents of a message log.
A server log is a log file (or several files) automatically created and maintained by a server of
activity performed by it. A typical example is a web server log which maintains a history of page
requests. The W3C maintains a standard format (the Common Log Format) for web server log
files, but other proprietary formats exist. The message log is used by a number of processes to
provide debugging and troubleshooting information. You can view the message log from the
process monitor after clicking on the details hyperlink for a process and the by clicking on the
message log hyperlink in the actions area.
17. How will you create a password field in a HTML form?
<input type=”password” name=”pwd” size=15>
18. List any four common browsers.
 Google Chrome
 Netscape Navigator
 Microsoft Internet Explorer
 Mozilla Firefox
19. State the uses of internet protocol.
 IP function: transfer data from source device to destination device.
 IP source software creates a packet representing the data.
 Header: source and destination IP addresses, length of data and other information.
20. Define tags. What are the two different types of tags?
Tags signal the browser to inform about the formatting details.ie how the content should be
displayed in the browser screen. Tags are enclosed between “<” and”>”. Standalone tag only start
tag is present and no end tag. Example <BR> and container tag have start and end tag will be
present .Example <html>…. </html>.
21. What are the rules to define a tag?
Attributes should be placed inside start tag, appears as Name-value pairs separted by blank
spaces, Attributes should have only one value, values should be enclosed within either single(‘) or
double (“) quotes.
22. Differentiate between standalone and container tag.
Standalone Container
Only start tag is present and no end tag. Both start and end tage will be present
Can have only attributes and no parameters Can have both attributes and parameters
Example: <BR> Example <html>…</html>

23. What is the use of <pre> tag in HTML?

The pre tag can be used to preserve the white spaces and lines in the text.
24. What is cellpadding and cell spacing attributes?
The cellpadding allows having some space between the contents of each cell and its borders. The
distance between each cell is called cell spacing.
25. What is the need of using form in HTML?
Form is a typical layout on the web page by which user can interact with the web page. The
components that can be placed on the form are text box, check box, radio buttons, and push
buttons and so on. Thus form is typically used to create an interactive Graphical User Interface.
26. What is the purpose of using frames in HTML?
The HTML frames allows the web designer to present the web document in multiple views.
Using multiple views one can keep the formation visible and at the same time other views can be
scrolled or replaced.
CS8651 – Internet Programming Department of CSE

27. What is the need for special character in HTML?

There are some symbols that cannot be used directly in HTML document. For example <(less
than) because this symbol is also used along with the tag. Hence this is called a special symbol
and can be denoted with the help of entity reference
28. State how an unrecognized element or attribute treated by the HTML document?
If any unrecocognized element or attribute is written then the HTML document simply displays
the contents. Forexample <title>testing</title> will display the string “testing” on the web page.
It will not display it as a title of the web page.
29. What is the use of hyperlink tag in HTML?
The hyperlink tag is used to link logically with other page. Using this tag a web link can be
specified. The <a> tag is used to specify the hyperlink in HTML.
30. What is BODY in HTML document?
The effects which we want in the window are mentioned with the help of tags in the body. It is
the place where the actual data is written in html. All the changes can be viewed by changing the
tags content in the body whereas the head part is the introduction part and the body is the actual
content part.<BODY>data content</BODY>.
31. What is an image map?
An image map allows you to link to several web pages through one image. Simply define shapes
within images and link these to the pages you want. Here’s a video to help you learn more about
images and links in HTML
32. What are style sheets?
The style sheets are the collection of styles that can be either embedded within the HTML
documents or can be externally applied. The Cascading style sheet is a markup language used to
apply the styles to HTML elements.
33. What is selector string? Specify any three forms of selectors.
The rule set in CSS consists of selector string which is basically an HTML element. These
selectors can be defined with the help of properties and values.
34. What is the use of Universal selector?
Using the universal selector the values can be defined for all the elements in the document. It is
denoted by *.
35. What is generic class selector?
The generic class applied to any tag in the HTML document. And thus the values defined within
that generic selector can be applied to the corresponding tag. The class selector must be preceded
by the dot operator.
36. What are the advantages of External style sheet?
When we use external style sheet then the style is defined in one file and actual contents of the
web are defined in another file. Hence if we want to change the style of presentation of web page
then we can simply modify the file in which the style is defined.
37. What is the difference between external and embedded style sheet?
The external style sheet is a kind of style sheet in which the styles are defined in a separate.css
file and this file is mentioned at the beginning of the HTML document. When we need to apply
the particular style to more than one web documents then the external style sheet is used. The
embedded style sheet is a method in which the style is specified within the HTML document
itself. It is not defined in separate file. Due to embedded style sheet unique style can be applied to
all the elements.
38. What do you mean by the term inline element?
The inline elements are those elements that do not form new blocks of content. The content is
distributed in lines.
39. What are the various style sheets?
CS8651 – Internet Programming Department of CSE

The style sheets are classified into three types such as inline, embedded or internal and external or
imported style sheets.
40. Explain briefly inline, internal and external style sheets.
Inline
If only a small piece of code has to be styled then inline style sheets can be used.
Embedded
Embedded style sheets are put between the <head> </head> tags.
External
If you want to apply a style to all the pages within your website by changing just one style sheet,
then external style sheets can be used.
41. Give example for inline style sheet.
<h2>InLINE CSS</h2>
<p style=”color:sienna;margin-left:20px”>
The style ATTRIBUTE we are able to modify the appearance of HTML elements </p>
42. How will you embedded the external style sheet?
In external style sheet is ideal when the style is applied to many pages. With an external style
sheet, you can change the look of an entire Web site by changing just one file. Each page must
include a link to the style sheet with the <link> tag. The <link> tag goes inside the head section:
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
An external style sheet can be written in any text editor. The file should not contain any html tags.
The style sheet file must be saved with a .css extension. An example of a style sheet file is shown
below:
"myStyle.css":
body {
background-color: lightblue;}
h1 {
color: navy;
margin-left: 20px;}
43. How will you include CSS in a web site?
Inline
Inline styles are when you just insert the type of style you want inside another tag, using the style
attribute. This is usually the least useful way to use CSS.
<p style="width:100%; color:#660099; text-align:right; background-color:#ffcc00;" >
Embedded
Styles can also be placed in the document using the <style> tag. The <style> tag is usually placed
in the head section of the document, where it will apply to the whole document.
<style> <!--
p { color:#009900;
font-family:"comic sans ms",sans-serif; }
h1 { color:#660000; font-size:12pt; }
</style>
External styles
Styles can also be set in an external style sheet which is linked to the page with a <link> tag. For
example the style sheet for this site is included like this:
<link rel="stylesheet" type="text/css" href="class.css" />
44. What is the purpose of CSS Box Model and mention its parts also.
The CSS box model is essentially a box that wraps around HTML elements, and it consists of:
margins, borders, padding, and the actual content.
The different parts are:
CS8651 – Internet Programming Department of CSE

• Margin
• Border
• Padding
• Content
Part- B
1. Explain WWW and HTTP protocol.
WWW
The term WWW refers to the World Wide Web or simply the Web. The World Wide Web
consists of all the public Web sites connected to the Internet worldwide, including the client
devices (such as computers and cell phones) that access Web content. The WWW is just one of
many applications of the Internet and computer networks. The World Web is based on these
technologies:
1. HTML - Hypertext Markup Language
2. HTTP - Hypertext Transfer Protocol
3. Web servers and Web browsers
HTTP
HTTP (Hypertext Transfer Protocol) is the set of rules for transferring files (text, graphic images,
sound, video, and other multimedia files) on the World Wide Web. HTTP is an application
protocol that runs on top of the TCP/IP suite of protocols. HTTP concepts include (as the
Hypertext part of the name implies) the idea that files can contain references to other files whose
selection will elicit additional transfer requests. Any Web server machine contains, in addition to
the Web page files it can serve, an HTTP daemon, a program that is designed to wait for HTTP
requests and handle them when they arrive. Your Web browser is an HTTP client, sending
requests to server machines. When the browser user enters file requests by either "opening" a
Web file (typing in a Uniform Resource Locator or URL) or clicking on a hypertext link, the
browser builds an HTTP request and sends it to the Internet Protocol address (IP address)
indicated by the URL. The HTTP daemon in the destination server machine receives the request
and sends back the requested file or files associated with the request. (A Web page often
consists of more than one file.)
2. Discuss the structure of the HTTP request message.
Structure of the request:
start line
header field(s)
blank line
optional body

1. Start line Example: GET / HTTP/1.1

Three space-separated parts:
HTTP request method
Request - URI
HTTP version

Request URI
Uniform Resource Identifier (URI)
Syntax: scheme : scheme-depend-part
Ex: In http://www.example.com/ the scheme is http
Request-URI is the portion of the requested URI that follows the host name (which is supplied by
the required Host
header field)
Ex: / is Request-URI portion of http://www.example.com/
CS8651 – Internet Programming Department of CSE

Request methods:
GET
• Used if link is clicked or address typed in browser
• No body in request with GET method
POST
• Used when submit button is clicked on a form
• Form information contained in body of request
HEAD
• Requests that only header fields (no body) be returned in the response
• PUT
• DELETE
• TRACE
• OPTIONS
2. Header field structure:
– field name : field value
Syntax
– Field name is not case sensitive
– Field value may continue on multiple lines by starting continuation lines with white space
– Field values may contain MIME types, quality values, and wildcard characters (*’s)
3. MIME
– Convention for specifying content type of a message
– In HTTP, typically used to specify content type of the body of the response
– MIME content type syntax:
– top-level type / subtype
– Examples: text/html, image/jpeg
– Example header field with quality values:
accept:
text/xml,text/html;q=0.9,
text/plain;q=0.8, image/jpeg,
image/gif;q=0.2,*/*;q=0.1
– Quality value applies to all preceding items
– Higher the value, higher the preference
– Note use of wildcards to specify quality 0.1 for any MIME type not specified earlier
4. Common header fields:
– Host: host name from URL (required)
– User-Agent: type of browser sending request
– Accept: MIME types of acceptable documents
– Connection: value close tells server to close connection after single request/response
– Content-Type: MIME type of (POST) body, normally application/x-www-form-urlencoded
– Content-Length: bytes in body
Referer: URL of document containing link that supplied URI for this HTTP request
3. Discuss the structure of the HTTP Response message.
Structure of the response:
start line
header field(s)
blank line
optional body

Status line
Example: HTTP/1.1 200 OK
Three space-separated parts:
CS8651 – Internet Programming Department of CSE

HTTP Version
Status code
Reason phrase (intended for human use)
Status code
Three digit number
First digit is class of the status code

1 Informational
2 Success
3 Redirection (alternate URL is supplied)
4 Client Error
5 Server Error
– Other two digits provide additional information
• Header Fields
– Connection, Content-Type, Content-Length
– Date: date and time at which response was generated (required)
– Location: alternate URI if status is redirection
– Last-Modified: date and time the requested resource was last modified on the server
– Expires: date and time after which the client’s copy of the resource will be out-of-date
– ETag: a unique identifier for this version of the requested resource (changes if resource
changes)
• Client Caching
– A cache is a local copy of information obtained from some other source
– Most web browsers use cache to store requested resources so that subsequent requests to the
same resource will not necessarily require an HTTP request/response
• Ex: icon appearing multiple times in a Web page
• Cache advantages
– (Much) faster than HTTP request/response
– Less network traffic
– Less load on server
• Cache disadvantage
– Cached copy of resource may be invalid (inconsistent with remote version)
• Validating cached resource:
– Send HTTP HEAD request and check Last-Modified or ETag header in response
– Compare current date/time with Expires header sent in response containing resource
– If no Expires header was sent, use heuristic algorithm to estimate value for Expires
– Ex: Expires = 0.01 * (Date – Last-Modified) + Date
• Character sets
– Every document is represented by a string of integer values (code points)
– The mapping from code points to characters is defined by a character set
– Some header fields have character set values:
– Accept- Charset: request header listing character sets that the client can recognize
• Ex: accept- charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
– Content-Type: can include character set used to represent the body of the HTTP message
• Ex: Content-Type: text/html; charset=UTF-8
– Technically, many “character sets” are actually character encodings
– An encoding represents code points using variable-length byte strings
– Most common examples are Unicode-based encodings UTF-8 and UTF-16
IANA maintains complete list of Internet-recognized character sets/encodings
CS8651 – Internet Programming Department of CSE

4. Explain HTML elements and the types of lists supported by HTML in details.
HTML element
An HTML element is an individual component of an HTML document or web page, once this has
been parsed into the Document Object Model. HTML is composed of a tree of HTML elements
and other nodes, such as text nodes. Each element can have HTML attributes specified. Elements
can also have content, including other elements and text. HTML elements represent semantics, or
meaning. For example, the title element represents the title of the document.

Heading Tags
Any document starts with a heading. You can use different sizes for your headings. HTML also
has six levels of headings, which use the elements <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>.
While displaying any heading, browser adds one line before and one line after that heading.
Example
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
Paragraph Tag
The <p> tag offers a way to structure your text into different paragraphs. Each paragraph of text
should go in between an opening <p> and a closing </p> tag as shown below in the example:
Example
<p>Here is a first paragraph of text.</p>
Line Break Tag
Whenever you use the <br /> element, anything following it starts from the next line. This tag is
an example of an empty element, where you do not need opening and closing tags, as there is
nothing to go in between them.
Example
<p>Hello<br />
You delivered your assignment ontime.<br />
Thanks<br />
Centering Content
You can use <center> tag to put any content in the center of the page or any table cell.
Example
<center>
<p>This text is in the center.</p>
</center>
Horizontal Lines
Horizontal lines are used to visually break up sections of a document. The <hr> tag creates a line
from the current position in the document to the right margin and breaks the line accordingly.
Example
<hr />
Nonbreaking Spaces
you should use a nonbreaking space entity &nbsp; instead of a normal space. For example, when
coding the "12 Angry Men" in a paragraph, you should use something similar to the following
code:
Example
<p>An example of this technique appears in the movie "12&nbsp;Angry&nbsp;Men."</p>

HTML Lists
CS8651 – Internet Programming Department of CSE

HTML offers authors several mechanisms for specifying lists of information. All lists must
contain one or more list elements.
Unordered HTML List
The first item
The second item
The third item
The fourth item
Ordered HTML List
Example
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
Ordered information.
1. The first item
2. The second item
3. The third item
4. The fourth item
5. HTML Description List
Example
<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>
Definitions.
The first item
Description of item
The second item
Description of item
Example
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
5. Discuss the various features available in HTML to format the text with example.
Basic functionality
– Server calls on TCP software and waits for connection request to one or more ports
– When a connection request is received, the server dedicates a subtask (Single copy of
server software handling a single client connection)
CS8651-Internet Programming Department of CSE

– Subtask establish connection and receives request

– Subtask examines the host header field to determine the host and invokes software for this host
– Virtual host software Map Request-URI to specific resource on the server.
– It maps Request-URI to specific resource associated with the virtual host
• File: Return file in HTTP response (MIME Type)
• Program: Run program and return output in HTTP response
• Log information about the request and response such as IP address and the status code in a plain-text
file.
• If the TCP connection is kept alive , the server subtask continues to monitor the connection, the
client send another request or initiates a connection close.
Few Definitions
• All modern servers concurrently process multiple requests
• Multiple copies of the server running simultaneously(Concurrency)
• Subtask Single copy of server software handling a single client connection
• Virtual Host HTTP request include a host header field
• Multiple host names mapped by a DNS to a single IP address
• Web server determine which virtual host is being requested by examining the host header field.
Server Configuration and Tuning
• Modern servers have large number of Configuration parameters
• Server Configuration broken into two areas:
– External Communication
– Internal Processing
• In Tomcat two separate Java Packages:
– Coyote
– Catalina
• Coyote Provides HTTP 1.1 communication
– Catalina Actual Servlet Container
Coyote parameters affecting External Communication
 IP addresses and TCP ports
 Number of subtasks created when server initialized
 Max number of threads allowed to exist simultaneously
 Max no of TCP connection request that will be queued if server is running its max no of threads. If
queue full the received connection request is refused.
 “Keep-alive” time for inactive TCP connections
• Settings of the parameter affect the performance of the server.
• Tuning the Server
– Changing the values of these and similar parameters in order to optimize performance
• Tuning is done by trial and error
• Load generation or stress test tools used to simulate request to a web server helpful for
experimenting with tuning parameters
Service has Five Components
• Connector, Host, Logger, Realm, and Valve
• Connector is a coyote component handles HTTP communication
• Clicking on the connector will produce the window containing the dropdown menus of possible
action that can be performed for this component
Defining Virtual Hosts
48
 CS8651-Internet Programming Department of CSE

Configuring Host Elements

• The Host element represents a virtual host, which is an association of a network name for a
server (such as www.mycompany.com) with the particular server on which Tomcat is running.
Host Attributes
• The attributes shown in following table may be viewed, set, or modified for a Host.
• Web server logs record information about server activity
• Access log is a file that records information about every HTTP request processed by the server
• Message logs  variety of debugging and other information generated by web server
• Access logging is performed by adding a valve component
Logging
• Web server logs record information about server activity
• Access log is a file that records information about every HTTP request processed by the server
• Message logs  variety of debugging and other information generated by web server
• Access logging is performed by adding a valve component
Access Control
• Provide automatic password protection for resources
• Access control:
– Password protection (e.g., admin pages)
• Users and roles defined in
conf/tomcat-users.xml
– Deny access to machines
• Useful for denying access to certain users by denying access from the machines they use
List of denied machines maintained in RemoteHostValve (deny by host name) or RemoteAddressValve
(deny by IP address)
6. i) Explain how tables can be inserted into HTML document with example.

 The HTML table model allows authors to arrange data -- text, preformatted text, images, links,
forms, form fields, other tables, etc. -- into rows and columns of cells.
 Each table may have an associated caption that provides a short description of the table's purpose.
A longer description may also be for the benefit of people using speech or Braille-based user
agents.
 Table rows may be grouped into a head, foot, and body sections, Row groups convey additional
structural information and may be rendered by user agents in ways that emphasize this structure.
 User agents may exploit the head/body/foot division to support scrolling of body sections
independently of the head and foot sections.
 When long tables are printed, the head and foot information may be repeated on each page that
contains table data.
 Authors may also group columns to provide additional structural information that may be
exploited by user agents.
 Furthermore, authors may declare column properties at the start of a table definition in a way that
enables user agents to render the table incrementally rather than having to wait for all the table
data to arrive before rendering.
 Table cells may either contain "header" information or "data. Cells may span multiple rows and
columns.

49
CS8651-Internet Programming Department of CSE

Here's a simple table that illustrates some of the features of the HTML table model. The following table
definition:

<TABLE border="1"
summary="This table gives some statistics about fruit
flies: average height and weight, and percentage
with red eyes (for both males and females).">
<CAPTION><EM>A test table with merged cells</EM></CAPTION>
<TR><TH rowspan="2"><TH colspan="2">Average
<TH rowspan="2">Red<BR>eyes
<TR><TH>height<TH>weight
<TR><TH>Males<TD>1.9<TD>0.003<TD>40%
<TR><TH>Females<TD>1.7<TD>0.002<TD>43%
</TABLE>

--------------------------------------------------------------------------------------------------------------------------------------
ii) What is the significance of using forms on the web page? Enlist various components used on form.
A webform, or HTML form on a web page allows a user to enter data that is sent to a server for processing. Forms
can resemble paper or database forms because web users fill out the forms using checkboxes, radio buttons, or text
fields. For example, forms can be used to enter shipping or credit card data to order a product, or can be used to
retrieve search results from a search engine.

Forms are enclosed in the HTML form tag. This tag specifies the communication endpoint the data entered into the
form should be submitted to, and the method of submitting the data, GET or POST.

Elements
Forms can be made up of standard graphical user interface elements:

 text input — a simple text box that allows input of a single line of text (an alternative, password, is used for
security purposes, in which the character typed in are invisible or replaced by symbols such as *)
 radio — a radio button
 file — a file select control for uploading a file
 reset — a reset button that, when activated, tells the browser to restore the values to their initial values.
 submit — a button that tells the browser to take action on the form (typically to send it to a server)
 textarea — much like the text input field except a textarea allows for multiple rows of data to be shown and
entered

50
 CS8651-Internet Programming Department of CSE

 select — a drop-down list that displays a list of items a user can select from

uses of various elements:

 a text box asking for your name
 a pair of radio buttons asking you to pick your sex
 a select box giving you a list of eye colors to choose from
 a pair of check boxes to click on if they apply to you
 a text area to describe your athletic ability
 a submit button to send it to the server
These basic elements provide most common graphical user interface (GUI) elements, but not all. For example, there
are no equivalents to a combo box, tree view, or grid view.
A grid view, however, can be mimicked by using a standard HTML table with each cell containing a text input
element.
A tree view could also be mimicked through nested tables or, more semantically appropriately, nested lists.
In both cases, a server side process is responsible for processing the information, while JavaScript handles the user-
interaction.
Implementations of these interface elements are available through JavaScript libraries such as jQuery.
HTML 4 introduced the label tag, which is intended to represent a caption in a user interface, and can be associated
with a specific form control by specifying the id attribute of the control in the label tag's for attribute.
HTML 5 introduces a number of input tags that can be represented by other interface elements. Some are based upon
text input fields and are intended to input and validate specific common data.
These include email to enter email addresses, tel for telephone numbers, number for numeric values.
There are additional attributes to specify required fields, fields that should have keyboard focus when the web page
containing the form is loaded, and placeholder text that is displayed within the field but is not user input.
The date input type displays a calendar from which the user can select a date or date range.
And the color input type can be represented as an input text simply checking the value entered is a correct hexadecimal
representation of a color, according to the specification, or a color picker widget.
7. Discuss how to create list and frame using HTML. Give Example.
HTML frames are used to divide your browser window into multiple sections where each section can load a separate
HTML document. A collection of frames in the browser window is known as a frameset. The window is divided into
frames in a similar way the tables are organized: into rows and columns.
Creating Frames
To use frames on a page we use <frameset> tag instead of <body> tag. The <frameset> tag defines how to divide the
window into frames. The rows attribute of <frameset> tag defines horizontal frames and cols attribute defines vertical
frames. Each frame is indicated by <frame> tag and it defines which HTML document shall open into the frame.

Example

51
CS8651-Internet Programming Department of CSE

Following is the example to create three horizontal frames:

<!DOCTYPE html>
<html>
<head>
<title>HTML Frames</title>
</head>
<frameset rows="10%,80%,10%">
<frame name="top" src="/html/top_frame.htm" />
<frame name="main" src="/html/main_frame.htm" />
<frame name="bottom" src="/html/bottom_frame.htm" />
<noframes>
<body>
Your browser does not support frames.
</body>
</noframes>
</frameset>
</html>

This will produce following result:

The <frame> Tag Attributes

Following are important attributes of <frame> tag:

Attribute Description

src This attribute is used to give the file name that should be loaded in the
frame. Its value can be any URL. For example,
src="/html/top_frame.htm" will load an HTML file available in html
directory.

name This attribute allows you to give a name to a frame. It is used to

indicate which frame a document should be loaded into. This is
especially important when you want to create links in one frame that
load pages into an another frame, in which case the second frame

52
CS8651-Internet Programming Department of CSE

needs a name to identify itself as the target of the link.

frameborder This attribute specifies whether or not the borders of that frame are
shown; it overrides the value given in the frameborder attribute on the
<frameset> tag if one is given, and this can take values either 1 (yes)
or 0 (no).

marginwidth This attribute allows you to specify the width of the space between
the left and right of the frame's borders and the frame's content. The
value is given in pixels. For example marginwidth="10".

marginheight This attribute allows you to specify the height of the space between
the top and bottom of the frame's borders and its contents. The value
is given in pixels. For example marginheight="10".

noresize By default you can resize any frame by clicking and dragging on the
borders of a frame. The noresize attribute prevents a user from being
able to resize the frame. For example noresize="noresize".

scrolling This attribute controls the appearance of the scrollbars that appear on
the frame. This takes values either "yes", "no" or "auto". For example
scrolling="no" means it should not have scroll bars.

longdesc This attribute allows you to provide a link to another page containing
a long description of the contents of the frame. For example
longdesc="framedescription.htm"

List :
HTML offers web authors three ways for specifying lists of information. All lists must contain one or more list
elements. Lists may contain:

 <ul> - An unordered list. This will list items using plain bullets.
 <ol> - An ordered list. This will use different schemes of numbers to list your items.
 <dl> - A definition list. This arranges your items in the same way as they are arranged in a dictionary.
HTML Unordered Lists
An unordered list is a collection of related items that have no special order or sequence. This list is created by using
HTML <ul> tag. Each item in the list is marked with a bullet.
Example
53
CS8651-Internet Programming Department of CSE

<!DOCTYPE html>
<html>
<head>
<title>HTML Unordered List</title>
</head>
<body>
<ul>
<li>Beetroot</li>
<li>Ginger</li>
<li>Potato</li>
<li>Radish</li>
</ul>
</body>
</html>
This will produce following result:
 Beetroot
 Ginger
 Potato
 Radish
The type Attribute
You can use type attribute for <ul> tag to specify the type of bullet you like. By default it is a disc. Following are the
possible options:

<ul type="square">
<ul type="disc">
<ul type="circle">

Example
Following is an example where we used <ul type="square">

<!DOCTYPE html>
<html>
<head>
<title>HTML Unordered List</title>
</head>
<body>
<ul type="square">
<li>Beetroot</li>
<li>Ginger</li>
<li>Potato</li>
<li>Radish</li>
</ul>
</body>
</html>
This will produce following result:

54
 CS8651-Internet Programming Department of CSE

 Beetroot
 Ginger
 Potato
 Radish
The start Attribute
You can use start attribute for <ol> tag to specify the starting point of numbering you need. Following are the
possible options:

<ol type="1" start="4"> - Numerals starts with 4.

<ol type="I" start="4"> - Numerals starts with IV.
<ol type="i" start="4"> - Numerals starts with iv.
<ol type="a" start="4"> - Letters starts with d.
<ol type="A" start="4"> - Letters starts with D.

Example
Following is an example where we used <ol type="i" start="4" >

<!DOCTYPE html>
<html>
<head>
<title>HTML Ordered List</title>
</head>
<body>
<ol type="i" start="4">
<li>Beetroot</li>
<li>Ginger</li>
<li>Potato</li>
<li>Radish</li>
</ol>
</body>
</html>
This will produce following result:

iv. Beetroot
v. Ginger
vi. Potato
vii. Radish
8. Explain the capabilities of Web Server (APR/MAY 2013)
Basic functionality
• Server calls on TCP software and waits for connection req to one or more ports
• When a connection request is received , the server dedicates a subtask(Single copy of server

55
CS8651-Internet Programming Department of CSE

software handling a single client connection)

• Subtask establish connection and receives request
• Subtask examines the host header field to determine the host and invokes software for this host
• Virtual host software Map Request-URI to specific resource on the server.
• It maps Request-URI to specific resource associated with the virtual host
– File: Return file in HTTP response (MIME Type)
– Program: Run program and return output in HTTP response

• Log information about the request and response such as IP address and the status code in a plain-
text file.
• If the TCP connection is kept alive , the server subtask continues to monitor the connection, the
client send another request or initiates a connection close.
Few Definitions
• All modern servers concurrently process multiple requests
• Multiple copies of the server running simultaneously(Concurrency)
• Subtask Single copy of server software handling a single client connection
• Virtual Host HTTP request include a host header field
• Multiple host names mapped by a DNS to a single IP address
• Web server determine which virtual host is being requested by examining the host header field.
Server Configuration and Tuning
• Modern servers have large number of Configuration parameters
• Server Configuration broken into two areas:
– External Communication
– Internal Processing
• In Tomcat two separate Java Packages:
– Coyote
– Catalina
• Coyote Provides HTTP 1.1 communication
– Catalina Actual Servlet Container
Coyote parameters affecting External Communication
 IP addresses and TCP ports
 Number of subtasks created when server initialized
 Max number of threads allowed to exist simultaneously
 Max no of TCP connection request that will be queued if server is running its max no of threads.
If queue full the received connection request is refused.
 “Keep-alive” time for inactive TCP connections
• Settings of the parameter affect the performance of the server.
• Tuning the Server
– Changing the values of these and similar parameters in order to optimize performance
• Tuning is done by trial and error
• Load generation or stress test tools used to simulate request to a web server helpful for
experimenting with tuning parameters
Service has Five Components
• Connector, Host, Logger, Realm, and Valve
• Connector is a coyote component handles HTTP communication
• Clicking on the connector will produce the window containing the dropdown menus of possible
56
 CS8651-Internet Programming Department of CSE

action that can be performed for this component

Defining Virtual Hosts
Configuring Host Elements
• The Host element represents a virtual host, which is an association of a network name for a server
(such as www.mycompany.com) with the particular server on which Tomcat is running.
Host Attributes
• The attributes shown in following table may be viewed, set, or modified for a Host.
• Web server logs record information about server activity
• Access log is a file that records information about every HTTP request processed by the server
• Message logs  variety of debugging and other information generated by web server
• Access logging is performed by adding a valve component
Logging
• Web server logs record information about server activity
• Access log is a file that records information about every HTTP request processed by the server
• Message logs  variety of debugging and other information generated by web server
• Access logging is performed by adding a valve component
Access Control
• Provide automatic password protection for resources
• Access control:
– Password protection (e.g., admin pages)
• Users and roles defined in
conf/tomcat-users.xml
– Deny access to machines
• Useful for denying access to certain users by denying access from the machines
they use
List of denied machines maintained in RemoteHostValve (deny by host name) or RemoteAddressValve
(deny by IP address)
9. Explain about the XHTML DTD with an Example.
DTD's
XHTML documents have three parts: the DOCTYPE (which contains the DTD declaration), the head and the body.
To create web pages that properly conform to the XHTML 1.0 standard, each page must include a DTD
declaration; either strict, transitional, or frameset.
1. Strict
You should use the strict DTD when your XHTML pages will be marked up cleanly, free of presentational
clutter. You use the strict DTD together with cascading style sheets, because it doesn’t allow attributes like
"bgcolor" to be set for the <body> tag, etc.
The strict DTD looks like this:
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Example
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>

57
CS8651-Internet Programming Department of CSE

<title> Strict DTD XHTML Example </title>

</head><body><p>
Please Choose a Day:
<br /><br />
<select name="day">
<option selected="selected">Monday</option>
<option>Tuesday</option>
<option>Wednesday</option>
</select>
</p></body>
</html>
2. Transitional
The transitional DTD should be used when you need to take advantage of the presentational features that are
available through HTML. You should also use the transitional DTD when you want to support older browsers that
don’t have built-in support for cascading style sheets.
The transitional DTD looks like this:

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Example
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title> Transitional DTD XHTML Example </title>
</head>

<body bgcolor="#FFFFFF" link="#000000" text="red">

<p>This is a transitional XHTML example</p>
</body>
</html>
3. Frameset
You should use the
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" frameset DTD
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> when your
XHTML page will
contain frames. The frameset DTD looks like this:
Example
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title> Frameset DTD XHTML Example </title> </head>
<frameset cols="100,*">
<frame src="toc.html" />
58
 CS8651-Internet Programming Department of CSE

<frame src="intro.html" name="content" />

</frameset> </html>
10. Explain the significance of XHTML with the help of a real time application. Write necessary code snippets
(MAY/JUNE 2014)
Extensible Hypertext Markup Language (XHTML) is a family of XML markup languages that mirror or extend
versions of the widely used Hypertext Markup Language (HTML), the language in which Web pages are
formulated.
Significance
 Sustainability.
Web applications tend towards XML. Using XHTML now instead of HTML makes any future conversion of the
website easier.
 Extensibility.
Owing to the extensibility of XML, XHTML documents can be supplemented with other forms of markup,
MathML (Math Markup Language) SVG (Scalable Vector Graphics) or your own markup variants, thanks to the
use of namespaces.
 Compatibility.
Because XHTML documents are written in compliance with the rules of XML, XML-processing programmes
can effortlessly convert an XHTML file to another format (e.g. PDF, RSS or RTF).
 Efficiency of processing applications.
Once browsers support XHTML documents and the strict rules of XML, they will become quicker thanks to
shorter error processing routines. At present, a great deal of the processing power of a browser is still spent on
liberal error processing of documents containing malformed HTML markup.
Features
 XHTML requires strict adherence to coding rules.
 XHTML encourages a more structured and conceptual way of thinking about content and, combined with
the style sheet, a more creative way of displaying it.
 XHTML makes it easier for people to dream up and add new elements.
Code snippets
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Page Title</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" charset="utf-8"/>
</head>
<body>
</body>
</html>
11. Explain about Style Rule Cascading and Inheritance
Rule cascading:
*{ font-weight : bold } applies to every element of HTML
#p1, #p3 { background-color : aqua }
#p3{ font-weight : bold }
What if more than one style declaration applies to a property of an element?
• Multiple declaration
• Browser applies rule cascading
• A multistage sorting process that selects a single declaration that supply the property value
• The CSS rule cascade determines which style rule’s declaration applies

59
CS8651-Internet Programming Department of CSE

• Once declaration identified, associate origin and weight with every declaration
• PERSON WHO WROTE THE DOCUMENT
• PERSON WHO IS VIEWING THE DOCUMENT
• PERSON WHO WROTE THE BROWSER SOFTWARE
Origin of a declaration is one of the following:
• Author-> declaration is part of an external or embed style sheet or part of the value specified by
style attribute
• User agent –>A browser define default style property values for HTML elements
• User-> Modern browsers allow users to provide a style sheet

• User style rules defined in two ways:

• Edit|Preferences|Appearance, Fonts and colors panels allow a user to select various style options
• User can explicitly create a style sheet file the browser will input when it is started
• Features provided by IE6
• Tools|Internet Options
• Two weight values
• Normal
• Important
• User/important highest priority in CSS to accommodate users with special needs

• Rules made important by adding “!important”:

Cascading order
What style will be used when there is more than one style specified for an HTML element?
all the styles will "cascade" into a new "virtual" style sheet by the following rules, where number four has the
highest priority:
60
 CS8651-Internet Programming Department of CSE

1. Browser default
2. External style sheet
3. Internal style sheet (in the head section)
4. Inline style (inside an HTML element)
So, an inline style (inside an HTML element) has the highest priority, which means that it will override a style
defined inside the <head> tag, or in an external style sheet, or in a browser (a default value).
Note: If the link to the external style sheet is placed after the internal style sheet in HTML <head>, the
external style sheet will override the internal style sheet!
Style Inheritance
• Cascading based on structure of style sheets
• Inheritance based on tree structure of document
• What if no style declaration applies to a property of an element?
• Generally, the property value is inherited from the nearest ancestor element that has a value for the
property
• If no ancestor has a value (or the property does not inherit) then CSS defines an initial value that is used
• Property values:
o Specified: value contained in declaration
• Absolute: value can be determined without reference to context (e.g., 2cm)
• Relative: value depends on context (e.g., larger)
o Computed: browser performs calculation depends on particular relative value
o absolute representation of relative value (e.g., larger might be 1.2 x parent font size)
o Actual: value actually used by browser (e.g., computed value might be rounded)
• Most properties inherit computed value
o Exception discussed later: line-height
• A little thought can usually tell you whether a property inherits or not
o Example: height does not inherit
12. Explain any eight CSS text properties.
A font is a mapping from code points toGlyphs glyph

Character cell(content area)

A font family is a collection of related fonts(typically differ in size, weight, etc.)

• font-family property can accept a list offamilies, including generic font families

61
CS8651-Internet Programming Department of CSE

LENGTH SPECIFICATION IN CSS:

Many properties, such as font-size,have a value that is a CSS length
• All CSS length values except 0 need units

Reference font defines em and ex units

– Normally, reference font is the font of theelement being styled
– Exception: Using em/ex to specify value for font-size
FONT PROPERTIES:
Other ways to specify value forfont-size:
– Percentage (of parent font-size)
– Absolute size keyword: xx-small, x-small,small, medium (initial value), large,x-large, xx-large
• User agent specific; should differ by ~ 20%
– Relative size keyword: smaller, larger

62
CS8651-Internet Programming Department of CSE

LINE BOXES:
Text is rendered using line boxes

• Height of line box given by line-height

– Initial value: normal (i.e., cell height;relationship with em height is font-specific)
– Other values (following are equivalent):

font shortcut property:

equals to

TEXT FORMATTING AND TEXT COLOR:

63
 CS8651-Internet Programming Department of CSE

Font color specified by color property

• Two primary ways of specifying colors:
– Color name: black, gray, silver, white, red, lime, blue, yellow, aqua, fuchsia, maroon, green, navy, olive, teal,
purple, full list at
http://www.w3.org/TR/SVG11/types.html#ColorKeywords
– red/green/blue (RGB) values

13. Explain about the various style sheets with examples. (Internal,External,Inline) (APR/MAY 2013)
1. To create an inline style
a. Add the style attribute to the HTML tag.
b. The style declaration must be enclosed within double quotation marks.
2. To create an embedded style
a. Insert a <style> tag within the head section of HTML file.
b. Within the <style> tag, enclose the style declarations need to the entire Web page.
c. The style sheet language identifies the type of style used in the document.
d. The default and the most common language is “text/css” for use with CSS.
3. To create an External styles
a. Create a text file containing style declarations
b. Create a link to that file in each page of the Web site using a <link> tag.
c. Specify the link attributes, such as href, rel, and type.
d. Link a style sheet, the value of the href attribute should be the “URL” of the linked document,
the value of the rel attribute should be “stylesheet” and the value of the type attribute should be
64
 CS8651-Internet Programming Department of CSE

“text/css”.
EXTERNAL.CSS:
body{ background-color: gray;}
p { color: blue; }
h3{ color: white; }
EXTERNAL.HTML:
<html>
<head>
<link rel="stylesheet" type="text/css" href="EXTERNAL.css" /><!—Link tag for External CSS-->
</head>
<body>
<h3> A White Header </h3>
<p> This paragraph has a blue font.
The background color of this page is gray because
we changed it with CSS! </p>
</body>
</html>

INTERNAL.HTML:
<html>
<head>
<style> <!—Style tag for Internal CSS-->
body { background-color: blue; }
p { color: white; }
</style>
</head>
<body>
<h2>Internal CSS</h2>
<p>This page uses internal CSS. Using the style tag we are able to modify
the appearance of HTML elements.</p>
</body>
</html>

INLINE.HTML:
<html>
<head>
</head>
<body>
<h2>InLINE CSS</h2>
<p style="color:sienna;margin-left:20px"><!—Style Attribute(INLINE)-->
This page uses INLINE CSS. Using the style ATTRIBUTE we are able to modify
the appearance of HTML elements.
</p>
</body>
</html>
14 Difference between web browser and web server

65
CS8651-Internet Programming Department of CSE

Web server and web browser are the terms which are commonly used for website. The basic purpose of
both is to develop a platform for internet web directory. So that any users can anytime access any kind of
website. Major difference between them is on their function and how they perform their functions. Check
for the detail of both topics before understanding the differences between them.

Web Server:

Web server is a computer system, which provides the web pages via HTTP (Hypertext Transfer
Protocol). IP address and a domain name is essential for every web server. Whenever, you insert a URL
or web address into your web browser, this sends request to the web address where domain name of your
URL is already saved. Then this server collects the all information of your web page and sends to
browser, which you see in form of web page on your browser. Making a web server is not a difficult job.
You can convert your computer into a web server with the help of any server software and connecting the
computer to the internet. Lot of web server software are available in the market in shape of NCSA,
Apache, Microsoft and Netscape. Storing, processing and delivering web pages to clients is its main
function. All the communication between client (web browser) and server takes place via HTTP.

Web Browser:

Web browser is a client, program, software or tool through which we sent HTTP request to web server.
The main purpose of web browser is to locate the content on the World Wide Web and display in the
shape of web page, image, audio or video form. You can call it a client server because it contacts the web
server for desired information. If the requested data is available in the web server data then it will send
back the requested information again via web browser. Microsoft Internet Explorer, Mozilla Firefox,
Safari, Opera and Google Chrome are examples of web browser and they are more advanced than earlier
web browser because they are capable to understand the HTML, JavaScript, AJAX, etc. Now a days, web
browser for mobiles are also available, which are called microbrowser.

Difference:
Following are the differences between web server and web browser.

 Web server is essential to store all information and data of websites. While web browser are used
66
 CS8651-Internet Programming Department of CSE

to access and locate these information and data.

 Web browser is used to search something on the internet via websites. While web server is used to
make the links between websites and web browser.
 Web browser is a software or application which is used for collection and presentation of data in
shape of websites while web server is a program server on computer or in cloud on internet that
gives the data.

15 Difference between internet and intranet.

Internet

It is a worldwide system which has the following characteristics:

 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’s
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.tutorialspoint.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.

Intranet

 Intranet is system in which multiple PCs are connected to each other.

67
 CS8651-Internet Programming Department of CSE

 PCs in intranet are not available to the world outside the intranet.
 Usually each company or organization has their own Intranet network and members/employees of
that company can access the computers in their intranet.
 Each computer in Intranet is also identified by an IP Address which is unique among the
computers in that Intranet.

Similarities in Internet and Intranet

 Intranet uses the internet protocols such as TCP/IP and FTP.

 Intranet sites are accessible via web browser in similar way as websites in internet. But only
members of Intranet network can access intranet hosted sites.
 In Intranet, own instant messengers can be used as similar to yahoo messenger/ gtalk over the
internet.

Differences in Internet and Intranet

 Internet is general to PCs all over the world whereas Intranet is specific to few PCs.
 Internet has wider access and provides a better access to websites to large population whereas
Intranet is restricted.
 Internet is not as safe as Intranet as Intranet can be safely privatized as per the need.

16 Building Advanced Web 2.0 Applications.

Definition of Mash up applications
 A mashup is similar to a remix. You might have heard examples again from the music world where
elements of Led Zeppelin are combined with Jayzee, for example, to form a weird rap/rock song. That’s a
mashup. The same can be done with data from the Internet.

Mashup Techniques - Mashing on the Web Server

 Every site sits on a Web server. It’s the thing that serves up the page, typically Internet Information
Server (IIS) in the Microsoft world.
68
CS8651-Internet Programming Department of CSE

Understanding the Architecture How it works

This use case is definitely the most straightforward:
 The Web browser communicates with the server, requesting a page using straight HTTP or HTTPS.
 That page is constructed by the Web server, which reaches out to what I’ll call the source or partner
sites (for example, Amazon, Yahoo, or Google, and so on). The first request in this example is to Amazon
using the Simple Object Access Protocol (SOAP) over HTTP.
 Amazon returns back a SOAP response.
 The second request in this example is to Yahoo using a Representational State Transfer style approach.
 Yahoo responds with Plain Old XML over HTTP.
 Lastly, the Web server aggregates the responses, combining and rationalizing the data in whatever
manner makes sense.
 The resulting data is bound to the HTML and inserted into the response, which is sent back to the
browser.

Pros and Cons

 The benefits of this approach are that the browser is decoupled entirely from the partner sites supplying
the data. The Web server acts as a proxy and aggregator for the responses.
 Disadvantages of this approach are that the browser requests an entire page, which typically is
acceptable.
 Second, the Web server is doing all the work in terms of data manipulation. Though this is good in
terms of maintenance, it’s not so good in terms of scalability. When your mashup gains popularity and
starts being viewed by thousands of users, the amount of work the server’s doing increases, while the
browser residing at the client is relatively idle.

Remote Data Communication

 Remote data communication occurs at runtime.
 Flex applications support a variety of remote data communication techniques built on standards.
 There are three basic categories of Flex application remote data communication:

HTTP request/response-style communication

 This category consists of several overlapping techniques. Utilizing the Flex framework HTTPService
component or the Flash Player API URLLoader class, you can send and load uncompressed data such as
text blocks, URL encoded data, and XML packets Each technique achieves the similar goal of sending
requests and receiving responses using HTTP or HTTPS.

Real-time communication
 This category consists of persistent socket connections. Flash Player supports two types of socket
connections: those that require a specific format for packets (XMLSocket) and those that allow raw
socket connections (Socket)

File upload/download communication

 This category consists of the FileReference API which is native to Flash Player and allows file upload
and download directly within Flex applications.

69
CS8651-Internet Programming Department of CSE

Understanding Strategies for Data Communication

 When you build Flex applications that utilize data communication, it’s important to understand the
strategies available for managing those communications and how to select the right strategy for an
application. All Flex applications run in Flash Player. With the exception of some Flex applications
created using Flex Data Services, almost all Flex applications are composed of precompiled .swf files that
are loaded in Flash Player on the client.
 Because Flex applications are stateful and self-contained, they don’t require new page requests and
wholesale screen refreshes to make data requests and handle responses.
 The Flex framework provides components for working with data communication using standard HTTP
requests as well as SOAP requests.

Working with Request/Response Data Communication

 You can work with request/response data communication in three basic ways: via simple HTTP
services, web services, and Flash Remoting.

Simple HTTP Services

 The most basic type of HTTP request/response communication uses what we call simple HTTP
services. These services include things such as text and XML resources, either in static documents or
dynamically generated by something such as a ColdFusion page, a servlet, or an ASP.NET page.

HTTPService
 HTTPService is a component that allows you to make requests to simple HTTP services such as text
files, XML files, or scripts and pages that return dynamic data. You must always define a value for the url
property of an HTTPService object.
 The following example uses MXML to create an HTTPService object that loads text from a file called
data.txt saved in the same directory as the compiled .swf file:
<mx:HTTPService id="textService" url="data.txt" />

Sending requests
 Creating an HTTPService object does not automatically make the request to load the data. In order to
make the request, you must call the send( ) method. If you want to load the data when the use clicks a
button, you can call the send( ) method in response to a click event:
textService.send( );

Handling results
 The send( ) method makes the request, but a response is not likely to be returned instantaneously.
Instead, the application must wait for a result event. The following example displays an alert when the
data loads:
<mx:HTTPService id="textService" url="data.txt" result="mx.controls.Alert.show('Data loaded')" />

Sending parameters
 When you want to pass parameters to the service, you can use the request property of the HTTPService
instance. The request property requires an Object value. By default, the name/value pairs of the object are
converted to URL-encoded format and are sent to the service using HTTP GET.
 The default value is object, which yields the default behavior you’ve already seen. You can optionally
70
CS8651-Internet Programming Department of CSE

specify any of the following values:

Text:The data is not parsed at all, but is treated as raw text.
Flashvars:The data is assumed to be in URL-encoded format, and it will be parsedinto an object with
properties corresponding to the name/value pairs.
Array:The data is assumed to be in XML format, and it is parsed into objects much the same as with the
object settings. However, in this case, the result is always an array. If the returned data does not
automatically parse into an array, the parsed data is placed into an array.
Xml:The data is assumed to be in XML format, and it is interpreted as XML using the legacy XMLNode
ActionScript class.
e4x:The data is assumed to be in XML format, and it is interpreted as XML using the ActionScript 3.0
XML class (E4X).

Using HTTPService with ActionScript

 Although the simplest and quickest way to use an HTTPService object is to primarily use MXML, this
technique is best-suited to nonenterprise applications in which the data communication scenarios are
quite simple. 
 Because HTTPService components provide significant data conversion advantages (such as automatic
serialization of data), it is still frequently a good idea to use an HTTPService object within a remote
proxy. However, it is generally necessary to then work with the HTTPService component entirely with
ActionScript, including constructing the object and handling the responses. URLLoader
 HTTPService allows you to use requests and handle responses to and from simple HTTP services. You
can optionally use the Flash Player class called flash.net.URLLoader to accomplish the same tasks
entirely with ActionScript, but at a slightly lower level.
 The first step when working with a URLLoader object is always to construct the object using the
constructor method, as follows:
var loader:URLLoader = new URLLoader( );
 Once you’ve constructed the object, you can do the following:
• Send requests.
• Handle responses.
• Send parameters.
Sending requests
 You can send requests using the load( ) method of a URLLoader object. The load( ) method requires
that you pass it a flash.net.URLRequest object specifying at a minimum what URL to use when making
the request. The following makes a request to a text file called data.txt:
loader.load(new URLRequest("data.txt"));
Handling responses
 URLLoader objects dispatch complete events when a response has been returned. Any return value is
stored in the data property of the URLLoader object.
Sending parameters
 You can send parameters using URLLoader as well. In order to send parameters, you assign a value to
the data property of the URLRequest object used to make the request. The URLRequest object can send
binary data or string data.
Web Services
 Flash Player has no built-in support for SOAP web services. However, Flex provides a WebService
component that uses built-in HTTP request/response support as well as XML support to enable you to
71
CS8651-Internet Programming Department of CSE

work with SOAP-based web services. There are two ways you can work with the WebService
components: using MXML and using ActionScript. Using WebService Components with MXML
 You can create a WebService component instance using MXML. When you do, you should specify an
id and a value for the wsdl property.\
Eg: <mx:WebService id="statesService" wsdl="http://www.rightactionscript.com/states/
webservice/StatesService.php?wsdl" />
Web services define one or more methods or operations. You must define the WebService instance so that
it knows about the operations using nested operation tags. The operation tag requires that you specify the
name at a minimum.

Calling web service methods

 All operations that you define for a WebService component instance are accessible as properties of the
instance. For example, in the preceding section, we created a WebService instance called statesService
with an operation called getCountries. That means you can use ActionScript to reference the operation as
statesService. getCountries.
 You can then call getCountries just as though it were a method of statesService:
statesService.getCountries( );

Handling results
 When a web service operation returns a result, you can handle it in one of two ways: explicitly handle
the result event or use data binding. Then, once a result is returned, you can retrieve the result value from
the lastResult property of the operation.

Using WebService Components with ActionScript

 You can use a WebService component using ActionScript instead of MXML. This is useful in cases
where you want to fully separate the view from the controller and the model, such as in the recommended
remote proxy approach.
 The MXML version of the WebService component is an instance of mx.rpc.soap.mxml.WebService,
which is a subclass of mx.rpc.soap.WebService. When you use the component directly from ActionScript
you should instantiate mx.rpc.soap.WebService directly:
// Assume the code already has an import statement for mx.rpc.soap.WebService.
var exampleService:WebService = new WebService( );
 Next, you must call a method called loadWSDL( ). You must call the method prior to calling any of the
web service operations. Assuming you set the wsdl property, you don’t need to pass any parameters to
loadWSDL( ):
exampleService.loadWSDL( );

72