CSE 4225 Network Programming Lecture 5: Web Architecture
Spring – 2015 Solaiman Salvi
Spring '15
CSE 4225 | Network Programming
2
Spring '15
CSE 4225 | Network Programming
3
Spring '15
CSE 4225 | Network Programming
4
Spring '15
CSE 4225 | Network Programming
5
Spring '15
CSE 4225 | Network Programming
6
Spring '15
CSE 4225 | Network Programming
7
WWW
STATIC WEB DOCUMENTS
Spring '15
CSE 4225 | Network Programming
8
Static Web Documents • Web pages are static • Just files sitting on some server waiting to be retrieved - even a video is a static Web page because it is just a file • MarkUp languages – language for describing how documents are formatted.
Spring '15
CSE 4225 | Network Programming
9
Spring '15
CSE 4225 | Network Programming
10
Static Web Pages (1)
The HTML for a sample Web page. Spring '15
CSE 4225 | Network Programming
11
Static Web Pages (2)
The formatted page. Spring '15
CSE 4225 | Network Programming
12
Static Web Pages (3)
Some differences between HTML versions. Spring '15
CSE 4225 | Network Programming
13
Style Sheets • A way to prevent different pages from having a different appearance • Individual pages no longer use physical styles, such as boldface and italics. • Page authors use logical styles such as (define), (weak emphasis), . • Logical styles are defined in the style sheet, which is referred to at the start of each page. • compared to an #include file in a C program Spring '15
CSE 4225 | Network Programming
14
Problem of HTML • HTML does not provide any structure to Web pages. • It also mixes the content with the formatting. • E-commerce and other applications need those. • A program that searches the Web for the best price for some book or CD needs to analyze many Web pages looking for the item's title and price. • With Web pages in HTML, it is very difficult for a program to figure out where the title is and where the price is. Spring '15
CSE 4225 | Network Programming
15
XML & XSL • 2 new languages – XML (eXtensible Markup Language) describes Web content in a structured way – XSL (eXtensible Style Language) describes the formatting independently of the content
Spring '15
CSE 4225 | Network Programming
16
Spring '15
CSE 4225 | Network Programming
17
XSL • All it says – Product Details, nothing about how to display the Web page on the screen. • To provide the formatting information, we need a .xsl file, containing the XSL definition. • This file is a style sheet that tells how to display the page. Interprets XML to HTML. • The XML and XSL specifications are much stricter than HTML specification. • Rejecting syntactically incorrect files is mandatory, even if the browser can determine what the Web designer meant Spring '15
CSE 4225 | Network Programming
18
Spring '15
CSE 4225 | Network Programming
19
XML & SOAP • XML – also used as language for communication between application programs. • SOAP – way for performing RPCs between applications in a language and system-independent way. • Client constructs the request as an XML message and sends it to the server, using the HTTP protocol • Server sends back a reply as an XML formatted message. • In this way, applications on heterogeneous platforms can communicate. Spring '15
CSE 4225 | Network Programming
20
XHTML • In the future, the majority of Web-enabled devices will not be PCs, but wireless, handheld PDA-type devices – limited memory for large browsers – full of heuristics that try to somehow deal with syntactically incorrect Web pages
• Solution – XHTML - HTML 4 reformulated in XML, not HTML 5 Spring '15
CSE 4225 | Network Programming
21
• Six major differences and a variety of minor differences between XHTML and HTML 4
Spring '15
CSE 4225 | Network Programming
22
Spring '15
CSE 4225 | Network Programming
23
Spring '15
CSE 4225 | Network Programming
24
FORMS • When the user clicks the submit button, the browser packages the collected information into a single long line and sends it back to the server for processing. • The & is used to separate fields • + is used to represent space.
Spring '15
CSE 4225 | Network Programming
25
WWW
DYNAMIC WEB DOCUMENTS
Spring '15
CSE 4225 | Network Programming
26
Dynamic web content • Content/file generated on demand/when requested (on a HTTP request), rather than stored on disk • Content generation can take place either on the server side or on the client side.
Spring '15
CSE 4225 | Network Programming
27
Server Side Dynamic Web Page • 1. Programs – CGI (Common Gateway Interface)
• Written in – perl/pyhton • Lives in a directory called cgi-bin - visible in the URL • A CGI program is executed in a separate process. Spring '15
CSE 4225 | Network Programming
28
2. Server Side Scripting • CGI scripts - not the only way to generate dynamic content on the server side. • Another common way – – embed little scripts inside HTML pages – have them be parsed & executed by the server itself to generate the page. – The result is included in the place of the code. – language for writing these scripts – • • • •
Spring '15
Active Server Pages (ASP) from Microsoft, Server-side JavaScript from Netscape, Java Server Pages (JSP) from Sun, Hypertext Preprocessor (PHP)
CSE 4225 | Network Programming
29
Spring '15
CSE 4225 | Network Programming
30
PHP
(a)
(c)
(b)
(a) A Web page containing a form. (b) A PHP script for handling the output of the form. (c) Output from the PHP script when the inputs are ‘‘Barbara’’ and ‘‘32’’, respectively. Spring '15
CSE 4225 | Network Programming
31
Spring '15
CSE 4225 | Network Programming
32
3. Java Servlets • Java Servlets live in server-side JVM. – doGet, doPost, doPut, doDelete, init, destroy – HTML is “embedded” in Java code. – Servlets can call Enterprise JavaBeans (EJB).
Spring '15
CSE 4225 | Network Programming
33
Spring '15
CSE 4225 | Network Programming
34
Spring '15
CSE 4225 | Network Programming
35
Client Side Dynamic Web page • CGI, PHP, JSP, and ASP scripts can’t respond to mouse movements or interact with users directly. • So needs scripts embedded in HTML pages that are executed on the client machine, rather than the server machine • HTML 4.0 allows such scripts, tag