哈尔滨工业大学：《网络应用开发》英文版 NAD-chapter6-6

Chapter 6: Web and RPC Based P. Application Development Chapter goal Www and Http Www and hTMl Web Programming RPC and Middleware World wide web Use of Client-Server Paradigm Major application used on the Web server Internet Makes set of pages available Simple interface Uses port 80 Two concepts Web client Called a browser Creates tcp connection Sends requests for items Use of Client-Server Paradigm Use of client-Server Paradigm Primary protocol used between Response from server begins with ASCII browser and server known as Hyper Text Transfer Protocol (HPPT) Status code(200: handled request Http requests sent as text(ascir) HIYPPAA-G 280 oR Date: Mor, 3U Det 2000 01:22:22 GT GET: request an item from the server ad:St,a8cet208001:03:3 HEAD: request status information about Eag:"3e31-3883p9 an item ccept-Rangea: bytes POST: send data to the server Connection: cLose Content-Type: text/plain

1 哈工大计算机学院 李全龙 Network Application Development Server Software Design 1 Chapter 6: Web and RPC Based Application Development Chapter goal: „ WWW and HTTP „ Web Programming „ RPC and Middleware 哈工大计算机学院 李全龙 Network Application Development Server Software Design 2 WWW and HTTP 哈工大计算机学院 李全龙 Network Application Development Server Software Design 3 World Wide Web „ Major application used on the Internet „ Simple interface „ Two concepts „ Point „ Click 哈工大计算机学院 李全龙 Network Application Development Server Software Design 4 Use of Client-Server Paradigm „ Web server „ Makes set of pages available „ Uses port 80 „ Web client „ Called a browser „ Creates TCP connections to server „ Sends requests for items 哈工大计算机学院 李全龙 Network Application Development Server Software Design 5 Use of Client-Server Paradigm „ Primary protocol used between browser and server known as HyperText Transfer Protocol (HPPT) „ HTTP requests sent as text (ASCII) „ GET: request an item from the server „ HEAD: request status information about an item „ POST: send data to the server 哈工大计算机学院 李全龙 Network Application Development Server Software Design 6 Use of Client-Server Paradigm „ Response from server begins with ASCII header „ Status code (200 = handled request)

Web Components Browser Application progra a Web server Users interface to Web Becomes web client to fetch Document representation information from Web server ransfer protocol Displays information for user 工 nside a browser Illustration of a browser Main controller Receives input from user 一m Invokes client and interpreter a Clients One or more built Uses network to fetch items One or more built in Displays items a Browser contains many components Alternative Protocol Example Web Server File transfer service Running program Protocol is FTP Stores set of web documents Example URL Responds to request from browser by ftp: //Etp. cs. purdue. edu/pub/comer/netbook/clientc ding copy of documen Can be used in anchor te

2 哈工大计算机学院 李全龙 Network Application Development Server Software Design 7 Web Components „ Browser „ Web server „ Hypermedia links „ Document representation „ Transfer protocol 哈工大计算机学院 李全龙 Network Application Development Server Software Design 8 Browser „ Application program „ User’s interface to Web „ Becomes Web client to fetch information from Web server „ Displays information for user 哈工大计算机学院 李全龙 Network Application Development Server Software Design 9 Inside a Browser „Main controller „ Receives input from user „ Invokes client and interpreter „ Clients „One or more built into browser „ Uses network to fetch items „ Interpreter „One or more built in „ Displays items 哈工大计算机学院 李全龙 Network Application Development Server Software Design 10 Illustration of a Browser „ Browser contains many components 哈工大计算机学院 李全龙 Network Application Development Server Software Design 11 Alternative Protocol Example „ File transfer service „ Protocol is FTP „ Example URL ftp://ftp.cs.purdue.edu/pub/comer/netbook/client.c „ Can be used in anchor tag 哈工大计算机学院 李全龙 Network Application Development Server Software Design 12 Web Server „ Running program „ Stores set of Web documents „ Responds to request from browser by sending copy of document

Web Document Hypermedia Concept a Called a web page Web document contains mixture of a One web page per file Binary image Selectable pointers to other Web pages Specifies contents and layout Known as Hypertext Markup Language(HTML) Hypermedia Link On A Web document Terminology Associated with object or area on Markup language Gives general layout gu Internally like a symbolic link Does not specify exact placement or Advantage Can reference document on another computer Disadvantage Can become invalid Consequence of Using A Markup Language 事"Moee Web documents use the Document is free-format epresentation Embedded tags give display Instead of specifying a detailed defines document format alows a document to contain genera/ guide lines Tags often appear in pairs for display, and allows a browser to choose details. Consequently, two Beginning tag:<TAGNAME browsers may display an HTML document different

3 哈工大计算机学院 李全龙 Network Application Development Server Software Design 13 Web Document „ Called a web page „ One web page per file „ Can contain „ Binary image „ Text file „ Text standard „ Readable representation ASCII „ Specifies contents and layout „ Known as Hypertext Markup Language (HTML) 哈工大计算机学院 李全龙 Network Application Development Server Software Design 14 Hypermedia Concept „ Web document contains mixture of „ Text „ Images „ Selectable pointers to other Web pages „ Known as hypermedia 哈工大计算机学院 李全龙 Network Application Development Server Software Design 15 Hypermedia Link On A Web Document „ Associated with object or area on screen „ Internally like a symbolic link „ Advantage „ Can reference document on another computer „ Disadvantage „ Can become invalid 哈工大计算机学院 李全龙 Network Application Development Server Software Design 16 Terminology „ Markup language „ Gives general layout guidelines „ Does not specify exact placement or format 哈工大计算机学院 李全龙 Network Application Development Server Software Design 17 Consequence of Using A Markup Language Web documents use the HyperText Markup Language representation. Instead of specifying a detailed document format, HTML allows a document to contain general guidelines for display, and allows a browser to choose details. Consequently, two browsers may display an HTML document differently. 哈工大计算机学院 李全龙 Network Application Development Server Software Design 18 HTML Details „ Document is free-format „ Embedded tags give display guidelines „ Tags often appear in pairs „ Tag format „ Beginning tag: „ Ending tag:

General Form of HTML Document Document Format HTML source is free-form text that forms titlebody of body of the document appears here he document appears here /HTML> Example HTML Tags Example of HTML Line Break Begin paragraph a Input Hello there. This is Line break force a new line) exampleof HTML Outpu Hello there Main heading(largest, boldest font of HTML Next heading(next largest) Example of hTml Line Break (continued) Example of HTML Headings Inp Hello there. Thi Hello. This is a showsHTML spacing eadingBack to normal Output Hello there Hello This shov This is a heading Back to normal HTML spacing

4 哈工大计算机学院 李全龙 Network Application Development Server Software Design 19 General Form of HTML Document text that forms the document title body of the document appears here 哈工大计算机学院 李全龙 Network Application Development Server Software Design 20 Document Format text that forms the document titlebody of the document appears here „ HTML source is free-form „ Previous example equivalent to this 哈工大计算机学院 李全龙 Network Application Development Server Software Design 21 Example HTML Tags „ Begin paragraph „ Line break (force a new line) „Main heading (largest, boldest font) … text … „Next heading (next largest) … text … 哈工大计算机学院 李全龙 Network Application Development Server Software Design 22 Example of HTML Line Break „ Input Hello there.This is an exampleof HTML. „ Output Hello there. This is an example of HTML. 哈工大计算机学院 李全龙 Network Application Development Server Software Design 23 Example of HTML Line Break (continued) „ Input Hello there.This showsHTML spacing. „ Output Hello there. This shows HTML spacing. 哈工大计算机学院 李全龙 Network Application Development Server Software Design 24 Example of HTML Headings „ Input Hello.This is a headingBack to normal. „ Output Hello. This is a heading Back to normal

Other HTML Features Images in HTML Numbered or unnumbered lists Explicitly denoted as image Links to other pages Can specify alignment with text Images in HTML Links to Other Pages Here is a picture. Embedded in HTML document Browser Hides text of link fre icture Associates link with item on page Called Uniform Resource Locator (URL) General Form of url Link in HTML protocol :/ domain name item name Link specified in tag a Applies to successive items protocol to use domain name of path name Ends with server computer Called anchor Only domain name required a Defaults proTocolishttp e Port is 80 Path is index. htm/

5 哈工大计算机学院 李全龙 Network Application Development Server Software Design 25 Other HTML Features „ Numbered or unnumbered lists „ Images „ Links to other pages 哈工大计算机学院 李全龙 Network Application Development Server Software Design 26 Images in HTML „ Explicitly denoted as image „ Specified with image tag „ Can specify alignment with text „ Example image tags 哈工大计算机学院 李全龙 Network Application Development Server Software Design 27 Images in HTML Here is a picture. 哈工大计算机学院 李全龙 Network Application Development Server Software Design 28 Links to Other Pages „ Symbolic representation „ Embedded in HTML document „ Browser „ Hides text of link from user „ Associates link with item on page „ Makes item selectable „ Called Uniform Resource Locator (URL) 哈工大计算机学院 李全龙 Network Application Development Server Software Design 29 General Form of URL „Only domain name required „ Defaults „ Protocol is http „ Port is 80 „ Path is index.html protocol :// domain_name : port / item_name name of access protocol to use domain name of server computer protocol port number path name of item 哈工大计算机学院 李全龙 Network Application Development Server Software Design 30 Link in HTML „ Link specified in tag „ Applies to successive items „ Ends with „ Called anchor

Example of Anchor Tag in HTML Other Markup Languages iNput Extensible Markup Language(XML) The text is published by Tag names can be created as needed Prentice Hall, one of the Example for a corporate phone book: larger publishers of Computer Science textbooks Produces The text is published by Prentice Hall, one of ace koem 32 C/OrSon the larger publishers of Computer Science 物765555-1234/ Caching in Browsers Types of Web Pages Cache for recently accessed a stati HTML pages Stored in file Item normally fetched from cache Dynamic Formed by server Http can verify timestamp before Created on demand fetching new copy Output from a program Use Common Gateway Interface(CGr) Types of Web Pages(cont) Summary of Web Document Types Active Web documents can be grouped into Executed at client depending on when the information in Consists of a computer program Can interact with user uthor revises the dour Use Java technology whenever a ation displayed by an active document e after the document has been loaded into a browser

6 哈工大计算机学院 李全龙 Network Application Development Server Software Design 31 Example of Anchor Tag in HTML „ Input The text is published by Prentice Hall, one of the larger publishers of Computer Science textbooks. „ Produces The text is published by Prentice Hall, one of the larger publishers of Computer Science textbooks. 哈工大计算机学院 李全龙 Network Application Development Server Software Design 32 Other Markup Languages „ Extensible Markup Language (XML) does not specify layout „ Tag names can be created as needed „ Example for a corporate phone book: 哈工大计算机学院 李全龙 Network Application Development Server Software Design 33 Caching in Browsers „ Cache for recently accessed „ HTML pages „ Images „ Item normally fetched from cache „ User can override „ HTTP can verify timestamp before fetching new copy 哈工大计算机学院 李全龙 Network Application Development Server Software Design 34 Types of Web Pages „ Static „ Stored in file „ Unchanging „ Dynamic „ Formed by server „ Created on demand „Output from a program „ Use Common Gateway Interface (CGI) technology 哈工大计算机学院 李全龙 Network Application Development Server Software Design 35 Types of Web Pages (cont) „ Active „ Executed at client „ Consists of a computer program „ Can interact with user „ Use Java technology 哈工大计算机学院 李全龙 Network Application Development Server Software Design 36 Summary of Web Document Types Web documents can be grouped into three categories depending on when the information in the document changes. The information in a static document remains unchanged until the author revises the document. The information in a dynamic document can change whenever a server receives a request for the document. Information displayed by an active document can change after the document has been loaded into a browser

Http Http Overview httpUnderlyingprotocolofthe Transaction oriented client/server rotocol World wide Web Usually between Web browser(client)and transmitting information with efficiency necessary for hypertext a Uses TcP connections a Stateless Can transfer plain text, hypertext Each new TCP connection ction audio, images, and Internet accessible Terminate connection when transaction information Key Terms Examples of Http Operation CcE s Origin server 里一一二国 User age Intermediate Http Systems P 0×y A proxy acts on behalf other clients and presents requests from other 皇题 clients to a server Two scenarios need use proxy: Differentversionsofhttp xy is a forwarding

7 哈工大计算机学院 李全龙 Network Application Development Server Software Design 37 HTTP „ http: Underlying protocol of the World Wide Web „ transmitting information with efficiency necessary for hypertext jumps „ Can transfer plain text, hypertext, audio, images, and Internet accessible information 哈工大计算机学院 李全龙 Network Application Development Server Software Design 38 HTTP Overview „ Transaction oriented client/server protocol „ Usually between Web browser (client) and Web server „ Uses TCP connections „ Stateless „ Each transaction treated independently „ Each new TCP connection for each transaction „ Terminate connection when transaction complete 哈工大计算机学院 李全龙 Network Application Development Server Software Design 39 Key Terms „ Cache „ Client „ Connection „ Entity „ Gateway „ Message „ Origin server „ Proxy „ Resource „ Server „ Tunnel „ User agent 哈工大计算机学院 李全龙 Network Application Development Server Software Design 40 Examples of HTTP Operation 哈工大计算机学院 李全龙 Network Application Development Server Software Design 41 Intermediate HTTP Systems 哈工大计算机学院 李全龙 Network Application Development Server Software Design 42 Proxy „ A proxy acts on behalf other clients and presents requests from other clients to a server „ Two scenarios need use proxy: „ Security intermediary „ Different versions of HTTP „ A proxy is a forwarding agent

Gateway Tunnel A gateway is a server that appears to Tunnel performs no operation on the client as if it were an origin Http requests and responses A tunnel is simply a relay point It acts on behalf of other servers between two TCp connections that may not be able to communicate directly with a client Http messages pass the tunnel WiThout any changes a Two scenarios need use gateway Security intermediary .Non-httpservers Http Messages Http Message stRucture Request Request Line Request Header or Response Response lin Entity Hender General header Request header Entity Body General Header Fields Request Methods Cache control Request-line= Method Request_url htTp-versIon a Connection Methods: a Date Forwarded Keep alive MIME version Pragma rade Extersion-method 8

8 哈工大计算机学院 李全龙 Network Application Development Server Software Design 43 Gateway „ A gateway is a server that appears to the client as if it were an origin server. „ It acts on behalf of other servers that may not be able to communicate directly with a client. „ Two scenarios need use gateway: „ Security intermediary „ Non-HTTP servers 哈工大计算机学院 李全龙 Network Application Development Server Software Design 44 Tunnel „ Tunnel performs no operation on HTTP requests and responses. „ A tunnel is simply a relay point between two TCP connections. „ HTTP messages pass the tunnel without any changes. „ Use? 哈工大计算机学院 李全龙 Network Application Development Server Software Design 45 HTTP Messages „ Requests „ Client to server „ Responses „ Server to client „ Request line „ Response line „ General header „ Request header „ Response header „ Entity header „ Entity body 哈工大计算机学院 李全龙 Network Application Development Server Software Design 46 HTTP Message Structure 哈工大计算机学院 李全龙 Network Application Development Server Software Design 47 General Header Fields „ Cache control „ Connection „ Date „ Forwarded „ Keep alive „ MIME version „ Pragma „ Upgrade 哈工大计算机学院 李全龙 Network Application Development Server Software Design 48 Request Methods „ Request-Line = Method Request_URL HTTP-Version „ Methods: „ Options „ Get „ Head „ Post „ Put „ Patch „ Copy „ Move „ Delete „ Link „ Unlink „ Trace „ Wrapped „ Extension-method

Request Header Field Response Messages status line followed by one or more general, response and entity headers, Authorization followed by optional entity bo a If modified since aStatus-line=http-version Status-Code Reason-Phrase Status Codes Response Header Fields Informational a Location a Successful Proxy authentication Redirection a Client error Retry after a Server error a Server WWw-Authenticate Entity Header Field Entity Body Arbitrary sequence of octets Content encoding Last modified Http transfers any type of data including Content language. Link Content length Title audio n Content MD5 Transfer encode a Content range a Content type a Extension header Interpretation of data determined by a Content versio header field a Derived from Content encoding, content type, transfer

9 哈工大计算机学院 李全龙 Network Application Development Server Software Design 49 Request Header Field „ Accept „ Accept charset „ Accept encoding „ Accept language „ Authorization „ From „ Host „ If modified since „ Proxy authentication „ Range „ Referrer „ Unless „ User agent 哈工大计算机学院 李全龙 Network Application Development Server Software Design 50 Response Messages „ Status line followed by one or more general, response and entity headers, followed by optional entity body „ Status-Line = HTTP-Version Status-Code Reason-Phrase 哈工大计算机学院 李全龙 Network Application Development Server Software Design 51 Status Codes „ Informational „ Successful „ Redirection „ Client error „ Server error 哈工大计算机学院 李全龙 Network Application Development Server Software Design 52 Response Header Fields „ Location „ Proxy authentication „ Public „ Retry after „ Server „ WWW-Authenticate 哈工大计算机学院 李全龙 Network Application Development Server Software Design 53 Entity Header Fields „ Allow „ Content encoding „ Content language „ Content length „ Content MD5* „ Content range* „ Content type „ Content version „ Derived from „ Expires „ Last modified „ Link „ Title „ Transfer encoding „ URL header „ Extension header 哈工大计算机学院 李全龙 Network Application Development Server Software Design 54 Entity Body „ Arbitrary sequence of octets „ HTTP transfers any type of data including: „ text „ binary data „ audio „ images „ video „ Interpretation of data determined by header fields „ Content encoding, content type, transfer encoding

Client-side programming can download program with Web page, execute on client machine Web Programing a JavaScript ape in 1995 9e for Web pages, developed by a C++/Java-like syntax, so familiar to programmers, good for adding dyramic features to Web page. ontrolling forms and GUI Continuously Changing Information Server Push Technology Needed for Client forms connection Animations Server sends updates repeatedly Rapid updates(e.g, stock pr Achieved with two mechanisms Active document Active Document Technology Active Document Representation a server Desire Sends computer program to client Platform independence Client Efficient execution Runs program locally High-speed data transmission m Program binding Controls display Compact representation .Interpretive execution

10 哈工大计算机学院 李全龙 Network Application Development Server Software Design 55 Web Programing 哈工大计算机学院 李全龙 Network Application Development Server Software Design 56 Client-side programming „ JavaScript „ a scripting language for Web pages, developed by Netscape in 1995 „ uses a C++/Java-like syntax, so familiar to programmers, but simpler „ good for adding dynamic features to Web page, controlling forms and GUI „ Java applets ƒ can define small, special-purpose programs in Java called applets ƒ provides full expressive power of Java (but more overhead) ƒ good for more complex tasks or data heavy tasks, such as graphics can download program with Web page, execute on client machine ƒ simple, generic, but insecure 哈工大计算机学院 李全龙 Network Application Development Server Software Design 57 Continuously Changing Information „ Needed for „ Animations „ Rapid updates (e.g., stock prices) „ Achieved with two mechanisms „ Server push „ Active document 哈工大计算机学院 李全龙 Network Application Development Server Software Design 58 Server Push Technology „ Client forms connection „ Server sends updates repeatedly „ Impractical 哈工大计算机学院 李全龙 Network Application Development Server Software Design 59 Active Document Technology „ Server „ Sends computer program to client „ Client „ Runs program locally „ Program „ Controls display „ Interacts with user 哈工大计算机学院 李全龙 Network Application Development Server Software Design 60 Active Document Representation „ Desire „ Platform independence „ Efficient execution „High-speed data transmission „ Late binding „ Consequence „ Compact representation „ Interpretive execution