Content Web Engineering 1. Introduction 2. Client Side Programming Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt 3. Server Side Programming Universität Karlsruhe Fakultät für Informatik Institut für Telematik Wintersemester 1999/2000 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite1 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite3 What has to be implemented? � Infrastructure such as server, browser, or protocols � static web pages Web Engineering � dynamic pages � based on static or dynamic resources Chapter 6: Programming and Implementation � applications on the web � ... the WWW Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite2 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite4
Server Manages Resources WWW Applications � documents � resources are uniquely identified on a server � information applications � e.g. collection of data sheet from a chip manufacturer � static resources � files are stored on the server � Inherent client-server applications � HTML-pages, images, movies, scripts, programs � online shop: customer is physically away from the shop � fight booking system: customers are distributed, data is central � dynamic resources � files/content is dynamically generated on the server � standard applications � continuous data (audio, video) � no installation, maintenance and update at the users site � access to other systems (e.g. database) � data is kept central, easy to backup � e.g. text processor, email system, etc. Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite5 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite7 Programming in Distributed Systems Structure of WWW Applications � backend � data transport (part that runs on the server or is distributed over � throughput, delay, bandwidth, etc. multiple servers) � application/process logic � data representation � data storage � number formats, character coding � front-end � error situation (part that runs on the client) � client, server, “on the way“ � user interface � input validation � local calculations � IPC Approaches � in some cases part of the application logic � message, connection � RPC, RMI, CORBA Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite6 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite8
Challenges when developing Advantages of WWW Applications WWW Applications � no installation on the system of the user � scalability (Browser is already there) � persistence � nearly no effort for the development of the network functionality � transaction criteria � analyzing usage � security (what parts of the system, what functions are the most important, most used, ...?) � rapidly changing trends and fashions Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite9 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 11 Technology Overview Expectation on WWW Applications Client � content that can be displayed/provided � short development time (?) � text, HTML, images, videos, audio, ... � content and programs that can be interpret by the browser � dynamic HTML � simple development (?) � browser script: JavaScript, VBScript, SMIL, MathML, ... (no need for expensive client-server specialists) � programs that are executed in the context of the browser � Java Applets (Byte Code, Virtual Machine) � strong copy protection, � ActiveX (Native Code, executed directly by the operating system) only the user interface is distributed � programs that are pluged into the browser and executed in the context of the browser for specific data types � Plug-Ins � open for new business models, e.g. pay by use (?) � external programs that are started by the browser to handle data that can not be handled by the browser � helper applications Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 10 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 12
Technology Overview Client-Side Programming Server Overview by Example � content (e.g. HTML-pages) that contains statements that � HTML (forms) can be replaced or executed: � CSS, CSS2 (see chapter 3) � SSI, XSSI � XML (see chapter 3) � server side scripting (Livewire, ASP, PHP, JSP, ...) � BrowserScript (JavaScript, JScript, VBScript) � programs that create content � Java Applets � additional process: CGI � In the context of the servers: Fast-CGI, Servlets, ... � ActiveX � extensions of web servers � Plug-Ins � NSAPI, IISAPI, Apache-Modules, ... � helper applications � gateways and front-ends for databases � application server � dedicated/specific servers (see chapter 4) Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 13 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 15 Content HTML-Forms I � variables are sent by mail 1. Introduction <FORM method=”POST" action="mailto:albrecht@teco.edu"> <input type=hidden name="session" value="331"> 2. Client Side Programming <p>Comments: <p><textarea name="Comments" rows="5" cols="35"></textarea> 3. Server Side Programming <p>Category: <p><select name="Category" size="1"> <option selected>A</option> <option>B</option> </select> </p> <p>Name:<input type="TEXT" name="Name" value size="35"> <p><input type="SUBMIT" value="submit"> <input type="RESET" value="reset"> </form> Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 14 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 16
HTML-Forms - Widget Elements HTML-Forms II � input fields are identified by a name � methods to transmit data - method � input -Tag � <input type=text name="username" size="20"> � GET - parameter are encoded in the URL � input fields with different functionality, e.g. text, password, file, checkbox, � POST - parameter are in the body radio button, hidden fields (session), buttons (submit, reset) � action that is called - action � text input fields � URI � <textarea rows="5" cols="60" name"comment"> e.g. mail address, URL of the CGI-script, URL of aServlets � number of rows and columns � encoding - enctype � menus and lists � MIME type of the data sent to the server � <select name"drink"> � application/x-www-from-urlencoded <option selected>Water � application/form-data <option>Wine � syntax – example </select> � pull <FORM method="GET|POST" action="URI" enctype="Code"> down menus, selection lists ... � one ore more elements can be selected </form> Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 17 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 19 Example 1: E-Mail File Upload I <h2>Please fill in the file-upload form below</h2> � On the web page a button is displayed. When the user <form method='POST' enctype='multipart/form-data' clicks the button a mail is sent and so the receiver has the action='mailto:albrecht@teco.edu'> email address. File to upload: <input type=file name=upfile><br> � usually the browser asks whether the mail should be sent Notes about the file: <input type=text name=note><br> or not. <input type=submit value=Press> to upload the file! </form> <HTML> <HEAD><TITLE>Example - Subscribe</TITLE></HEAD> <BODY> <FORM ACTION="mailto:albrecht@teco.edu?subject=Subscribe" METHOD="POST" ENCTYPE="multipart/form-data"> <B>Push Button to Subscribe</B><BR> <INPUT TYPE="SUBMIT" NAME="Subscribe" VALUE="Subscribe for Free!"> </FORM> </BODY></HTML> Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 18 Prof. Dr. Dr. h.c. mult. Gerhard Krüger, Albrecht Schmidt: Web Engineering, WS99/00 Kapitel 5- Seite 20
Recommend
More recommend
