MELJUN CORTES JEDI Slides-Web Programming-Chapter01-Introduction to the Course

(1)

Introduction to Web

Programming

(2)

Why the Web?

●

Technology-Neutral Environment

– Communication is done through popular protocols (HTML/HTTP) – Users only need a web browser

(3)

Why the Web?

●

Ease of Distribution/Updates

– Distribution

● No need to give away programs through CDs.

● No need to go through a possibly lengthy installation sequence. ● The users only need the location of the application in the Internet.

– Updates

● No need to periodically check for newer versions of the program. ● Problem of how to actually get the program updates is eliminated.

● Users need not even be informed of an update; The codebase in the web server

only needs to be updated and all users automatically will enjoy the benefits of the updates.

(4)

Client-Server Architecture

●

Client-server architecture

– Used by web applications.

– A client program connects to a server for information that it needs to

complete the tasks that the user has set it to do.

●

Thick and Thin clients

– Thin clients

● Contain only a minimum of what is required for the user experience, mostly only

an interface.

– Thick clients

● Aside from an interface, also contain some, if not many, of the processing logic

(5)

Client-Server Architecture

●

Client-server architecture from a web perspective

– Web applications use thin clients.

– The client program, a browser in this case, is only an interface that

the user makes use of to perform tasks.

(6)

Client-Server Architecture

●

Client-server architecture from a web perspective

– Web server

● The server takes in requests from web browser clients and returns a response

Server response (contains the document requested by the user or an error code if the item does not exist)

Client request (contains the name and address of the item the client is looking for) Machine running a Machine running a Web Browser Server processes client request by looking for the resource requested by the client

(7)

Client-Server Architecture

●

Client-server architecture from a web perspective

– Web client

● The browser provides the user with an interface that helps the user to issue

(8)

HTML

●

Hypertext Markup Language

●

A set of instructions for the web browser on how to present

content to the user.

●

An open standard updated by the World Wide Web

Consortium (W3C).

●

All browsers know what to do when it encounters HTML,

although some older browsers might have problems in

rendering some pages that were written using newer

versions of HTML that were updated after their

(9)

HTTP

●

Hypertext Transfer Protocol

●

A network protocol with Web-specific features that runs on

top of two other protocol layers, TCP and IP, to make sure

that requests and responses are delivered completely

between each end of the communication.

– TCP makes sure that a file sent from one end of a network is

delivered completely and successfully at its destination.

– IP routes file pieces from one host to another on their way to its

(10)

HTTP

●

Uses a Request/Response sequence

– HTTP client opens a connection and sends a request message to an

HTTP server.

– Server returns a response message and closes the connection.

●

Request and response messages

– Similar and English-oriented – Consist of:

● an initial line

● zero or more header lines

(11)

HTTP Requests

●

Requests from the client to the server contain:

– The information about the kind of data the user is requesting

– A method name, which tells the server the kind of request being

made, as well as how the rest of the message from the client is formatted

● GET

(12)

HTTP Requests: GET

●

Simplest HTTP method

●

Used mainly to request a particular resource from the

server, whether it be a web page, a graphic image file, a

document, etc.

●

Can also be used to send data over to the server

– Limitations

● Total amount of characters that can be encapsulated is limited. ● Data sent is simply appended to the URL sent to the server.

– Advantage

(13)

GET: Sample URL

http://jedi-master.dev.java.net/servlets/NewsItemView?newsItemID=2359&filter=true

●

All of the items before the question mark (?) is the original

URL of the request.

http://jedi-master.dev.java.net/servlets/NewsItemView

●

Everything after that are the parameters or data that you

send along to the server.

– Parameters are encoded as name and value pairs.

● Format: name=value

– If there are more than one set of parameters, they are separated

using the ampersand symbol (&).

(14)

HTTP Requests: POST

●

Designed such that the browser can make:

– Complex requests to the server

– Simple requests that require uploading of files to the server

●

Encapsulates or hides the data inside of the message body

(15)

HTTP Response

●

Also contains both headers and a message body

●

Headers

– Different from that of HTTP requests – Contain:

● Information about the version of the HTTP protocol that the server is using ● Content type that is encapsulated within the message body

●

MIME-type

– Value for the content type

– Tells the browser if the message contains HTML, a picture, or some

(16)

Dynamic over Static Pages

●

Content

– Static content does not change

● e.g. archived newspaper articles, family pictures from an online photo gallery

– Dynamic content changes according to user input

●

Dynamic pages have a lot more flexibility and have more

(17)

Dynamic over Static Pages

●

Some scenarios where dynamic content is the only thing

that will fit the bill:

– The Web page is based on data submitted by the user.

● e.g. results pages from search engines, orders for e-commerce sites

– The data changes frequently.

● e.g. weather report or news headlines page built dunamically

– The Web page uses information from corporate databases or other

(18)

Java 2 Enterprise Edition

(J2EE)

●

A platform introduced for the development of enterprise

applications in a component-based manner

●

Uses a distributed multi-tier application model

– Distributed: most applications designed and developed with this

platform can have their different components installed in different machines

– Multi-tier: applications are designed with multiple degrees of

separation with regards to the various major components of the application

(19)

J2EE: Multi-Tiered

Application Example

●

A web application has:

– The presentation layer (the client browser)

– The business logic layer (the program that resides on the web server) – The storage layer (the database which will handle the application data)

●

The layers of a web application are distinctly separated, but

(20)

J2EE Web Tier Overview

●

Web Tier

– One of the tiers in the J2EE platform

– The layer which interacts with browsers in order to create dynamic

content

– Two technologies within this layer:

● Servlets

(21)

(22)

Web Tier: Servlets

●

Java's primary answer for adding additional functionality to

servers that use a request-response model

●

Have the ability to read data contained in the requests

passed to the server and generate a dynamic response

based on that data

●

Not necessarily limited to HTTP-based situations, but are

currently their primary use, so Java has provided an

HTTP-specific version that implements HTTP-HTTP-specific features

(23)

Servlets Disadvantage

●

Servlets

– Since servlets are simply Java language classes, they produce

output the way other Java programs would: through printing

characters as Strings into the output stream, in this case the HTTP-response.

– Problems:

● HTML can be quite complex and could be very hard to encode through the use of

String literals.

● Engaging the services of a dedicated graphics and web page designer to help in

(24)

Web Tier: JavaServerPages

●

Looks just like HTML, only it has access to all the dynamic

capabilities of servlets through the use of scripts and

expression languages

●

Designers can concentrate on simple HTML design and

simply leave placeholders for developers to fill with dynamic

content

(25)

Containers

●

All J2EE components rely on the existence of a container;

(26)

Containers

●

Features

– Communications support – Lifecycle management – Multi-threading support – Declarative security – JSP Support

(27)

Basic Structure of a Java

Web Application

● For a container to recognize your application as a valid web application,

it must conform to a specific directory structure:

Contains HTML, images, other static content, plus JSPs Contains meta-information about your application (optional)

All contents of this folder cannot be seen from the web browser

Contains class files of Java classes created for this application (optional) Contains JAR files of any third-party libraries used by your app (optional)

(28)

Basic Structure of a Java

Web Application

●

There are some points regarding this structure:

– One: The top-level folder (the one containing your application) does

NOT need to be named Document Root. It can be, in fact, named any way that you like, though it is highly recommended that the top-level folder name be the same name as your application. It is only named Document Root in the figure to indicate that it serves as the root folder of the files or documents in your application.

(29)

Basic Structure of a Java

Web Application

●

There are some points regarding this structure:

– Two: Any other folder can be created within this directory structure.

For example, for developers wishing to organize their content, they can create an images folder from within the document root to hold all their graphics files, or maybe a config directory inside the WEB-INF folder to hold additional configuration information. As long as the prescribed structure as shown above is followed, the container will allow additions.

(30)

Basic Structure of a Java

Web Application

●

There are some points regarding this structure:

– Three: The capitalization on the WEB-INF folder is intentional. The

lowercaps on classes and lib are intentional as well. Not following the capitalization on any of these folders will result in your

(31)

Basic Structure of a Java

Web Application

●

There are some points regarding this structure:

– Four: All contents of the WEB-INF folder cannot be seen from the

browser. The container automatically manages things such that, for the browser, this folder does not exist. This mechanism protects your sensitive resources such as Java class files, application

configuration, etc. The contents of this folder can only be accessed by your application.

(32)

Basic Structure of a Java

Web Application

●

There are some points regarding this structure:

– Five: There MUST be a file named web.xml inside the WEB-INF

folder. Even if, for example, your web application contains only static content and does not make use of Java classes or library files, the container will still require your application to have these two items.