LAB 1 HOW THE WEB WORKS

Transcription

1 LAB 1 HOW THE WEB WORKS What You Will Learn About IP addresses and Domain Names About some web browser plugins to help with development Examine headers sent by the HTTP protocol How to trace the route that your packets take Approximate Time The walkthroughs in this lab should take approximately 30 minutes to complete. Fundamentals of Web Development with PHP Randy Connolly and Ricardo Hoar Textbook by Pearson

2 2 Lab 1 HOW THE WEB WORKS Exercise 1.1 Y OUR IP ADDRESS 1 Depending on what OS you are using, there are different tools you must use to get your IP address. We will use the most fundamental techniques possible, which are least affected by OS upgrades and user interfaces. I N W INDOWS Open up the command window by either clicking a shortcut, or typing cmd in the run window. You can also access it by holding down the shift key while right clicking within the Windows Explorer, and then selecting the Open Command Window Here option. O N MAC OR L INUX Open up a terminal window, by going into applications and choosing a terminal. Either way a small text window should appear that will take your commands. It may show your computer name or current location depending on the version and configuration. This command window is an essential tools for the web developer. Become familiar with it. 2 In the newly opened command window you will type a simple command and get back information about your IP address. Because most computers have multiple adapters you will get IP information for each installed and configured device. This could be a wired connection, and a wireless connection. Since only 1 is being used at a time, we will look for the information about that at adapter. This output may seem daunting at first, but provides you with esstenial information. I N W INDOWS Into the cmd window type ipconfig The output will include output showing your IP address similar to: Wireless LAN adapter Wireless Network Connection: Connection specific DNS Suffix. : Link local IPv6 Address..... : fe80::fc13:750:ffdd:1337%14 IPv4 Address : Subnet Mask : Default Gateway : O N MAC OR L INUX Into the terminal type: /sbin/ifconfig The output will include output similar to the following.

3 Fundamentals of Web Development 3 WEB DEVELOPMENT en1: flags=8863<up,broadcast,smart,running,simplex,multicast> mtu 1500 ether c8:bc:c8:c2:74:91 inet6 fe80::cabc:c8ff:fec2:7491%en1 prefixlen 64 scopeid 0x5 inet netmask 0xffffff00 broadcast media: autoselect status: active 3 Now you very likley have an internal IP address, unless you connected directly to the internet. IP addresses in the ranges are internal If so, we will have to determine what IP address wea re sharing, since that is the IP we will be known as outside our internal network. The easiest technique is to go to a web server on the internet that is designed to echo your IP address. Surf to and you will see your external IP address. It's important to remember that every time you visit a web page you transmit this external IP address in order to respond to your request with data. Similarly, every visitor to your site sends you their IP. Copyright Randy Connolly and Ricardo Hoar

4 4 Lab 1 Exercise 1.2 A NALYZING COMPONENTS OF A WEB PAGE 1 To do this next walkthrough you must use the Chrome web browser. 2 Surf to the webpage from Exercise 1 (to 3 Right click in the page and choose the Inspect Element menu command. 4 You will now see the Inspect Element panel below the web page. The panel has many tabs. The main Elements panel allows you to examine the markup and CSS for any of the HTML elements in the page. 5 Select the Network tab, and then refresh the page. This will display the different resources that are used by this page. 6 Go to You can now seen the many different resources used by a real world web site. The panel also shows interesting information such as total load times. 7 Close the Inspect Element panel.

5 Fundamentals of Web Development 5 WEB DEVELOPMENT Exercise 1.3 N AME SERVERS 1 There are tools built into linux and mac that allow one to do some internet queries regarding websites, their nameservers and name resolution. In particular tools named nslookup and dig are used in this walkthrough. We will again be using the cmd or terminal window to run these commands. Open such a window 2 To determine the ip address for a domain name type: nslookup google.com or nslookup type=a google.com 3 As output you will see that google.com actually has several answers. That is many ip addresses are ready to answer queries to google.com. Server: Address: #53 Non authoritative answer: Address: Address: Address: Address: Address: Address: Address: Address: Copyright Randy Connolly and Ricardo Hoar

6 6 Lab 1 4 Notice that the first part of the output lists your Server, and likley this is your local DNS resolver. In our case is definitely a local address. While the answers given are likely correct, we want to investigate more deeply and see what google thinks it's IP addresses should be without relying on a cahed answer in our router. To determine the nameservers for google.com we type: nslookup type=ns google.com this returns Non authoritative answer: google.com nameserver = ns1.google.com. google.com nameserver = ns4.google.com. google.com nameserver = ns2.google.com. google.com nameserver = ns3.google.com. 5 Now we can query the official nameservers for google directly and ask what it thinks the IP address for google.com should be. Using the result from the previous query we can type: nslookup google.com ns1.google.com This forces a lookup directly from the authoritative google nameservers, which may be updated from our cache. When we ran the commands we did in fact get different results, but eventually our cache would be updated to reflect these changes: Address: Address: Address: Address: Address: Address: Address: Address: Address: Address: Address:

7 Fundamentals of Web Development 7 WEB DEVELOPMENT 6 Now that you know how to query a nameserver for a IP address and nameserver, you may be interested in knowing that there are other types of DNS records you can query. Of particular interest to a web administrator would be the mail records. That answers where do I send mail to for this domain. For example to see where for google.com is hosted we could query nslookup type=mx google.com ns1.google.com and see the output of Server: ns1.google.com Address: #53 google.com mail exchanger = 20 alt1.aspmx.l.google.com. google.com mail exchanger = 40 alt3.aspmx.l.google.com. google.com mail exchanger = 10 aspmx.l.google.com. google.com mail exchanger = 50 alt4.aspmx.l.google.com. google.com mail exchanger = 30 alt2.aspmx.l.google.com. Copyright Randy Connolly and Ricardo Hoar

8 8 Lab 1 Exercise 1.4 S EEING HTTP HEADERS 1 To do this next walkthrough please use Chrome. 2 Surf to and use the Inspect Element menu command. Click on the Network tab in the panel. 3 To simplify seeing HTML from the other resources, click the Filter button and select the Documents option. 4 You should now see only a few resources, the main one being the HTML page for the site. Click the funwebdev.com name in the first column. This will display an additional set of subtabs. Click on Headers tab to display the HTTP request and response headers.

9 Fundamentals of Web Development 9 WEB DEVELOPMENT 5 From the Request Headers section of the image above you can see that the client machine I surfed from was Mozilla based browser on a Windows machine. What does your User Agent header reveal about you? Other things revealed are what type of encodings my browser can interpret. For example gzip. Does your browser accept compression? There is alot of information in the response headers as well. Can you tell what type of OS the server is running? What type of encoding is the page using? Copyright Randy Connolly and Ricardo Hoar

10 10 Lab 1 Exercise 1.5 T RACING A PACKET 1 This next walkthrough introduces a powerful tool that allows on to trace the route of a packet from your computer to a web host. We will use the command: tracert (For Mac or Linux, you would use the command: traceroute 2 We will now trace the route from your computer to one of the biggest domains on the web, google.com, by typing in the command line: tracert google.com 3 The output from the command will vary based on many factors, but you should see something similar to: tracert to google.com ( ), 30 hops max, 60 byte packets 1 * * * 2 * * * 3 google.com.any2ix.coresite.com ( ) ms ms ms ( ) ms ms ms ( ) ms ms ms 6 lax02s01 in f9.1e100.net ( ) ms ms ms 4 What you are seeing in your output is the path your request took to get to the webserver at google.com. In our case six hops were required to get there, with the first two being hidden from us. Each numbered line of output is a hop on the way to the destination and tells you something about the path of the request. Note: You will definitely get different output than that shown here (unless you're on our server). 3 google.com.any2ix.coresite.com ( ) ms ms ms Tells us that the request went through a server hosted by google, and that the time it took at this router was between and 15.5 milliseconds. If a domain name is available it will list it. If not you will see an IP address. Some routers will simply show *** which indicates that there is either a problem, or firewall settings have been configured to prevent the router information from getting back to you. On busy routers, ICMP requests (which are what traceroute uses) will be dropped because they are low priority.

11 Fundamentals of Web Development 11 WEB DEVELOPMENT 5 What is e100.net, you may be asking (which is the last stop before google)? Using a whois command (not available in Windows) we can inquire: whois 1e100.net The output tells us it s a domain owned and run by Google. Registrant: DNS Admin Google Inc Amphitheatre Parkway Mountain View CA If you do not have access to whois, it is easy to find the same information through a web browser. For instance, go to the web site and enter 1e100.net. 7 Why is tracing the route important? Well, we can identify who could theoretically alter a packet along the way, or identify sources of delay. The entire issue of Network Neutrality becomes more meaningful when you realize that many providers play a part in getting your packet to Google and back. What are some interesting routers on your trace route path to google.com, or Microsoft.com? Copyright Randy Connolly and Ricardo Hoar

12 12 Lab 1 Exercise 1.6 W EB H OSTING AND N AME R EGISTRATION 1 Using a web search engine, do a search for Web Hosting. Click on one of the commercial services returned by the search engine. 2 Examine the pricing plans. Find out the service differences between the economy plans and the more expensive plans. 3 Using a web search engine, do a search for Domain Name Registration. Click on one of the commercial services returned by the search engine. 4 See if your name is available as a domain. Try different variations on your name (e.g., with middle initial or using dashes between names). Also check if your name is available on a non.com domain. 5 If you live outside of the United States, check if your name is available as a domain in your own country s TLD. 6 Compare price differences between two different registration services.