Survey
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
* Your assessment is very important for improving the workof artificial intelligence, which forms the content of this project
COS 125 DAY 5 Agenda Questions from last Class?? Assignment #2 posted We will discuss later in class Quiz #1 on Feb 3, 20 M/C, 4 Short essays, One extra Credit Chap 1-28 Today’s Topic Using the World Wide Web How Web Pages Work Pages “live” on the World Wide Web Connected to each other using Hypertext Pages are written in HTML Works on Client/server model Web Site Structure First page is called the Home Page Other pages are organized in one of three possible types Tree Linear random Tree structure Home page page page page page page page page page page page page page Linear Structure Home Page Page Page Page Page Page Random Structure Home Page Page Page Page Page Page Page Page Page How Web Browsers Work Web Browsers interpret and display web pages HTML DHTML XML Scripts Applications and programs Helper apps Plug-ins Web Browsers Two most popular and competitive browsers Internet Explorer Netscape Navigator Both have very similar features New entries Firefox Opera Web Codes Successful Transactions Redirection Transactions 200 The request was fulfilled. 201 The POST request was completed successfully. 202 Request accepted for processing of unknown type. Rare. 203 Request partially fulfilled. 301 The requested resource has been permanently moved to a new URL. Usually accompanied by Location: newURL which automatically connects to the new URL. 302 Requested resource found, but at a different URL. You'll get a 302 Redirection if you omit the trailing slash when pointing at a directory (sometimes called a malformed request). 304 Unmodified data not returned in response to a GET request with the If-Modified-Since field. Occurs when a browser requests data found in cache. Error Messages 400 Error in request syntax. 401 Request requires an Authorization: field, and the client did not provide one. This response is accompanied by a list of acceptable authorization schemes use WWW-Authenticate response headers. Error 401 can be part of a client/server dialogue to negotiate encryption and user authentication schemes. 402 The requested operation costs money, and the client did not specify a valid Chargeto field. 403 Request for forbidden resource denied. 404 Requested resource not found. 500 The server has encountered an internal error and cannot continue processing your request. 501 Request okay but denied because server doesn't support transaction method. How Markup Languages Work Markup languages contain two things Content Instructions on how to format content (tags) Markup languages are NOT programming languages 3 types of markup languages exist on the WWW HTML and xHTML DHTML XML HTML and xHTML Uses <tags>content</tags> Latest version is HTML 4.01 Full specification available at http://www.w3.org/TR/html4/ HTML can be written with any text editor but specialized HTML editors have been developed We will be using Macromedia Dreamweaver 2004 in this class Example HTMLs Block Level Tags Text Formatting Using Images Tables Frames DHTML DHTML is Dynamic HTML Allows changes to the HTML “on the fly” Great for animation and special effects Uses 3 Technologies Document Object Model (DOM) Cascading Style Sheets (CSS) tracks every object and element on a web pages Formatting and style information for a web pages Client-Side Scripting Provide access to DOM and CSS to change them Example DHTML Lots of examples available on the web W3Schools.com JavaScript Workshop http://www.w3schools.com/dhtml/dhtml_examples.asp http://www.jsworkshop.com/dhtmlexamples.html Game written by COS 381 students http://perleybrook.umfk.maine.edu/classes/cos381/jumble 1.htm How XML works Allows the creation of new markup languages Make your own tags that have special meaning for a group of people There is no presentation information in an XML document Example XML http://perleybrook.umfk.maine.edu/examples/planes.xml How XML works XML languages are defined in Data Type Definitions Schemas http://perleybrook.umfk.maine.edu/examples/planes.dtd http://perleybrook.umfk.maine.edu/examples/planes.xsd XML pages are formatted with CSS http://perleybrook.umfk.maine.edu/examples/planescss.xml http://perleybrook.umfk.maine.edu/examples/planes.css XLST http://perleybrook.umfk.maine.edu/examples/xslplanes.xml http://perleybrook.umfk.maine.edu/examples/xslplanes.xsl How XML works DTD Document Type Definations XML Schemas XML Document XSLT Style Sheets CSS Browser Display Future of XML XML is the lingua franca for Net Services, Microsoft’s .NET, Oracle, and many other Internet based distributed architectures. All of HTML can be done in XML and has been in xHTML XML resources www.xml.com www.xml.org http://www.w3.org/XML/ Hypertext How Hypertext works Hypertext is text which is not constrained to be linear. Hypertext is text which contains links to other texts. HyperMedia is a term used for hypertext which is not constrained to be text: it can include graphics, video and sound , for example. Hypertext and HyperMedia are concepts, not products. Hypertext works with hyperlinks Word, Icon or Graphic Hypertext is embedded in WebPages using HTML Examples of embedded hyperlinks Short History of Hypertext From the book Multimedia and Hypertext: The Internet and Beyond 1945 Vannevar Bush proposes Memex 1965 Ted Nelson coins the word "hypertext“ 1967 The Hypertext Editing System and FRESS, Brown University, Andy van Dam 1968 Doug Engelbart demo of NLS system at FJCC 1975 ZOG (now KMS): CMU 1978 Aspen Movie Map, first hypermedia videodisk, Andy Lippman, MIT Architecture Machine Group (now Media Lab) 1984 Filevision from Telos; limited hypermedia database widely available for the Macintosh 1985 Symbolics Document Examiner, Janet Walker 1985 Intermedia, Brown University, Norman Meyrowitz 1986 OWL introduces Guide, first widely available hypertext 1987 Apple introduces HyperCard, Bill Atkinson 1987 Hypertext'87 first major conference on hypertext 1991 World Wide Web at CERN becomes first global hypertext, Tim Berners-Lee 1992 New York Times Book Review cover story on hypertext fiction 1993 Mosaic anointed Internet killer app, National Center for Supercomputing Applications 1993 A Hard Day's Night becomes the first full-length feature film in hypermedia 1993 Hypermedia encyclopedias sell more copies than print encyclopedias How URLs work A URL is a unique identifier for a resource on the WWW Like a address Example http://perleybrook.umfk.maine.edu/logo/logo_files/frame.htm Means go to the server perleybrook.umfk.maine.edu and get the hypertext file “frame.htm” that is in the “logo/logo_files” directory using the protocol “http” Image Maps An Image map is an image with regions that link to different destinations Two types Client Side Image Maps Faster Most common Users can see the HTML that creates the map and the possible destinations Server Side Image Maps Require a special program (CGI) running on the server Requires programming skills Hides the destinations from “View Source” Creating an Image Map First divide the image into regions Circles Rectangles Center and radius Top Left X and Y and Bottom right X and Y Polygons X and Y for each vertex of the Polygon Finding regions Link to www.bluesky.com Link to www.montana.com Link to www.harleydavidson.com What is a form? A form is a way to actively collect or display information to or from a web site to a user What can you do with forms? Get feedback Have a guestbook Take a survey See who’s visiting you Sell stuff And much more! Form example http://perleybrook.umfk.maine.edu/samples/Black Jack.htm Form Example What is a form? Two basic parts Structure or shell Fields Labels Buttons Graphic User Interface (GUI) components Scripts to process information collected CGI JavaScript ASP About CGI Scripts A script is a program written in a scripting language Perl VBscript JavaScript Script runs on Web Server through a Interface Requires Web Server administrator Common Gateway Interface CGI ASP engine .NET framework JavaScript interpreter How Web Servers Work The most basic function that a webserver does is to deliver requested files over the network http://www.serverwatch.com/tutorials/article.php/10825_1407961_1 Downloading a Complex Webpage with Two Graphics Files HTML Document Browser Client PC Webserver Application Webserver As Displayed 2 Graphics Files Webpage Consists of Three Files Rendered as a Single Page On-Screen Downloading a Complex Webpage with Two Graphics Files HTML Document HTML Document Browser Client PC As Displayed Webserver Application 2 Graphics Files Webserver Download Requires 3 HTTP Request-Response Cycles; Downloads HTML Page First It has Tags to Identify Other Files Downloading a Complex Webpage with Two Graphics Files Browser Client PC As Displayed Webserver Application 2 Graphics Files Webserver Based on Tags in HTML Document, Browser Requests Downloads of Remaining Graphics or Other Files Browser Renders Combined Webpage on Screen Downloading a Complex Webpage with Two Graphics Files Quiz: Your browser downloads a webpage with three graphics images, a sound sequence, and a Java applet. How many files will your browser have to download? How Web Servers Works Web Servers may also run special program called CGI applications CGI applications are often used to process data from forms How web servers work In order to increase functionality most web servers also do the following Provide a management interface to manage files, directories and virtual directories Provide a security and authentication mechanism Provide logging Provide statistics How web servers work How Web sites work with databases Most large web sites are actually database driven my.yahoo.com my.msn.com Used for Gathering information from users Displaying information to users Personalization of web pages CGI and Databases Example: http://www.umfk.maine.edu/offices/bio.cfm?recordID=40 3-Tier Architecture Client PC with Browser 1. Form Webserver Application 2. Server Data Mainframe Server of External Company Database Server How .NET and Web Services Work Allows computers on the internet to use applications and services on other computers connected to the internet How it works First you find a service you may need For example Finding Zip Codes Calculating Tax Rates Finding and comparing prices Use UDDI to find the web service and WSDL to figure how it works UDDI --Universal Description, Discovery amd Integration WSDL -- Web Services Description Language Universal Description, Discovery, and Integration (UDDI) Server for Web Services UDDI Functions: Client PC 2. Web Service Interaction 1. UDDI Request for Information, Response UDDI Server Server with Web Service Interaction Between UDDI Servers to Fulfill a Request White Pages By name Yellow Pages By type Green Pages Details of how to use, payment, etc. UDDI Server Web Service Description Language (WSDL) Protocol for asking a corporate webserver about the company’s SOAP-compliant services Client PC WSDL Request-Response Cycle Corporate Webserver How Web Services Work Now that you have found the service and figured out how to use it Send a SOAP (Simple Object Access Protocol) message using XML to interact with the Web Service Example on following slide show a SOAP request for a price of a product Web Service Web Service HTTP Request Client PC SOAPCapable Browser HTTP Response SOAP Message Using XML Syntax Web Service Webserver -Interface Properties Methods Simple SOAP Request and Response Simple Object Access Protocol (SOAP) Carried in HTTP request or response message Formatted using XML Syntax Similar to HTML syntax but the sender and receiver can create new tags that they can then use in transactions, such as <price>$33</price> HTTP Header SOAP Body Simple SOAP Request and Response Situation There is a pricing object that returns the price if another object sends the part number, quantity, and shipping type (rush, etc.) on an interface Objects can be on different computers Request (PartNum, Quantity, ShippingType) Sending Object Pricing Object Response (Price) Simple SOAP Request and Response SOAP Request Message HTTP Request Header pointing to program <?xml version=“1.0”> <BODY> <QuotePrice xmlns=“QuoteInterface”> <PartNum>QA78d</PartNum> <Quantity>47</Quantity> <ShippingType>Rush</ShippingType> </QuotePrice> </BODY> Note: xmlns specifies an XML namespace for the object ..defines a XML schema Figure 11.14: Simple SOAP Request and Response SOAP Response Message HTTP Response Header <?xml version=“1.0”> <BODY> <QuotePrice xmlns=“QuoteInterface”> <Price>$750.33</Price> </QuotePrice> </BODY> Microsoft .NET http://www.microsoft.com/net/basics/whatis.asp Perspective on Web Services Benefits of Web Services Offers a way to standardize interactions between objects over the Internet Can make distributed computing far simpler once Web services standards are fully developed Concerns High overhead (very chatty) Standards immaturity Security is embryonic How Grid Computing Works Using many (>100 and more like 10000) ordinary computers connected together over a network to perform a single task or a series of related tasks Examples Seti@home Beowulf Factoring large numbers Seti@home Largest number ever factored How FTP works Used to transfer files over the Internet Needed Client software Can use Internet Browsers Username/Password FTP site We will be using FTP in this class to place web page assignments on the web server Common practice Ftp using IE 5 In address bar ftp://perleybrook.umfk.maine.edu Login with the same info as you login in to these computers Select the folder with your last name Moving files Drag and drop files Use menu edit copy/paste Click on file and right mouse for context menu Assignment #2 Your first web page! Using Microsoft Word Assignment 2 Microsoft Word Can automatically create web pages Problems “bloat” code Proprietary code Good for quick jobs Bad for anything that has to be maintained over time Microsoft Word as a Web Page Design Tool Select “new” from file menu Select “blank web page” Type out web page Add graphics Save as “Web Page (*htm;*html)” If you use graphics, Word will create a folder with the graphic files http://www.pickens.k12.sc.us/Pickens.ms/word_course .htm COS 125 Web Site http://perleybrook.umfk.maine.edu/classes/cos125/