1. Getting Started

What We Will Cover 1.0: Course Information Introductions: Name, why taking this course, claim to fame Contact Information Course Web Pages Syllabus Schedule Project Class Expectations College Regulations Call Roll Using WebCT Lab Exercise 1.0: Course Questions Add Slips 1.1: Networking and Client/Server Basics 1.1.1: Packets and the Internet Protocol 1.1.2: Sending Packets 1.1.3: Resolving an Address 1.1.4: URLs 1.1.5: How the Web Works 1.1.6: Browser Plug-ins Lab Exercise 1.1 1.2: Electronic Publishing 1.2.1: ASCII Text Files 1.2.2: Binary Files 1.2.3: Images 1.2.4: Audio 1.2.5: MIME Types Lab Exercise 1.2 1.3: HTTP Overview 1.3.1: HTTP Transactions 1.3.2: Request Methods 1.3.3: Server Responses 1.3.4: HTTP Headers Lab Exercise 1.3 1.4: Other Web-Related Servers 1.4.1: Proxy Servers 1.4.2: Streaming Audio and Video 1.4.3: FTP 1.4.4: Databases 1.4.5: SSL Lab Exercise 1.4 Wrap Up Assignments Due By Next Meeting: Nothing Lab Exercise 1.0 Instructions Use the next 10 minutes to complete the following. Join a group of 2-4 people and prepare an answer to one of the following questions. Select one member from your group as a representative to describe your answer to the class. Exercise Questions What is your biggest worry about taking this course? Why? What do you love most about the Web? Why? What skill do you need most in order to succeed in this course? Why? back to top 1.1: Networking and Client/Server Basics Objectives At the end of the lesson the student will be able to: Discuss how the Internet works Discuss Client/Server Concepts Describe Basic Functionality of Web Servers and Browsers First chapter of the textbook available electronically: What is a Web Server? back to top 1.1.1: Packets and the Internet Protocol Networking is about moving data bits from one point to another Internet Protocol (IP) is used to move data in packets Data is bundled into a packet and more bits are added to tell the packet where to go A packet has a limit on its size Applications break up large data and send it in successive packets Every computer connected to the Internet has an address IP uses this address to route packets through the many possible pathways of the Internet What's My IP Address? Can determine the address of your computer on the Internet On Linux/UNIX, run the ifconfig program Open a command prompt (e.g. Terminal Emulation in Linux) Make sure you are the super user su -l root Type ifconfig at the command prompt On Windows, run the ipconfig program From the Start menu, select Run Type in command for Win98/ME or cmd for NT/2000/XP At the command prompt, type ipconfig back to top 1.1.2: Sending Packets Two common ways to move packets over the Internet are UDP and TCP UDP Packets can be sent across the Internet using the User Datagram Protocol (UDP) UDP relies on IP for addressing and routing UDP is like mailing packets from the post office IP is what the mail carrier does to route and deliver the packet When we send several packets of postal mail to the same address, we do not know the order in which they arrive It is even possible to lose a packet entirely The same is true for UDP -- packets arrive in any order and can be lost TCP When we need to guarantee reliable delivery, we can use the Transmission Control Protocol (TCP) TCP uses IP for routing and delivery, just like UDP does However, using TCP is more like making a phone call than sending mail Once a connection is established with TCP, the pathway is held open until all the data is sent The receiving computer verifies receipt by sending messages back to the sender Any lost data is resent until all the packets are received The receiver then puts the packets in the correct order Tracing Packets Packets are moved over a network by special purpose computers know as routers Every IP packet goes to a nearby router. This router in turn moves the packet to another router closer to the destination This process continues until the packet finally reaches the router serving the destination computer Final router then sends the packet to the destination computer Can examine a packets movement over the Internet On Linux/UNIX, run the traceroute program Open a command prompt (e.g. Terminal Emulation in Linux) Make sure you are the super user su -l root Type traceroute at the command prompt On Windows, run the tracert program From the Start menu, select Run Type in command for Win9X/ME or cmd for WinNT/2000/XP At the command prompt, type tracert and a destination For example: C:\> tracert java.sun.com Tracing route to java.sun.com [192.18.97.71] over a maximum of 30 hops: 1 <10 ms 1 ms <10 ms rocky.cabrillo.cc.ca.us [172.16.1.1] 2 1 ms 1 ms 2 ms seahawk.cabrillo.cc.ca.us [207.62.185.33] 3 2 ms 2 ms 2 ms 207.62.184.1 ... 16 38 ms 38 ms 38 ms java.sun.com [192.18.97.71] Trace complete. This shows it took 16 "hops" for packets to travel from my PC to Sun's Java Web site The program sends three test packets to successive routers Measures the time it took for a round trip to each one This listing shows a total travel time of about 38 milliseconds (ms) back to top 1.1.3: Resolving an Address IP Address is like a telephone number Port number is like a telephone extension Together they connect you to a unique destination When a client sends a request, it usually uses a name for the address Domain Name Server (DNS) is used to resolve the name to an IP address Usually one DNS per subnet, campus or company Client application is expected to know the port Common port numbers include the following: Service Port Number FTP 20, 21 Telnet 23 SMTP (e-mail) 25 HTTP 80 More information on common port numbers available here The Story of Ping Ping is used to test whether of not a networked machine is reachable: C:\>ping www.cabrillo.cc.ca.us Pinging rocky.cabrillo.cc.ca.us ...: Reply from 172.16.1.1: bytes=32 time=1ms TTL=255 Reply from 172.16.1.1: bytes=32 time<10ms TTL=255 Reply from 172.16.1.1: bytes=32 time<10ms TTL=255 Reply from 172.16.1.1: bytes=32 time<10ms TTL=255 Ping statistics for 172.16.1.1: Packets: Sent = 4, Received = 4, Lost = 0 (0% loss), Approximate round trip times in milli-seconds: Minimum = 0ms, Maximum = 1ms, Average = 0ms Scroll down the page and read the Customer Comments on The Story About Ping back to top 1.1.4: URLs Uniform Resource Locator (URL): a standard way of specifying an address on the Internet. URLs consist of two main parts separated by a colon Part before the first colon specifies the access scheme or protocol Part after the colon is interpreted according to the access scheme Usually, two slashes after the colon (//) introduce a hostname Hostnames usually end in a top-level domain name, such as .com Hostnames can be followed by a colon and a port number, for example: http://java.sun.com:80/ Usually a port number is omitted and the standard port number is used After the hostname comes the pathname Usually related to the pathname of a file on the server back to top 1.1.5: How the Web Works Brief History 1969: Internet started by US DOD with 4 computers -- called ARPANET 1983: Internet (1000 computers) split into two parts -- military and University 1987: High-speed backbone added to solve performance issues (10K computers) 1989: World-Wide Web and HTML invented by Tim Berners-Lee at CERN 1992-3: US Government decides to commercialize Internet 1993: first graphical browser invented by Marc Andreessen Student at the University of Illinois World-Wide Web Architecture Web has four major components: Web client (e.g. browser): requester of documents and services Web server: provider of services e.g. Web documents Internet: very large network to move the data Files: text, images, sound, video, etc. Communication between client and server uses Hypertext Transmission Protocol (HTTP) A protocol is set of rules that client and server follow to communicate Documents are located by entering the address of their Uniform Resource Locator (URL) Browser uses Hypertext Markup Language (HTML) to format a page Client/server Interaction User enters query (URL) into client (browser) Client connects to server and sends query Server analyzes query, computes results and respond with information Client receives results and displays them to user Benefits of Client/Server Model Many clients can access the same data Clients can be dispersed geographically Clients receive the most recent information Technology used to provide data can change with affecting clients Maintenance of information is easier when it is all in one place back to top 1.1.6: Browser Plug-ins Web servers provide documents to clients Modern Web servers can supply many types of documents Documents can be created dynamically using databases and other tools (see CIS 154/165) Browsers retrieve and display information from a Web server usually using HTTP Plug-in allows browsers to display other document types What are some examples of these plug-ins? Most plug-ins use HTTP to transfer data Some plug-ins, such as RealPlayer, use their own protocol. Why? Helper Applications Helper applications are similar to plug-ins Allow you to view content your browser cannot Difference is they are standalone applications Can helper applications be used to embed content in Web pages? back to top Lab Exercise 1.1 Instructions: Use the next 10 minutes to complete the following. Start a text file named exercise1.txt Will be adding to this file during the lesson -- save it in My Documents folder. Prepare the exercise header as described in the HowTo on submitting exercises Label this exercise: Lab 1.1 Answer the following questions. Exercise Questions What are the benefits of using a client/server model? Give an example of another type of client/server application How does a host's name get translated into an address? Find out the IP address of a host (try www.edparrish.com) What is the primary function of an HTTP server? Who developed the first Web server? What other early Web servers were developed? What is the primary function of a Web browser? back to top 1.2: Electronic Publishing Objectives At the end of the lesson the student will be able to: Describe the Basics of Creating Hypertext Documents Describe the Difference between ASCII and Binary Files Give Examples of MIME Types Purpose of this course is to learn how to deliver content To deliver content, should know technical aspects of electronic documents Key aspect of Web is support of hyperlinks (or links) Server is involved in processing hyperlinks HTML documents can also contain images, sounds, animations, and video To process these documents, use both ASCII text files and binary files ASCII files can be HTML or plain text or some other simple format Most other files are binary back to top 1.2.1: ASCII Text Files HTML document is just an ASCII text file Letters, numbers, and other characters represented by numerical values from 0 to 127 Each byte of the file represents a specific character Letter A is represented by the number 65, letter B by 66, etc For more on ASCII characters, click here ASCII text viewable in most editors including Notepad How can you view the HTML of a web page? back to top 1.2.2: Binary Files Binary file generally does not contain plain text Any image or sound application uses binary files What are some examples of binary files? Do word processors create binary or text files? Why? back to top 1.2.3: Images Many different formats for images, but browsers only support a few Most formats use compression to reduce the size of the file. Why? Some common image formats shown below: GIF JPEG PNG 256 colors (8-bit) 16 million colors (24-bit) 16 million colors (24-bit) Lossless compression Lossy compression Lossless compression transparency No transparency Transparency and opacity Can be animated No animation. See MPEG No animation. See MNG back to top 1.2.4: Audio Most browsers can play sound files Audio files can be set to play automatically or when clicked Many sound formats used on the Web including .au/uLaw/MuLaw Originated on Sun workstations (UNIX). Still one of the most common formats. .aiff Audio Interchange File Format, originating on the Macintosh. .mp3 The most popular file format on the Web for distributing CD-quality music. A 1 Mb file is equal to about one minute of music. .ra A proprietary streaming audio format called RealAudio. Developed by RealNetworks, RealAudio allows you to play sound files in real-time. This type of file requires the RealPlayer, available for both Macintosh and Windows. .wav The native sound format for Windows, starting with Windows 3.0. back to top 1.2.5: MIME Types MIME: Multipurpose Internet Mail Extensions Originally designed for sending attachments in e-mail Incorporated into HTTP to describe format of file Web server looks up MIME type based on file extension Table usually kept in text file named MIME.types Server sends MIME type with the file to browser Currently 7 main MIME types: application audio image message model multipart text video Each main types has subtype that further describe data Some common examples: text/html text/plain image/gif image/jpeg For more information on MIME types, click here or here For a list of MIME types click here back to top Lab Exercise 1.2 Instructions: Use the next 10 minutes to complete the following. Label this exercise: Lab 1.2 Do not submit exercises until all of them from today's lesson are finished Answer the following questions. Exercise Questions Use a text editor such as Notepad (not a word processor or publishing program) to create a simple HTML document with a hyperlink to the Cabrillo Web site (http://www.cabrillo.cc.ca.us/). What happens when you view your page in a browser? Click on the hyperlink; it should display the Cabrillo welcome page. View the source of the document. What do you see? Find an image on the Cabrillo home page. Can you determine what type of image it is? How? View the image by itself, then view the source of the image in the browser as you did with an HTML file. What do you see? View any Web page from a browser. How can you determine what the MIME type of the document is? How are MIME types used when requesting or receiving documents on the Web? back to top 1.3: HTTP Overview Objectives At the end of the lesson the student will be able to: Identify the Parts of an HTTP Transaction Identify HTTP Request Methods Identify HTTP Headers and Server Responses back to top 1.3.1: HTTP Transactions HTTP allows Web browsers to talk to servers and exchange information Any browser can talk to any server conforming to HTTP specifications HTTP expects the client to initiate a request and the server to respond Each request and response has three parts: request or status line header fields entity body Example Request Typing a URL into the browser address initiates an HTTP request to a Web server with the following sections: Request line: contains request method, document location and protocol version Header section: series of HTTP headers that are used to pass other information about client and request to the server followed by a blank line Entity body: contains other data to be passed to the server -- usually information here only when a form is submitted Typing http://www.cabrillo.cc.ca.us/~eparrish/simple.html into the address bar would cause the browser to issue an HTTP request similar to the following: GET /~eparrish/simple.html HTTP/1.1 Accept: image/gif, image/x-xbitmap, image/jpeg, */* Accept-Language: en-us User-Agent: Mozilla/4.0 (compatible; MSIE 5.01; Windows NT) Host: www.cabrillo.cc.ca.us Connection: Keep-Alive The lines of the HTTP request contain: Request line with three parts: Request method of type GET Document located at /~eparrish/simple.html Protocol of HTTP/1.1 What types of documents (MIME types) are accepted by browser Declaration that the preferred language of the browser is U.S. English Can specify more than one language Server can make selection if it has documents in multiple languages Client identifies itself as Mozilla version 4.0 In parenthesis, browsers declares it is really Internet Explorer version 5.01 running on Windows NT Tells the server what the client thinks is the server's host name Header is mandatory in HTTP 1.1, optional in HTTP 1.0 Server may have many host names (virtual hosts) Client can specify which host name is desired Different host names can have different document trees Tells the server to keep the TCP connection open until explicitly told to disconnect HTTP 1.1 default server behavior is to keep the connection open HTTP 1.0 default server behavior is to close connection after request Note that there is no entity body in this request. Example Response Server responds in similar fashion with: Status line: contains protocol version, status code and reason phrase Header section: Series of lines containing HTTP headers that pass information about server and response, followed by a blank line Entity body: contains the document (or object) requested, if present For the previous request, the server could respond with: HTTP/1.1 200 OK Date: Thu, 24 Jan 2002 20:03:27 GMT Server: Apache/1.3.3 (Unix) Last-Modified: Thu, 24 Jan 2002 19:56:49 GMT ETag: "763a6-29-3c506701" Accept-Ranges: bytes Content-Length: 37 Connection: close Content-Type: text/html <HTML>This is a simple page.</HTML> The lines of the server response contain: Status line with three parts: Protocol version of HTTP/1.1 Status code of 200, which means document has been found and server will transmit the document in its response Reason phrase of OK Current date and time on the server in Greenwich Mean Time (GMT) Kind of software the server is running: in this case Apache/1.3.3 on Unix Most recent modification time of the document requested by client Entity tag that provides browser with a unique identifier for this server resource -- used for caching Indicator that server can return subsections of a document -- useful in database and streaming multimedia applications How many bytes are in the entity body that follow the headers Indicates connection will close after server's response -- client must open another connection to send another request MIMI type of content included in response Blank line to indicate end of header section Entity body that contains the document displayed to the user More Information Standard HTTP 1.1 header field definitions available here Can view the HTTP headers sent by your browser by clicking here Can use HTTP Header Viewer or Rex Swain's HTTP Viewer to examine HTTP headers returned by servers back to top 1.3.2: Request Methods Request line of a client request contains an HTTP request method Server uses request method to determine what to do with the request HTTP/1.0 allows an open-ended set of methods to indicate the purpose of a request HTTP/1.1, while still open ended, defines several methods including the most used methods discussed below For more information on HTTP/1.1 requests, click here Note that methods are cAsE sEnSiTiVe GET Method Used to retrieve information from the server Nothing is passed to server in the entity body -- Why? Even without passing data in the entity body, programs can send information to the server using GET. How? HEAD Method HEAD method is identical to the GET method except no document is returned Used to return information about a document rather than the document What are possible uses for HEAD method? Which method is faster: GET or HEAD? POST Method POST method sends information from client to server Often used with HTML forms for data input back to top 1.3.3: Server Responses HTTP server attempts to process requests received If something wrong with requests, server generates error messages Success or error, status code generated on response line Status code is 3 digits long organized into 5 categories 1xx: Informational - Request received, continuing process 2xx: Success - Request successfully received, understood, and accepted 3xx: Redirection - Further action must be taken in order to complete the request 4xx: Client Error - Request contains bad syntax or cannot be fulfilled 5xx: Server Error - Server failed to fulfill an apparently valid request More information on server responses for HTTP 1.1 available here back to top Lab Exercise 1.3 Instructions: Use the next 10 minutes to complete the following. Label this exercise: Lab 1.3 Do not submit exercises until all of them from today's lesson are finished Answer the following questions. Exercise Questions What are the three parts of every HTTP transaction? Name the three most widely used request methods. What is the difference between a GET and a POST method? What header is sent by the client to identify and give information about the browser? What header is sent by the server so that the browser can determine what type of content is being returned? What header is sent by the server to identify the server software? Use either HTTP Header Viewer or Rex Swain's HTTP Viewer to examine HTTP headers returned by the server at a location of your choice on the Internet. List each line and describe the meaning of each line in a sentence. back to top 1.4: Other Web-Related Servers Objectives At the end of the lesson the student will be able to: Describe the Functionality of Proxy Servers Identify Other Services That May Run Alongside an HTTP Server Web servers using HTTP is most server common on Internet Still other servers we need to know about back to top 1.4.1: Proxy Servers Proxy servers are intermediaries between browsers and servers Browsers configured to use proxy servers allows the proxy server to handle request and responses Browser sends requests to proxy server, which forward it to destination server Responses are also routed through proxy server before being received by browser Important use of proxy servers was caching, but caching is now part of most web servers (1) (2) Another important use of proxy servers is for firewalls, but firewalls also becoming part of servers and routers Proxy servers still important for many uses in caching, security and filtering: Anonymizer.com: Internet privacy back to top 1.4.2: Streaming Audio and Video Browsers must download entire files before displaying audio or video Downloading can take a long time One solution is to stream media -- play as it downloads HTTP does not support streaming media -- must use different server Browser must use a plug-in to display streaming format Plug-in will connect to server at specified port and request file Most players use User Datagram Protocol (UDP) rather than TCP/IP UDP provides greater speed but very few error recovery services Error recovery not usually of concern for streaming media -- loss appears as pops or clicks in audio or "snow" in video Three major streaming media formats: RealSystem Windows Media Quicktime Can compare samples of these formats by clicking here back to top 1.4.3: FTP File Transfer Protocol (FTP) used to transfer files between computers on a network Common to have FTP server running with HTTP Most popular browsers support FTP -- for IE instructions click here back to top 1.4.4: Databases Useful tool for storing, organizing and manipulating data Most dynamic web content supported by databases Web-database architectures usually consists of three or more tiers Client Tier Browser runs on client machine Can run Applets or other special applications through browser Middle Tier Web server responds to user requests with HTML pages HTML pages generated from static text files or created dynamically by application software More applications being connected to servers to provide more services (email, chat, catalogs, shopping carts, money transfer) Application software includes programming environments that can connect to databases: ASP, Cold Fusion, JSP/J2EE, PHP Database Tier Databases can run on same machine as Web server or on separate machine Many popular database systems used in e-commerce: Microsoft Access: quite usable for web sites with low volumes -- 100+ simultaneous users if implemented carefully Microsoft SQL Server: useful for creating high-transaction databases for busy eCommerce sites MySQL: becoming popular due to speed, compactness and low cost. Oracle: most popular for large organizations due to its extensive capabilities and reliable reputation. Almost any database system can be used on the web because of: ODBC (Open DataBase Connectivity): open standard for accessing databases using SQL SQL (Structured Query Language): "industry-standard" language for creating, updating and querying relational DBMS's back to top 1.4.5: SSL HTTP traffic transmitted in clear text -- anyone can read it Most common way to secure Internet transmissions is using Secure Sockets Layer (SSL) SSL provides following for TCP/IP (Internet) connection: Data encryption Server authentication Message integrity Client authentication (optional) SSL comes in two strengths: 40-bit and 128-bit Longer key makes breaking encryption more difficult To implement, must obtain server certificates (see here) Must install certificates and identify pages to server needing secure channels (see text page 207-213) To invoke secure channels, must use https https://some_url/page.html Most commercial web enterprises run secure servers alongside http daemon Will cover this technology in later classes back to top Lab Exercise 1.4 Instructions: Use the next 10 minutes to complete the following. Label this exercise: Lab 1.4 Do not submit exercises until all of them from today's lesson are finished Answer the following questions. Exercise Questions What are the benefits of a caching proxy server? How is a proxy used to filter content? Explain what happens when a URL is requested by a browser that is configured to use a proxy. Why is a streaming audio server useful if you want to deliver audio content? Why is an FTP server useful on a machine running a Web server? back to top Wrap Up When class is over, please shut down your computer => Logout => Shut Down Due Next Class: Nothing You may complete unfinished exercises at the end of the class or at any time before the next class. Be sure to submit the file to the instructor before the beginning of the next class to receive credit. Instructions on submitting exercises are available from the HowTo's page. back to top Home | WebCT | Announcements | Schedule | Expectations | Syllabus | Help | FAQ's | HowTo's | Links Last Updated: 7/16/2003 4:45:33 PM