CS 418 Web Programming Spring 2013 LAMP, WEB ARCHITECTURE, AND HTTP SCOTT G. AINSWORTH http://www.cs.odu.edu/~sainswor/cs418-s13/
2 OUTLINE Assigned Reading Chapter 1 Configuring Your Installation pgs. 3-26 Brief Intro to Open Source Pieces of AMP Configuring Apache, PHP, MySQL Resources Open Source LAMP Web Architecture HTTP
3 OPEN SOURCE What is open source? When was the term coined (i.e., when was its first usage)? What was the first open source OS?
4 WHAT S SO SPECIAL ABOUT OPEN SOURCE PROJECTS? They re free no licensing or sales fees They are cross-platform and technology-neutral must run on more than one OS They must not restrict other software derivative works don t have to be open source They embraces diversity cannot discriminate against any person or group of persons http://www.opensource.org
5 LAMP Linux OS Apache web server All are open source MySQL relational database system, enables PHP and Apache to work together PHP server-side scripting
6 LAMP FOR CS 418/518 sainsworth418.cs.odu.edu if you registered before Aug 7, you already have an account (same as CS Unix) put files in /~username/cs418_html/ create a /~username/cs418_html/example_code/ directory for in-class examples all directories in /~username/cs418_html/ should be chmod 755 only accessible from on-campus must use https:// to access Linux Ubuntu 2.6.32 Apache MySQL 5.1.62 PHP 5.3.2
7 ASSIGNMENT FOR THURSDAY Subscribe to the class email list http://list.odu.edu/mailman/listinfo/cs418-sga Log in to sainsworth418.cs.odu.edu uid/passwds same as *.cs.odu.edu machines MySQL login == linux login; passwd = (to be determined) Start reading Ch 2 and practicing with the code examples Email me your group info! If you re not in a group by 11:59 PM February 7, 2012, you re solo. http://www.cs.odu.edu/~sainswor/cs418-s13/assign1
8 OUTLINE Open Source LAMP Web Architecture HTTP
9 THE WEB User agent (client) for the Web is called a browser MS Internet Explorer Mozilla Firefox Apple Safari Google Chrome Server for the Web is called a Web server Apache (public domain) MS Internet Information Server (IIS)
10 WEB TERMINOLOGY Web page addressed by a URI consists of objects Most Web pages consist of base HTML page embedded objects
11 WEB TERMINOLOGY Web page addressed by a URI consists of objects Most Web pages <html lang="en"> <head> consist of <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <title>cnn.com</title> <meta http-equiv="refresh" content="1800; URL=http://www.cnn.com/?"> <link rel="stylesheet" href="http://i.cnn.net/cnn/virtual/2001/style/main.css" type="text/css"> base HTML page embedded objects <script language="javascript1.1" src="http://i.cnn.net/cnn/virtual/2000/code/main.js" type="text/javascript"> </script> <script language="javascript1.1" type="text/javascript"> </script> <script language="javascript1.1" src="http://ar.atwola.com/file/adswrapper.js"></script> <style type="text/css"></style> <script language="javascript">document.adoffset=0</script> </head> <body class="cnnmainbody" bgcolor="#ffffff"> <a name="top_of_page"></a> : :
12 DEFINING THE WEB / HTTP HTTP was originally defined by Request for Comments (RFCs) 1945, 2068, 2616 and several others for defining URLs, URIs, etc. While RFC 2616 remains canonical for HTTP, we have a new document for the Web (URIs + protocols + formats) : The Architecture of the World Wide Web, Volume One - http://www.w3.org/tr/webarch/
13 The key words "MUST", "MUST NOT", "REQUIRED", "SHALL", "SHALL NOT", "SHOULD", "SHOULD NOT", "RECOMMENDED", "MAY", and "OPTIONAL" in this document are to be interpreted as described in RFC 2119. 1. MUST This word, or the terms "REQUIRED" or "SHALL", mean that the definition is an absolute requirement of the specification. 2. MUST NOT This phrase, or the phrase "SHALL NOT", mean that the definition is an absolute prohibition of the specification. 3. SHOULD This word, or the adjective "RECOMMENDED", mean that there may exist valid reasons in particular circumstances to ignore a particular item, but the full implications must be understood and carefully weighed before choosing a different course. HOW TO READ RFCS (QUOTING FROM RFC 2119) 4. SHOULD NOT This phrase, or the phrase "NOT RECOMMENDED" mean that there may exist valid reasons in particular circumstances when the particular behavior is acceptable or even useful, but the full implications should be understood and the case carefully weighed before implementing any behavior described with this label. 5. MAY This word, or the adjective "OPTIONAL", mean that an item is truly optional. One vendor may choose to include the item because a particular marketplace requires it or because the vendor feels that it enhances the product while another vendor may omit the same item. An implementation which does not include a particular option MUST be prepared to interoperate with another implementation which does include the option, though perhaps with reduced functionality. In the same vein an implementation which does include a particular option MUST be prepared to interoperate with another implementation which does not include the option (except, of course, for the feature the option provides.)
14 EXAMPLES FROM RFC 2616 10.4.4 403 Forbidden The server understood the request, but is refusing to fulfill it. Authorization will not help and the request SHOULD NOT be repeated. 10.4.6 405 Method Not Allowed The method specified in the Request-Line is not allowed for the resource identified by the Request-URI. The response MUST include an Allow header containing a list of valid methods for the requested resource. 10.4.9 408 Request Timeout The client did not produce a request within the time that the server was prepared to wait. The client MAY repeat the request without modifications at any later time.
15 READING THE W3C ARCH Principles fundamental rule or law that is widely applicable Constraints definitions imposed by the architects of the Web MUST, SHALL Good Practice things you should be doing, but they can t / shouldn t be defined as constraints SHOULD, RECOMMENDED
16 EXAMPLE IDENTIFIERS Principle: Global Identifiers Global naming leads to global network effects. Good practice: Identify with URIs To benefit from and increase the value of the World Wide Web, agents should provide URIs as identifiers for resources. Constraint: URIs Identify a Single Resource Assign distinct URIs to distinct resources.
17 UNIFORM RESOURCE IDENTIFIERS URI RFC 3986 (2396) URL RFC 1738 URN RFC 2141 A URN is similar to a person's name, while a URL is like a street address. The URN defines something's identity, while the URL provides a location. Essentially, "what" vs. "where".
18 URI SCHEMES foo://username:password@example.com:8042/over/there/index.dtb;type=animal?name=ferret#nose \ / \ /\ / \ / \ / \_/ \ / \ / \ / userinfo hostname port parameter query fragment \ / \ / scheme authority path path interpretable as filename / \ / \ urn:example:animal:ferret:nose interpretable as extension taken from http://en.wikipedia.org/wiki/uri_scheme
19 IMPORTANT WEB ARCHITECTURE CONCEPTS (AS DEFINED BY THE WEB ARCHITECTURE) URIs identify Resources Representations represent Resources When URIs are dereferenced, they return representations (i.e., a resource is never returned) taken from: http://www.w3.org/tr/webarch/
20 W3C WEB ARCHITECTURE URI Representation 2 Identifies Represents Resource Content Negotiation The tools we have to solve the interoperability problem are: Resource URI Representation Represents Representation 1 slide from Herbert Van de Sompel
21 OUTLINE Open Source LAMP Web Architecture HTTP
22 HYPERTEXT TRANSFER PROTOCOL (HTTP) Web's application layer protocol Client/server model client: browser that requests, receives, displays Web objects server: Web server sends objects in response to requests PC running Firefox Mac running Safari Server running Apache
23 HTTP OVERVIEW HTTP uses TCP browser initiates TCP connection to server (on port 80) HTTP messages exchanged between browser and Web server HTTP is stateless server maintains no information about past browser requests
24 HTTP EXAMPLE User enters URI www.someschool.edu/ somedept/home.index referenced object contains HTML text and references 10 JPEG images Browser will read the file and sequentially make 10 separate requests for the embedded JPEG images Browser sends an HTTP GET request to the server www.someschool.edu... Web Server Server will retrieve and send the HTML file Browser
25 HTTP EXAMPLE WWW.SOMESCHOOL.EDU/SOMEDEP T/HOME.INDEX Client 1) Browser initiates TCP connection to server at www.someschool.edu. Port 80 is well known for server Server 0) Server process at host www.someschool.edu waiting for TCP connections on port 80 time 3) Client writes an HTTP GET request message (containing path) to TCP socket 2) Server accepts connection 4) Server reads request message, forms response message containing requested object, writes message to socket
26 HTTP EXAMPLE WWW.SOMESCHOOL.EDU/SOMEDEP T/HOME.INDEX Client 6) Browser reads response message containing the HTML file. Ten references to JPEG objects are found during the HTML parse 7) Client writes an HTTP GET request message (containing path) to TCP socket Server 8) Server reads request message, forms response message containing requested object, writes message to socket time The above steps are repeated for each of the 10 JPEG objects
27 HTTP REQUEST MESSAGE FORMAT HTTP messages are ASCII (human-readable) HTTP request message:» Request line» Optional header lines method <SP> path <SP> version <CR><LF> header field name : value <CR><LF>» Present only for some methods (e.g., POST) header field name : value <CR><LF> <CR><LF> entity body
28 LOTS OF HTTP METHODS GET, HEAD TRACE for debugging OPTIONS what methods are defined on this URI? DELETE rarely supported for most URIs PUT also rarely supported unix semantics: % echo hello world > temp.txt POST commonly supported unix semantics: % echo hello world spell Want to learn more? See RFC 2616 http://www.ietf.org/rfc/rfc2616.txt
29 GOOGLE CHROME REQUEST EXAMPLE How does Chrome process http://www.cs.odu.edu/~sainswor/? GET /~ainswort/ HTTP/1.1 Host: www.cs.odu.edu Connection: keep-alive User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_6_8) AppleWebKit/535.1 (KHTML, like Gecko) Chrome/13.0.782.220 Safari/535.1 Accept: text/html,application/xhtml+xml,application/ xml;q=0.9,*/*;q=0.8 Accept-Encoding: gzip,deflate,sdch Accept-Language: en-us,en;q=0.8 Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.3
30 HTTP RESPONSE MESSAGE FORMAT HTTP messages are ASCII (human-readable) HTTP response message:» Status line» Optional header lines» Requested object, error message message, etc. version <SP> code <SP> phrase <CR><LF> header field name : value <CR><LF> ` header field name : value <CR><LF> <CR><LF> entity body
31 HTTP RESPONSE STATUS CODES 1xx: Informational - Request received, continuing process 2xx: Success - The action was successfully received, understood, and accepted 3xx: Redirection - Further action must be taken in order to complete the request 4xx: Client Error - The request contains bad syntax or cannot be fulfilled 5xx: Server Error - The server failed to fulfill an apparently valid request from section 6.1.1 of RFC 2616
32 RESPONSE STATUS CODES EXAMPLES 200 OK Request succeeded, requested object later in this message 301 Moved Permanently Requested object moved, new location specified later in this message (Location:) 400 Bad Request Request message not understood by server 404 Not Found Requested document not found on this server 505 HTTP Version Not Supported
33 TALKING TO HTTP SERVERS antares% curl --head www.cs.odu.edu/~sainswor/ HTTP/1.1 200 OK Date: Fri, 22 Jun 2012 18:41:01 GMT Server: Apache/2.2.17 (Unix) PHP/5.3.5 mod_ssl/2.2.17 OpenSSL/0.9.8q X-Powered-By: PHP/5.3.5 Expires: Tue, 01 Jan 2002 00:00:00 GMT Cache-Control: no-store, no-cache, must-revalidate Content-Type: text/html; charset=iso-8859-1; antares$ curl --head www.google.com/ HTTP/1.1 200 OK Date: Fri, 22 Jun 2012 18:41:28 GMT Expires: -1 Cache-Control: private, max-age=0 Content-Type: text/html; charset=iso-8859-1 curl is convenient, but speaking raw HTTP is more fun Set-Cookie: PREF=ID=53ea81e60c8225fb:FF=0:TM=1340390488:LM=1340390488: P3P: CP="This is not a P3P policy! See http://www.google.com/support/ac Server: gws X-XSS-Protection: 1; mode=block X-Frame-Options: SAMEORIGIN Transfer-Encoding: chunked
34 TELNET EXAMPLE Connect to HTTP server and port Telnet output Type GET command plus blank line HTTP response status line HTTP response headers plus blank line % telnet www.cs.odu.edu 80 Trying 128.82.4.2... Connected to www.cs.odu.edu. Escape character is '^]'. GET /~sainswor/files/foo.txt HTTP/1.0 HTTP/1.1 200 OK Date: Fri, 17 Sep 2010 17:37:06 GMT Server: Apache/2.2.14 (Unix) DAV/2 PHP/5.2.11 Last-Modified: Tue, 15 Sep 2009 18:14:46 GMT ETag: "921a6-65-473a1c1d91187" Accept-Ranges: bytes Content-Length: 101 Connection: close Content-Type: text/plain Object content Telnet output ** This test file is stored in the UNIX ** file system at ** /home/sainswor/public_html/files/foo.txt Connection closed by foreign host.
35 TELNET EXAMPLE 2 Connect to HTTP server port Telnet output Type GET command plus blank line HTTP response status line HTTP response headers plus blank line Object content Telnet output % telnet www.cnn.com 80 Trying 157.166.226.26... Connected to www.cnn.com. Escape character is '^]'. GET /notexist.html HTTP/1.0 HTTP/1.1 404 Object Not Found Date: Fri, 17 Sep 2010 17:40:11 GMT Server: Apache Set-Cookie: CG=US:VA:Norfolk; path=/ Accept-Ranges: bytes Content-Type: text/html Content-Length: 22516 Connection: close <HTML> <HEAD>....... Error type 404 - Object Not Found </body> </html> Connection closed by foreign host.
36 POST Typically the result of HTML Forms http://www.w3.org/tr/rec-html40/interact/forms.html#h- 17.13.4 Two types of values in the client s Content-type request header: application/x-www-form-urlencoded (original & default) multipart/form-data introduced in RFC-1867; allows file upload http://www.ietf.org/rfc/rfc1867.txt
37 ENCODING TYPES application/x-www-form-urlencoded Default. All characters are encoded before sent (spaces are converted to "+" symbols, and special characters are converted to ASCII HEX values) multipart/form-data No characters are encoded. This value is required when you are using forms that have a file upload control http://www.w3schools.com/tags/att_form_enctype.asp
38 HTML EXAMPLE X-WWW-FORM-URLENCODED <form action="demo_post_enctype.asp" method="post enctype="application/x-www-form-urlencoded"> First name: <input type="text" name="fname" /><br /> Last name: <input type="text" name="lname" /><br /> <input type="submit" value="submit" /> </form> http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_form_enctype
39 HTML EXAMPLE MULTIPART/FORM-DATA <form action="demo_post_enctype.asp" method="post enctype= multipart/form-data"> First name: <input type="text" name="fname" /><br /> Last name: <input type="text" name="lname" /><br /> <input type="submit" value="submit" /> </form> http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_form_enctype
40 HTTP LIVE HEADERS FIREFOX PLUGIN Allows you to view HTTP request and response headers in Firefox https://addons.mozilla.org/en- US/firefox/addon/live-httpheaders/
41 FEW WEB RESOURCES ARE STATIC FILES Client GET /foo HTTP/1.1 HTTP/1.1 200 OK Origin Server foo foo HTML, JavaScript interpreted client-side (client receives code and browser interprets it) foo foo foo HTML, PDF, etc. PHP, ASP, JSP JavaScript PHP interpreted server-side (what gets sent to the client is the output of the code, not the code itself)
42 EXAMPLE DATA FLOW Web Browser GET suggest.html Web Server suggest.html GET xmlhelperfns.js xmlhelperfns.js user presses/releases 'J' key in textbox JavaScript function is called JavaScript causes HTTP request to be sent, calling PHP script GET gethint.php?q=j&sid=12345
43 EXAMPLE DATA FLOW Web Browser Web Server gethint.php executes Joe John Joseph event handler statechange() in JavaScript is called JavaScript function is called reply from server is written to the webpage
44 OUTLINE Open Source LAMP Web Architecture Up Next: PHP Assigned Reading: Ch 2 HTTP