Chapter 2: Interactive Web Applications
|
|
|
- Ross Dixon
- 10 years ago
- Views:
Transcription
1 Chapter 2: Interactive Web Applications 2.1 Interactivity and Multimedia in the WWW architecture 2.2 Interactive Client-Side Scripting for Multimedia (Example HTML5/JavaScript) 2.3 Interactive Server-Side Scripting (Example PHP) 2.4 Data Storage in Web Applications (Example Database Access in PHP) 2.5 Integrated Server/Client-Side Scripting (Example jquery/ajax) 1
2 Example: Fibonacci Function in PHP (Version 1) <body>... <h2> <?php function fib($n){ if ($n==0) return 0; else if ($n==1) return 1; else return fib($n-1)+fib($n-2); }; echo "fib(3) = ", fib(3), "<br>"; echo "fib(8) = ", fib(8), "<br>";?> </h2> </body> </html> fibonacci1.php 2
3 HTTP Basics HTTP = HyperText Transfer Protocol, see Client-Server communication: Client opens (TCP) connection to server (usually on port 80) Client sends request (as text lines) Server sends response (as text lines) Client closes connection (HTTP is stateless) Format of all HTTP messages (requests and responses): Initial line Header lines (zero or more) Blank line Message body (optional) Example HTTP request: GET /lehre/ws1516/mmn/index.html HTTP/1.1 Host: <blank line!> 3
4 Sample HTTP Request (GET) GET /~hussmann/hello.php HTTP/1.1 ACCEPT: text/html,application/xhtml+xml,application/ xml;q=0.9,*/*;q=0.8 ACCEPT_ENCODING: gzip, deflate ACCEPT_LANGUAGE: en-gb,en;q=0.5 CONNECTION: keep-alive HOST: localhost USER_AGENT: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.10; rv:41.0) Gecko/ Firefox/41.0 CONTENT_TYPE: 4
5 HTTP Server Responses Message sent back from HTTP server always contains an initial response line which gives the status of the request processing. Example (success): HTTP/ OK Example (error): HTTP/ Not found Status codes: 1xx: Informational message 2xx: Success of some kind 3xx: Redirection to other URL e.g. 303: See other URL (given in Location: header) 4xx: Client side error 5xx: Server side error e.g. 500: Server error 5
6 Example HTTP Response Experimenting manually with HTTP client/server dialogues: telnet <host> 80 in UNIX shell Retrieving a HTML page: GET /~hussmann/hello.php HTTP/1.1 Host: localhost:80 Response: HTTP/ OK Date: Wed, 28 Oct :02:38 GMT Server: Apache/ (Unix) PHP/ X-Powered-By: PHP/ Content-Length: 126 Content-Type: text/html <!DOCTYPE html> <html> </html> 6
7 CGI-Style Coding for Parameters in GET Request Convention for passing parameter values to server-side programs Introduced by the Common Gateway Interface (CGI) Not part of the HTML protocol! Interpreted by server programs, e.g. PHP module Syntax: Parameter data stream is appended to URL after a? Keyword/value pairs, separated by =, e.g. fibinput=12 Multiple parameter groups are separated by & Spaces in strings are replaced by + Non-ASCII characters (and special characters &, +, =, % ) are replaced by %xx (hexadecimal code of character in used character set) 7
8 Fibonacci Function in PHP: Using Request Data <body> <h1> Think about this code: "fib($fibinput) = " Fibonacci Function (Result) </h1> <h2> <?php $fibinput = $_REQUEST['fibinput']; function fib($n){ as in version 1 }; echo "fib($fibinput) = "; echo fib($fibinput); echo "<br>";?> <br> <a href="fibonacci2a.html">new Computation</a> </h2> </body> fibonacci2b.php 8
![php $fibinput = $_REQUEST['fibinput']; function fib($n){ as in version 1 }; echo](/docs-images/41/13687434/images/page_8.jpg "\"fib($fibinput) = \"; echo fib($fibinput); echo \"<br>\";?> <br> <a href=\"fibonacci2a.")
9 Example GET Request with Parameter Request: GET /~hussmann/fibonacci2b.php?fibinput=10 HTTP/1.1 Host: localhost Response: Date: Wed, 28 Oct :09:15 GMT Server: Apache/ (Unix) PHP/ X-Powered-By: PHP/ Content-Length: 245 Content-Type: text/html <!DOCTYPE html> <html> <head> fib(10) = 55 </html> 9
10 GET and POST Methods in HTTP Hypertext Transfer Protocol (HTTP) supports two request methods for passing parameter values to called documents/scripts: GET Method: Parameter values transmitted within URL: CGI-Style coding (see above) POST Method: Parameter values transmitted in the HTTP message body Parameter values not visible in URL Coding options for POST method: Not part of HTTP (but specified for HTML forms)! Coding method given in the Content-Type header» application/x-www-form-urlencoded (CGI style)» multipart/form-data (segmented data, better for large data blocks) 10
11 Example POST Request with Parameter Request: POST /~hussmann/fibonacci2b.php HTTP/1.1 Host: localhost Content-Type: application/x-www-form-urlencoded Content-Length: 11 fibinput=12 Response: HTTP/ OK Date: Wed, 28 Oct :17:54 GMT... Content-Type: text/html <!DOCTYPE html> <html> <head> fib(12) = 144 </html> 11
12 PHP: Variables, Parameter Passing and Security Global arrays $_REQUEST, $_GET, $_POST for accessing external values determined at call time (like form input) $_REQUEST contains all parameters given in request, $_GET and $_POST contains all parameters passed by the resp. method Obtaining individual variable values by array lookup: $_REQUEST['var']; Older PHP versions (up to 4.2.0): External values were directly accessible through variables (like "$fibinput") Where is the problem? 12
13 HTML Reminder: Forms User input in HTML: <form> Element Sub-element: <input type=ty name=name> Selected classic (HTML 4) types (ty): checkbox Check box (Attribute checked) radio Radio button (Attribute checked) text Text input line textarea Multi-line text input area password Text input area not displaying the input file File selection button General button submit Button to send form contents reset Button to reset form contents <select name=name> Pop-up menu for selection from options List of options: Sub-elements <option> <option selected> defines "pre-selected" values 13
14 HTML Form Example <body> <form action="test.php" method="get" enctype="application/x-www-form-urlencoded"> <label>name <input type="text" name="name" maxlength="10"/></label><br> Sex: <input type="radio" name="sex" value="male"></input> male <input type="radio" name="sex" value="female"></input> female <br> <input type="checkbox" name="married" value="yes">married</input><br> <input type="submit" value="submit" /> </form> </body> 14
15 HTML Forms and Server-Side Scripts HTML page containing forms calls separate script page transfers form data as variable values action attribute for HTML tag <form> Specifies the server page to process the input Can contain embedded script method attribute for HTML tag <form> Specifies the HTTP method to be used to transfer form data to the server Possible values: GET (default), POST enctype attribute for HTML tag <form> Specifies the encoding method to be used for form data Possible values:» application/x-www-form-urlencoded (CGI conventions) (default)» multipart/form-data (segmented data) 15
16 Example: POST Request with Multipart Encoding HTML: <form action="test.php" method="post" enctype="multipart/form-data"> Generated HTTP request: POST /test.php HTTP/1.1 Host: localhost Content-Type: multipart/form-data; boundary= Content-Length: Content-Disposition: form-data; name="name" Max Muster Content-Disposition: form-data; name="sex" male Content-Disposition: form-data; name="married" yes
17 Fibonacci Function in PHP (Version 2): Input Form Calling PHP Script <body> <h1> Fibonacci Function (Input) </h1> <h2> Please enter number: <form name="fibform" action="fibonacci2b.php"> <input type="text" name="fibinput" value="0"><br> <input type="submit" value="compute"> </form> </h2> </body> </html> fibonacci2a.html 17
18 Combination of Input and Result Pages <body> fibonacci2.php <h1> Fibonacci Function </h1> <h2> <?php function fib($n){ as above }; if (isset($_request['fibinput']) && $_REQUEST['fibinput']!="") { $fibparam = $_REQUEST['fibinput']; echo "fib($fibparam) = "; echo fib($fibparam); echo "<br>"; }?> <br/> Please enter number: <form name="fibform" action="fibonacci2.php"> <input type="text" name="fibinput" value="0"><br> <input type="submit" value="compute"> </form> </h2> </body> action="fibonacci2.php" can be omitted 18
![="") { $fibparam = $_REQUEST['fibinput']; echo "fib($fibparam) = "; echo fib($fibparam); echo "<br>"; }?](/docs-images/41/13687434/images/page_18.jpg "> <br/> Please enter number: <form name=\"fibform\" action=\"fibonacci2.")
19 Form Validation, Traditional Style Constraints for data entered into input forms: required / optional Special formats: Date URL address Checking the constraints ( validating the input) Client-side script code (JavaScript) Catching the submit event Data submitted only if validation returns true Client- vs. server-side validation: Advantages, disadvantages? 19
20 Example: Traditional Form Validation <form id="blogentry"> <label for="name">name: </label> <input name="name" type="text"></br> <label for=" "> </label> <input name=" " type="text"> <input type="submit" value="submit"> </form> <script type="text/javascript"> blogentry = document.getelementbyid("blogentry"); blogentry.addeventlistener("submit", validateform, false); function validateform() { if (blogentry.name.value =="") { alert("name is required"); return false; }; var input=blogentry. .value; var atpos= input.indexof("@"); var dotpos= input.lastindexof("."); if (atpos<1 dotpos<atpos+2 dotpos+2>= input.length) { alert("not a valid address"); return false; }; return true; } </script> html/formvalidate.html validation code taken from w3schools.org 20
21 Detour: Accessing HTML Elements in JavaScript Old-fashioned JavaScript document tree: Array access: document.forms[f].elements[e] Shorthand: document.forms.f.elements.e (associative array) Even shorter: document.f.e Strict DOM style: document.getelementbyid("f") HTML5 Recommendation (Oct 28, 2014), Sect : The Window interface supports named properties. The supported property names at any moment consist of the following, in tree order, ignoring later duplicates: the browsing context name of any child browsing context of the active document whose name is not the empty string, the value of the name content attribute for all a, applet, area, embed, form, frameset, img, and object elements in the active document that have a non-empty name content attribute, and the value of the id content attribute of any HTML element in the active document with a non-empty id content attribute. Note that window is equivalent to self in JavaScript and can be omitted! 21
22 Form Validation with HTML5 Standard scenarios of form validation are integrated into HTML5 standard Input types: , URL, date, time, number, range, search, phone number, color Attributes: Required, min, max, step, pattern Procedural features are transformed to declarative features Declarative HTML5 replacing JavaScript code: less error-prone more precise (regarding definition of input syntax) automatically benefits from upgrades devices (e.g. smartphones) can choose best representation Transition problem! 22
23 Example: Form Validation with HTML5 <!DOCTYPE html> <html> <head> <title>form Validation HTML5</title> </head> <body> <form name="blogentry"> <label for="name">name: </label> <input id="name" type="text" required></br> <label for=" "> </label> <input id=" " type=" " required> <input type="submit" value="submit"> </form> </body> </html> formvalidate5.html Google Chrome 23
24 Chapter 2: Interactive Web Applications 2.1 Interactivity and Multimedia in the WWW architecture 2.2 Interactive Client-Side Scripting for Multimedia (Example HTML5/JavaScript) 2.3 Interactive Server-Side Scripting (Example PHP) 2.4 Data Storage in Web Applications (Example Database Access in PHP) 2.5 Integrated Server/Client-Side Scripting (Example jquery/ajax) Literature: B. Lawson, R. Sharp: Introducing HTML5, New Riders 2011 S. Fulton, J. Fulton: HTML5 Canvas, 2nd ed., O Reilly
25 Data Storage Options in the Web: Overview Client-side storage (implemented in browser): Session level: Linking consecutive request/response pairs Long-term level: Personalization, preferences Traditional solution: Cookies Modern solutions (HTML5): Web Storage, Web SQL Databases Server-side storage (implemented on server): Access and modify external/global information Simple solution: Server files (see PHP example forum below) Powerful solution: Database access from server scripts Using relational databases, SQL-based: Traditional solution, based on tables Mixture of languages and paradigms Using non-sql databases, e.g. MongoDB : Trending solution, based on document trees Fully coherent with JavaScript 25
26 A Simple Discussion Forum (1) Interactive submission of text contributions Display of all submissions available on server Server uses simple text file for storage Altogether approx. 50 lines of HTML+PHP! 26
27 A Simple Discussion Forum (2) Contents of file "forum.txt": Each two consecutive lines represent one contribution. First line: Name Second line: Text Max I have an idea Peter I like this idea Beware of access rights 27
28 A Simple Discussion Forum (3) Display of the full content of the file 'forum.txt' Used file function: file(): Converts file content to string array Used array function: count(): Length of array <h2>current discussion:</h2> <?php $content = file("forum.txt"); echo "<h3>", count($content)/2, " contributions</h3>"; echo "<hr>"; $i = 0; while ($i < count($content)) { echo "<h3>contribution # ", ($i+2)/2, ":</h3>"; echo "<b>name: </b>", $content[$i++], "<br>"; echo "<b>text: </b>", $content[$i++], "<br>"; echo "<hr>"; }?> forum.php 28
29 A Simple Discussion Forum (4) Input interface (HTML form): <h1>discussion Forum</h1> <hr> <h2>new Contribution:</h2> <form method="post"> <table border="0"> <colgroup> </colgroup> <tr> <td>name:</td> <td><input type="text" name="name"></td> </tr> <tr> <td>contribution (one line):</td> <td><input type="text" name="contrib" size="60"></td> </tr> </table> <input type="submit" name="newcontrib" value="enter new contribution"> <input type="reset""> </form> forum.php 29
30 A Simple Discussion Forum (5) Extending the file 'forum.txt' with a new contribution $newcontrib: was the "enter contribution" button pressed? Used file functions: fopen(), fclose(): Open file ("a"=append), close file fputs(): Write string to file <?php $newcontrib = $_REQUEST['newcontrib']; $name = $_REQUEST['name']; $contrib = $_REQUEST['contrib']; if ($newcontrib!= "" && $name!= "" && $contrib!= "") { $file = fopen("forum.txt", "a"); if ($file) { fputs($file,$name. "\n"); fputs($file,$contrib. "\n"); fclose($file); } }?> 30
31 Sessions and States HTTP is stateless Server does not remember any data from previous transactions Linking several transactions to a session with common data storage Client-side: Storing all data on client and re-transmit for every transaction Server-side: Storing all data on server, client has to identify the session Common solution: Server-side software offers session support» E.g. session support in PHP Client stores session id Methods for linking request to session id:» Variable/value pair in GET or POST request» HTTP Cookie 31
32 Cookies in HTTP Small data units stored in the browser storage area, controlled by browser Cookie contains: Name (String), also called key Value (String) Expiration date optional: domain, path, security information HTTP transfers cookies between client and server In response, server can include header line Set-Cookie:» Further information: name + value pair, expiration time Cookie is stored by the browser In further requests to the same server, client includes header line Cookie:» Further information: name + value pair Only cookies related to the requested server are transferred 32
33 What Will Change After This Step? 33
34 Types of Cookies Session cookie Deleted on browser termination No expiration date given = session cookie Persistent cookie For tracking, personalization Secure cookie Only transmitted when secure connection to server is used HttpOnly cookie Access only for HTTP, not for script APIs Third party cookie Cookies set for different domain than currently visited server Used for tracking and cross-domain advertising 34
35 Cookies in PHP: Listing Current Cookies cookie_list.php 35
36 Accessing Cookies Displaying a list of all cookies currently set (for this application) by reading from global array $_COOKIE: <html> <h2>cookies currently set:</h2> <ul> <?php while (list($k, $v) = each($_cookie)) echo "<li>", $k, "=", $v, "</li>";?> </ul>... </html> cookie_list.php 36
37 HTML Form for Setting a Cookie <form> <input type="text" name="key" value="name"> Cookie Name<br> <input type="text" name="val" value="text"> Cookie Content<br> <input type="text" name="tim" value="10"> Lifetime (minutes)<br> <input type="submit" name="set" value="set Cookie"><br> </form> Page loaded via action is identical to page containing the form when omitting the action attribute. Server-side execution: actual setting action carried out when next page is loaded! cookie_set.php 37
38 Setting the Cookie <?php if if (isset($_get['set']) && $_GET['set']!="") { $key = $_GET['key']; $val = $_GET['val']; $tim = $_GET['tim']; $exp = time() + $tim * 60; setcookie($key, $val, $exp); }?> <!DOCTYPE html> <html>... "name" attribute of submit button ('set') is used to decide whether set button was pressed setcookie() call has to be very first output of page, to be transmitted together with the headers (HTTP requirement). 38
39 Client-Side Storage using Web Storage Web Storage/DOM Storage: Standardized by W3C, intended as improvement over Cookies Purely client-side storage Not transmitted to server with each request Javascript code can issue read and write requests Types of storage: Session storage: Related to window/tab (!) Local storage: Related to domain and maintained after browser termination Data structure: Simple associative array (key/value pairs, both of string type) Similar to Cookies 39
40 Web Storage Example Chrome Advanced Settings 40
41 Web Storage Interface (W3C) Interface Storage (defined independently of implementation language): String getitem(string key); void setitem(string key, String value); void removeitem (String key); void clear(); Top-level browsing context contains two attributes: Storage sessionstorage; Storage localstorage; Shorthand notation in JavaScript due to associative array, example: var firstname = localstorage.firstname; var lastname = localstorage.lastname; When a storage area changes, an event is fired: StorageEvent storage; 41
42 JSON Stringification Converting data objects to a String representation XML based For JavaScript: Space-effective JSON notation (= JavaScript Object Notation) APIs: JavaScript: JSON.stringify(), JSON.parse() PHP: json_encode(), json_decode() JSON Example: {"student": { "identification": [ {"name": "firstname", "value": "Max" }, {"name": "lastname", "value": "Muster" }], "grades": [ ] } } See php/json_php.php php/json_php_js.php 42
43 Working Offline in Web Applications Why using Web applications offline? Working offline with server-based applications: Client needs a significant amount of logic to give sense to offline work Specify which parts of the application data is to be kept locally (cached)» Usually a set of files» Cache manifest (= list of files) Browser needs to support access to cached data» interpret cache manifest» maintain application cache 43
44 Potential Enabled by Server-Side Scripts Receive and store user input In various forms of persistent storage Process input and compute results Depending on various information available on server side Create output suitable for being displayed in Web browsers HTML, may include JavaScript Make use of advanced features offered by Web browsers Examples: Cookies, user agent identification 44
600-152 People Data and the Web Forms and CGI. HTML forms. A user interface to CGI applications
HTML forms A user interface to CGI applications Outline A simple example form. GET versus POST. cgi.escape(). Input controls. A very simple form a simple form
Internet Technologies. World Wide Web (WWW) Proxy Server Network Address Translator (NAT)
Internet Technologies World Wide Web (WWW) Proxy Server Network Address Translator (NAT) What is WWW? System of interlinked Hypertext documents Text, Images, Videos, and other multimedia documents navigate
Protocolo HTTP. Web and HTTP. HTTP overview. HTTP overview
Web and HTTP Protocolo HTTP Web page consists of objects Object can be HTML file, JPEG image, Java applet, audio file, Web page consists of base HTML-file which includes several referenced objects Each
HTML Forms and CONTROLS
HTML Forms and CONTROLS Web forms also called Fill-out Forms, let a user return information to a web server for some action. The processing of incoming data is handled by a script or program written in
Forms, CGI Objectives. HTML forms. Form example. Form example...
The basics of HTML forms How form content is submitted GET, POST Elements that you can have in forms Responding to forms Common Gateway Interface (CGI) Later: Servlets Generation of dynamic Web content
HTTP. Internet Engineering. Fall 2015. Bahador Bakhshi CE & IT Department, Amirkabir University of Technology
HTTP Internet Engineering Fall 2015 Bahador Bakhshi CE & IT Department, Amirkabir University of Technology Questions Q1) How do web server and client browser talk to each other? Q1.1) What is the common
Internet Technologies
QAFQAZ UNIVERSITY Computer Engineering Department Internet Technologies HTML Forms Dr. Abzetdin ADAMOV Chair of Computer Engineering Department [email protected] http://ce.qu.edu.az/~aadamov What are forms?
Dynamic Content. Dynamic Web Content: HTML Forms CGI Web Servers and HTTP
Dynamic Web Content: HTML Forms CGI Web Servers and HTTP Duncan Temple Lang Dept. of Statistics UC Davis Dynamic Content We are all used to fetching pages from a Web server. Most are prepared by a human
CTIS 256 Web Technologies II. Week # 1 Serkan GENÇ
CTIS 256 Web Technologies II Week # 1 Serkan GENÇ Introduction Aim: to be able to develop web-based applications using PHP (programming language) and mysql(dbms). Internet is a huge network structure connecting
Multimedia im Netz Online Multimedia Winter semester 2015/16. Tutorial 03 Major Subject
Multimedia im Netz Online Multimedia Winter semester 2015/16 Tutorial 03 Major Subject Ludwig- Maximilians- Universität München Online Multimedia WS 2015/16 - Tutorial 03-1 Today s Agenda Quick test Server
Introduction to Server-Side Programming. Charles Liu
Introduction to Server-Side Programming Charles Liu Overview 1. Basics of HTTP 2. PHP syntax 3. Server-side programming 4. Connecting to MySQL Request to a Static Site Server: 1. Homepage lookup 2. Send
c. Write a JavaScript statement to print out as an alert box the value of the third Radio button (whether or not selected) in the second form.
Practice Problems: These problems are intended to clarify some of the basic concepts related to access to some of the form controls. In the process you should enter the problems in the computer and run
HTTP Protocol. Bartosz Walter <[email protected]>
HTTP Protocol Bartosz Walter Agenda Basics Methods Headers Response Codes Cookies Authentication Advanced Features of HTTP 1.1 Internationalization HTTP Basics defined in
WIRIS quizzes web services Getting started with PHP and Java
WIRIS quizzes web services Getting started with PHP and Java Document Release: 1.3 2011 march, Maths for More www.wiris.com Summary This document provides client examples for PHP and Java. Contents WIRIS
Website Login Integration
SSO Widget Website Login Integration October 2015 Table of Contents Introduction... 3 Getting Started... 5 Creating your Login Form... 5 Full code for the example (including CSS and JavaScript):... 7 2
Abusing HTML5. DEF CON 19 Ming Chow Lecturer, Department of Computer Science TuCs University Medford, MA 02155 [email protected]
Abusing HTML5 DEF CON 19 Ming Chow Lecturer, Department of Computer Science TuCs University Medford, MA 02155 [email protected] What is HTML5? The next major revision of HTML. To replace XHTML? Yes Close
SUBJECT CODE : 4074 PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDIT : 4 TIME SCHEDULE UNIT TOPIC PERIODS 1. INTERNET FUNDAMENTALS & HTML Test 1
SUBJECT TITLE : WEB TECHNOLOGY SUBJECT CODE : 4074 PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDIT : 4 TIME SCHEDULE UNIT TOPIC PERIODS 1. INTERNET FUNDAMENTALS & HTML Test 1 16 02 2. CSS & JAVASCRIPT Test
Contents. 2 Alfresco API Version 1.0
The Alfresco API Contents The Alfresco API... 3 How does an application do work on behalf of a user?... 4 Registering your application... 4 Authorization... 4 Refreshing an access token...7 Alfresco CMIS
CONTENT of this CHAPTER
CONTENT of this CHAPTER v DNS v HTTP and WWW v EMAIL v SNMP 3.2.1 WWW and HTTP: Basic Concepts With a browser you can request for remote resource (e.g. an HTML file) Web server replies to queries (e.g.
1. When will an IP process drop a datagram? 2. When will an IP process fragment a datagram? 3. When will a TCP process drop a segment?
Questions 1. When will an IP process drop a datagram? 2. When will an IP process fragment a datagram? 3. When will a TCP process drop a segment? 4. When will a TCP process resend a segment? CP476 Internet
Network Technologies
Network Technologies Glenn Strong Department of Computer Science School of Computer Science and Statistics Trinity College, Dublin January 28, 2014 What Happens When Browser Contacts Server I Top view:
Dynamic Web-Enabled Data Collection
Dynamic Web-Enabled Data Collection S. David Riba, Introduction Web-based Data Collection Forms Error Trapping Server Side Validation Client Side Validation Dynamic generation of web pages with Scripting
PHP Form Handling. Prof. Jim Whitehead CMPS 183 Spring 2006 May 3, 2006
PHP Form Handling Prof. Jim Whitehead CMPS 183 Spring 2006 May 3, 2006 Importance A web application receives input from the user via form input Handling form input is the cornerstone of a successful web
Script Handbook for Interactive Scientific Website Building
Script Handbook for Interactive Scientific Website Building Version: 173205 Released: March 25, 2014 Chung-Lin Shan Contents 1 Basic Structures 1 11 Preparation 2 12 form 4 13 switch for the further step
Web. Services. Web Technologies. Today. Web. Technologies. Internet WWW. Protocols TCP/IP HTTP. Apache. Next Time. Lecture #3 2008 3 Apache.
JSP, and JSP, and JSP, and 1 2 Lecture #3 2008 3 JSP, and JSP, and Markup & presentation (HTML, XHTML, CSS etc) Data storage & access (JDBC, XML etc) Network & application protocols (, etc) Programming
JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK
Programming for Digital Media EE1707 JavaScript By: A. Mousavi & P. Broomhead SERG, School of Engineering Design, Brunel University, UK 1 References and Sources 1. DOM Scripting, Web Design with JavaScript
reference: HTTP: The Definitive Guide by David Gourley and Brian Totty (O Reilly, 2002)
1 cse879-03 2010-03-29 17:23 Kyung-Goo Doh Chapter 3. Web Application Technologies reference: HTTP: The Definitive Guide by David Gourley and Brian Totty (O Reilly, 2002) 1. The HTTP Protocol. HTTP = HyperText
HTTP Response Splitting
The Attack HTTP Response Splitting is a protocol manipulation attack, similar to Parameter Tampering The attack is valid only for applications that use HTTP to exchange data Works just as well with HTTPS
HTML Tables. IT 3203 Introduction to Web Development
IT 3203 Introduction to Web Development Tables and Forms September 3 HTML Tables Tables are your friend: Data in rows and columns Positioning of information (But you should use style sheets for this) Slicing
Client-side Web Engineering From HTML to AJAX
Client-side Web Engineering From HTML to AJAX SWE 642, Spring 2008 Nick Duan 1 What is Client-side Engineering? The concepts, tools and techniques for creating standard web browser and browser extensions
Chapter 2: Interactive Web Applications
Chapter 2: Interactive Web Applications 2.1! Interactivity and Multimedia in the WWW architecture 2.2! Server-Side Scripting (Example PHP, Part I) 2.3! Interactivity and Multimedia for Web Browsers 2.4!
ICT 6012: Web Programming
ICT 6012: Web Programming Covers HTML, PHP Programming and JavaScript Covers in 13 lectures a lecture plan is supplied. Please note that there are some extra classes and some cancelled classes Mid-Term
Application layer Web 2.0
Information Network I Application layer Web 2.0 Youki Kadobayashi NAIST They re revolving around the web, after all Name any Internet-related buzz: Cloud computing Smartphone Social media... You ll end
Cyber Security Workshop Ethical Web Hacking
Cyber Security Workshop Ethical Web Hacking May 2015 Setting up WebGoat and Burp Suite Hacking Challenges in WebGoat Concepts in Web Technologies and Ethical Hacking 1 P a g e Downloading WebGoat and Burp
LabVIEW Internet Toolkit User Guide
LabVIEW Internet Toolkit User Guide Version 6.0 Contents The LabVIEW Internet Toolkit provides you with the ability to incorporate Internet capabilities into VIs. You can use LabVIEW to work with XML documents,
2- Forms and JavaScript Course: Developing web- based applica<ons
2- Forms and JavaScript Course: Cris*na Puente, Rafael Palacios 2010- 1 Crea*ng forms Forms An HTML form is a special section of a document which gathers the usual content plus codes, special elements
XHTML Forms. Form syntax. Selection widgets. Submission method. Submission action. Radio buttons
XHTML Forms Web forms, much like the analogous paper forms, allow the user to provide input. This input is typically sent to a server for processing. Forms can be used to submit data (e.g., placing an
Further web design: HTML forms
Further web design: HTML forms Practical workbook Aims and Learning Objectives The aim of this document is to introduce HTML forms. By the end of this course you will be able to: use existing forms on
JAVASCRIPT AND COOKIES
JAVASCRIPT AND COOKIES http://www.tutorialspoint.com/javascript/javascript_cookies.htm Copyright tutorialspoint.com What are Cookies? Web Browsers and Servers use HTTP protocol to communicate and HTTP
Outline Definition of Webserver HTTP Static is no fun Software SSL. Webserver. in a nutshell. Sebastian Hollizeck. June, the 4 th 2013
Definition of in a nutshell June, the 4 th 2013 Definition of Definition of Just another definition So what is it now? Example CGI php comparison log-file Definition of a formal definition Aisaprogramthat,usingthe
JASPERREPORTS SERVER WEB SERVICES GUIDE
JASPERREPORTS SERVER WEB SERVICES GUIDE RELEASE 5.0 http://www.jaspersoft.com JasperReports Server Web Services Guide Copyright 2012 Jaspersoft Corporation. All rights reserved. Printed in the U.S.A. Jaspersoft,
Short notes on webpage programming languages
Short notes on webpage programming languages What is HTML? HTML is a language for describing web pages. HTML stands for Hyper Text Markup Language HTML is a markup language A markup language is a set of
WWW. World Wide Web Aka The Internet. dr. C. P. J. Koymans. Informatics Institute Universiteit van Amsterdam. November 30, 2007
WWW World Wide Web Aka The Internet dr. C. P. J. Koymans Informatics Institute Universiteit van Amsterdam November 30, 2007 dr. C. P. J. Koymans (UvA) WWW November 30, 2007 1 / 36 WWW history (1) 1968
JavaScript and Dreamweaver Examples
JavaScript and Dreamweaver Examples CSC 103 October 15, 2007 Overview The World is Flat discussion JavaScript Examples Using Dreamweaver HTML in Dreamweaver JavaScript Homework 3 (due Friday) 1 JavaScript
CS412 Interactive Lab Creating a Simple Web Form
CS412 Interactive Lab Creating a Simple Web Form Introduction In this laboratory, we will create a simple web form using HTML. You have seen several examples of HTML pages and forms as you have worked
Introduction to XHTML. 2010, Robert K. Moniot 1
Chapter 4 Introduction to XHTML 2010, Robert K. Moniot 1 OBJECTIVES In this chapter, you will learn: Characteristics of XHTML vs. older HTML. How to write XHTML to create web pages: Controlling document
TCP/IP Networking An Example
TCP/IP Networking An Example Introductory material. This module illustrates the interactions of the protocols of the TCP/IP protocol suite with the help of an example. The example intents to motivate the
Web applications. Web security: web basics. HTTP requests. URLs. GET request. Myrto Arapinis School of Informatics University of Edinburgh
Web applications Web security: web basics Myrto Arapinis School of Informatics University of Edinburgh HTTP March 19, 2015 Client Server Database (HTML, JavaScript) (PHP) (SQL) 1 / 24 2 / 24 URLs HTTP
<option> eggs </option> <option> cheese </option> </select> </p> </form>
FORMS IN HTML A form is the usual way information is gotten from a browser to a server HTML has tags to create a collection of objects that implement this information gathering The objects are called widgets
Hypertext for Hyper Techs
Hypertext for Hyper Techs An Introduction to HTTP for SecPros Bio Josh Little, GSEC ~14 years in IT. Support, Server/Storage Admin, Webmaster, Web App Dev, Networking, VoIP, Projects, Security. Currently
Slide.Show Quick Start Guide
Slide.Show Quick Start Guide Vertigo Software December 2007 Contents Introduction... 1 Your first slideshow with Slide.Show... 1 Step 1: Embed the control... 2 Step 2: Configure the control... 3 Step 3:
How to Run an Apache HTTP Server With a Protocol
HTTP Servers Jacco van Ossenbruggen CWI/VU Amsterdam 1 Learning goals Understand: Basis HTTP server functionality Serving static content from HTML and other files Serving dynamic content from software
JISIS and Web Technologies
27 November 2012 Status: Draft Author: Jean-Claude Dauphin JISIS and Web Technologies I. Introduction This document does aspire to explain how J-ISIS is related to Web technologies and how to use J-ISIS
http://alice.teaparty.wonderland.com:23054/dormouse/bio.htm
Client/Server paradigm As we know, the World Wide Web is accessed thru the use of a Web Browser, more technically known as a Web Client. 1 A Web Client makes requests of a Web Server 2, which is software
Introduction to Computer Security
Introduction to Computer Security Web Application Security Pavel Laskov Wilhelm Schickard Institute for Computer Science Modern threat landscape The majority of modern vulnerabilities are found in web
600-152 People Data and the Web Forms and CGI CGI. Facilitating interactive web applications
CGI Facilitating interactive web applications Outline In Informatics 1, worksheet 7 says You will learn more about CGI and forms if you enroll in Informatics 2. Now we make good on that promise. First
PHP Tutorial From beginner to master
PHP Tutorial From beginner to master PHP is a powerful tool for making dynamic and interactive Web pages. PHP is the widely-used, free, and efficient alternative to competitors such as Microsoft's ASP.
Web Programming with PHP 5. The right tool for the right job.
Web Programming with PHP 5 The right tool for the right job. PHP as an Acronym PHP PHP: Hypertext Preprocessor This is called a Recursive Acronym GNU? GNU s Not Unix! CYGNUS? CYGNUS is Your GNU Support
PHP Authentication Schemes
7 PHP Authentication Schemes IN THIS CHAPTER Overview Generating Passwords Authenticating User Against Text Files Authenticating Users by IP Address Authenticating Users Using HTTP Authentication Authenticating
Web Architecture I 03.12.2014. u www.tugraz.at
1 Web Architecture I Web Architecture I u www.tugraz.at 2 Outline Development of the Web Quality Requirements HTTP Protocol Web Architecture A Changing Web Web Applications and State Management Web n-tier
TIME SCHEDULE OBJECTIVES
COURSE TITLE : WEB DESIGN COURSE CODE : 3073 COURSE CATEGORY : B PERIODS/WEEK : 4 PERIODS/ SEMESTER : 72 CREDITS : 4 TIME SCHEDULE MODULE TOPICS PERIODS 1 Internet fundamentals 18 2 Html, css and web design
The Web: some jargon. User agent for Web is called a browser: Web page: Most Web pages consist of: Server for Web is called Web server:
The Web: some jargon Web page: consists of objects addressed by a URL Most Web pages consist of: base HTML page, and several referenced objects. URL has two components: host name and path name: User agent
Intell-a-Keeper Reporting System Technical Programming Guide. Tracking your Bookings without going Nuts! http://www.acorn-is.
Intell-a-Keeper Reporting System Technical Programming Guide Tracking your Bookings without going Nuts! http://www.acorn-is.com 877-ACORN-99 Step 1: Contact Marian Talbert at Acorn Internet Services at
Spectrum Technology Platform
Spectrum Technology Platform Version 8.0.0 SP2 RIA Getting Started Guide Information in this document is subject to change without notice and does not represent a commitment on the part of the vendor or
Login with Amazon. Getting Started Guide for Websites. Version 1.0
Login with Amazon Getting Started Guide for Websites Version 1.0 Login with Amazon: Getting Started Guide for Websites Copyright 2016 Amazon Services, LLC or its affiliates. All rights reserved. Amazon
Novell Identity Manager
AUTHORIZED DOCUMENTATION Manual Task Service Driver Implementation Guide Novell Identity Manager 4.0.1 April 15, 2011 www.novell.com Legal Notices Novell, Inc. makes no representations or warranties with
JavaScript: Introduction to Scripting. 2008 Pearson Education, Inc. All rights reserved.
1 6 JavaScript: Introduction to Scripting 2 Comment is free, but facts are sacred. C. P. Scott The creditor hath a better memory than the debtor. James Howell When faced with a decision, I always ask,
Hello World RESTful web service tutorial
Hello World RESTful web service tutorial Balázs Simon ([email protected]), BME IIT, 2015 1 Introduction This document describes how to create a Hello World RESTful web service in Eclipse using JAX-RS
Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence
Web Development Owen Sacco ICS2205/ICS2230 Web Intelligence Brief Course Overview An introduction to Web development Server-side Scripting Web Servers PHP Client-side Scripting HTML & CSS JavaScript &
Web Development 1 A4 Project Description Web Architecture
Web Development 1 Introduction to A4, Architecture, Core Technologies A4 Project Description 2 Web Architecture 3 Web Service Web Service Web Service Browser Javascript Database Javascript Other Stuff:
Internet Technologies Internet Protocols and Services
QAFQAZ UNIVERSITY Computer Engineering Department Internet Technologies Internet Protocols and Services Dr. Abzetdin ADAMOV Chair of Computer Engineering Department [email protected] http://ce.qu.edu.az/~aadamov
Working with forms in PHP
2002-6-29 Synopsis In this tutorial, you will learn how to use forms with PHP. Page 1 Forms and PHP One of the most popular ways to make a web site interactive is the use of forms. With forms you can have
Modern Web Development From Angle Brackets to Web Sockets
Modern Web Development From Angle Brackets to Web Sockets Pete Snyder Outline (or, what am i going to be going on about ) 1.What is the Web? 2.Why the web matters 3.What s unique about
No. Time Source Destination Protocol Info 1190 131.859385 128.238.245.34 128.119.245.12 HTTP GET /ethereal-labs/http-ethereal-file1.html HTTP/1.
Ethereal Lab: HTTP 1. The Basic HTTP GET/response interaction 1190 131.859385 128.238.245.34 128.119.245.12 HTTP GET /ethereal-labs/http-ethereal-file1.html HTTP/1.1 GET /ethereal-labs/http-ethereal-file1.html
XML Processing and Web Services. Chapter 17
XML Processing and Web Services Chapter 17 Textbook to be published by Pearson Ed 2015 in early Pearson 2014 Fundamentals of http://www.funwebdev.com Web Development Objectives 1 XML Overview 2 XML Processing
Computer Networks. Lecture 7: Application layer: FTP and HTTP. Marcin Bieńkowski. Institute of Computer Science University of Wrocław
Computer Networks Lecture 7: Application layer: FTP and Marcin Bieńkowski Institute of Computer Science University of Wrocław Computer networks (II UWr) Lecture 7 1 / 23 Reminder: Internet reference model
THE PROXY SERVER 1 1 PURPOSE 3 2 USAGE EXAMPLES 4 3 STARTING THE PROXY SERVER 5 4 READING THE LOG 6
The Proxy Server THE PROXY SERVER 1 1 PURPOSE 3 2 USAGE EXAMPLES 4 3 STARTING THE PROXY SERVER 5 4 READING THE LOG 6 2 1 Purpose The proxy server acts as an intermediate server that relays requests between
Research of Web Real-Time Communication Based on Web Socket
Int. J. Communications, Network and System Sciences, 2012, 5, 797-801 http://dx.doi.org/10.4236/ijcns.2012.512083 Published Online December 2012 (http://www.scirp.org/journal/ijcns) Research of Web Real-Time
DESIGNING HTML HELPERS TO OPTIMIZE WEB APPLICATION DEVELOPMENT
Abstract DESIGNING HTML HELPERS TO OPTIMIZE WEB APPLICATION DEVELOPMENT Dragos-Paul Pop 1 Building a web application or a website can become difficult, just because so many technologies are involved. Generally
Table of Contents. Open-Xchange Authentication & Session Handling. 1.Introduction...3
Open-Xchange Authentication & Session Handling Table of Contents 1.Introduction...3 2.System overview/implementation...4 2.1.Overview... 4 2.1.1.Access to IMAP back end services...4 2.1.2.Basic Implementation
Chapter 27 Hypertext Transfer Protocol
Chapter 27 Hypertext Transfer Protocol Columbus, OH 43210 [email protected] http://www.cis.ohio-state.edu/~jain/ 27-1 Overview Hypertext language and protocol HTTP messages Browser architecture CGI
The Web History (I) The Web History (II)
Goals of Today s Lecture EE 122: The World Wide Web Ion Stoica TAs: Junda Liu, DK Moon, David Zats http://inst.eecs.berkeley.edu/~ee122/ (Materials with thanks to Vern Paxson, Jennifer Rexford, and colleagues
Chapter 22 How to send email and access other web sites
Chapter 22 How to send email and access other web sites Murach's PHP and MySQL, C22 2010, Mike Murach & Associates, Inc. Slide 1 Objectives Applied 1. Install and use the PEAR Mail package to send email
World Wide Web. Before WWW
World Wide Web [email protected] Before WWW Major search tools: Gopher and Archie Archie Search FTP archives indexes Filename based queries Gopher Friendly interface Menu driven queries João Neves 2
Portals and Hosted Files
12 Portals and Hosted Files This chapter introduces Progress Rollbase Portals, portal pages, portal visitors setup and management, portal access control and login/authentication and recommended guidelines
Investigation Report Regarding Security Issues of Web Applications Using HTML5
Investigation Report Regarding Security Issues of Web Applications Using HTML5 JPCERT Coordination Center October 30, 2013 Contents 1. Introduction... 2 2. Purpose and Method of This Investigation... 4
Fachgebiet Technische Informatik, Joachim Zumbrägel
Computer Network Lab 2015 Fachgebiet Technische Informatik, Joachim Zumbrägel Overview Internet Internet Protocols Fundamentals about HTTP Communication HTTP-Server, mode of operation Static/Dynamic Webpages
InternetVista Web scenario documentation
InternetVista Web scenario documentation Version 1.2 1 Contents 1. Change History... 3 2. Introduction to Web Scenario... 4 3. XML scenario description... 5 3.1. General scenario structure... 5 3.2. Steps
Yandex.Widgets Quick start
17.09.2013 .. Version 2 Document build date: 17.09.2013. This volume is a part of Yandex technical documentation. Yandex helpdesk site: http://help.yandex.ru 2008 2013 Yandex LLC. All rights reserved.
The purpose of jquery is to make it much easier to use JavaScript on your website.
jquery Introduction (Source:w3schools.com) The purpose of jquery is to make it much easier to use JavaScript on your website. What is jquery? jquery is a lightweight, "write less, do more", JavaScript
Configuring iplanet 6.0 Web Server For SSL and non-ssl Redirect
Introduction Configuring iplanet 6.0 Web Server For SSL and non-ssl Redirect This document describes the process for configuring an iplanet web server for the following situation: Require that clients
Xtreeme Search Engine Studio Help. 2007 Xtreeme
Xtreeme Search Engine Studio Help 2007 Xtreeme I Search Engine Studio Help Table of Contents Part I Introduction 2 Part II Requirements 4 Part III Features 7 Part IV Quick Start Tutorials 9 1 Steps to
How To Test Your Web Site On Wapt On A Pc Or Mac Or Mac (Or Mac) On A Mac Or Ipad Or Ipa (Or Ipa) On Pc Or Ipam (Or Pc Or Pc) On An Ip
Load testing with WAPT: Quick Start Guide This document describes step by step how to create a simple typical test for a web application, execute it and interpret the results. A brief insight is provided
SEEM4540 Open Systems for E-Commerce Lecture 06 Online Payment
SEEM4540 Open Systems for E-Commerce Lecture 06 Online Payment PayPal PayPal is an American based e-commerce business allowing payments and money transfers to be made through the Internet. In 1998, a company
Oracle Forms Services Secure Web.Show_Document() calls to Oracle Reports Server 6i
Oracle Forms Services Secure Web.Show_Document() calls to Oracle Reports Server 6i $Q2UDFOH7HFKQLFDO:KLWHSDSHU 0DUFK Secure Web.Show_Document() calls to Oracle Reports Server 6i Introduction...3 solution
LAB MANUAL CS-322364(22): Web Technology
RUNGTA COLLEGE OF ENGINEERING & TECHNOLOGY (Approved by AICTE, New Delhi & Affiliated to CSVTU, Bhilai) Kohka Kurud Road Bhilai [C.G.] LAB MANUAL CS-322364(22): Web Technology Department of COMPUTER SCIENCE
Architecture of So-ware Systems HTTP Protocol. Mar8n Rehák
Architecture of So-ware Systems HTTP Protocol Mar8n Rehák HTTP Protocol Hypertext Transfer Protocol Designed to transfer hypertext informa8on over the computer networks Hypertext: Structured text with