ssh), file sharing, etc.
http://www.usna.edu/Users/cs/wcbrown/index.html \__/ \__________/\__________________________/ | | | protocol | path on server's file system server
httpsfor client-server web traffic, and also protocols like
ftp. The HTTPS protocol is just a secure version of http — more on that later.
en.wikipedia.org. We'll talk a bit more about domain names in the networking section of the course. Note that one domain is often hosted by many servers (physical or virtual), to balance the workload for large domains (e.g., Amazon.com is supported by many many servers). It is also possible for one server to support multiple domains. However, for the purposes of this course we will gloss over this distinction and treat "server name" and "domain name" synonymously, as if there is a one-to-one mapping between domains and servers.
/) instead of back slashes (
\), regardless of whether the server is a Windows server or a UNIX server (recall that Windows denotes directories internally using a back slash).
Many ships in the U.S. Navy have their own public web sites. The URL
For example, the USS NIMITZ's website is at
When a client requests the web page from one of the URLs above, that request is directed to the web server that hosts (serves) the web site. For ships and submarines, hosting a web site is not practical because of limited availability, bandwidth considerations, risk of detection, and the increased vulnerability (penetration point into) to the ship's internal network. Instead, shore-based commands provide and manage the web server that hosts ship and submarine web sites, much like how you will have a web site on
rona, but you do not have to worry about the operation of
rona (just your content).
fileprotocol. You can open up a file on your computer in the browser using the
fileprotocol. Note that this is not the web! It's not client-server and it doesn't use http/https. Suppose you were user mxxxxxx and you had a file on your Desktop called
vacation.jpg. Putting the following URL in the browser's address bar would result in the browser showing you that image:
file:///C:/Users/mxxxxxx/Desktop/vacation.jpgNote that the "server" portion of the URL has collapsed to nothing, which is why there are three
/'s in a row, indicating that we're accessing the file on our local machine (no remote server). Using Ctrl-o, you can browse the local file system to open a file, which may be more convenient than typing a URL. The
fileprotocol is really useful when building web sites, since you can get a quick look at a web page before you put it on a web server.
HTTP(Hyper-Text Transfer Protocol). At its simplest, HTTP is just a language of requests and responses that allows files to be fetched from web servers all over the Internet. Your browser uses this language to get the file named in the URL from the server. The HTTP command it uses is "
GET". The key point is YOUR browser makes a request to a remote server ON YOUR BEHALF ... usually to have a given file sent to it.
nk) which allows you to send network requests at a low level. Let's compare what you see when you browse to http://rona.academy.usna.edu/~sy110/index.html with what the browser sees and goes through to bring you that page. What we type is in red; the green text is what the server sends back.
HTTP/1.1 200 OK" means the server was able to respond successfully to the request. "
Content-Type: text/html" is especially important: with the Content-Type line, the server is telling the browser what kind of file it is serving up. In this case the server is telling the browser that what follows is a plain text file following the HTML format.
>). Most tags come in start/end pairs, where the end pair just has a
/before the name, e.g.
<HTML> ... </HTML>.
I said <b>hello</b> out there!
<html> ... </html>tags — while others (like
<b> ... </b>are pure formatting).
|HTML Code||As Rendered in the Browser|
<html> <head> </head> <body> <h1>A Simple Web Page</h1> <p>This page has <b>two</b> paragraphs. The first has an image <img src="SleepyFace.JPG"> and <a href="http://www.usna.edu">a link</a>. </p>
A Simple Web Page
This page has two paragraphs. The first has an image and a link.
The second has different colors, which is cool. It also has some funky characters: Σ ⇨ ▲
<HTML> <HEAD> ← stuff goes here </HEAD> <BODY> ← stuff goes here </BODY> </HTML>... meaning that every HTML file has a head and a body. The body is what actually gets printed on the page.
<P> ... </P>tags. Line breaks and blank lines in the HTML source code are irrelevant: if you want paragraphs in the rendered output, you need
<P> ... </P>tags! Otherwise, text just stays on a single line, automatically wrapping to the next line according to the width of the browser window.
#ff0000has maximum 'R' intensity, and minimum 'G' and 'B' intensities. In other words, it's red! As you see, there's no escaping hex!
https://intranet.usna.edu/1stBatt/index.htmlin your browser's address bar, it initiates the following sequence of actions:
intranet.usna.eduand asks it to get the file
/1stBatt/index.htmland sends it (serves it) to the browser.
www.usma.edu. This status popup is telling you the address the browser will go to if you click on this link. There's a little bit of a misdirection trick that knowing about the status popup can help you avoid.
|HTML Code: ||As Rendered in the Browser|
<HTML> <HEAD> </HEAD> <BODY> <H1>A Simple Web Page With a Few Links</H1> <P> First we have a cat: <IMG src="SleepyFace.JPG"> </P> <P> Then a comic:<BR> <IMG src="http://www.foxtrot.com/wp-content/uploads/2014/07/ft111002noncompliant.png"> </P> <P> Then a link: The above cartoon comes from the <A href="http://www.foxtrot.com/2011/10/02/non-compliant/">FoxTrot Website</A> </P> </BODY> </HTML>
http://rona.academy.usna.edu/~sy110/lec/wwwIntro/ex2.htmlinto the URL bar and press Enter.
rona.academy.usna.edua GET request for the file
/~sy110/lec/wwwIntro/ex2.htmlon its hard drive and sends it back to the browser.
ex2.htmland looks through it, noticing that images
http://www.foxtrot.com/wp-content/uploads/2014/07/ft111002noncompliant.pngwill be needed in order to render the page.
/~sy110/lec/wwwIntro/SleeyFace.JPG, and a GET request to
/wp-content/uploads/2014/07/ft111002noncompliant.png. These will actually go out more or less simultaneously.
rona.academy.usna.edureceives the request for
/~sy110/lec/wwwIntro/SleeyFace.JPG, finds that file on its hard drive and sends it back to the browser.
www.foxtrot.comreceives the request for
/wp-content/uploads/2014/07/ft111002noncompliant.png, finds that file on it's hard drive and sends it back to the browser.
<A href="http://www.foxtrot.com/2011/10/02/non-compliant/">FoxTrot Website</A>This does not result in any further HTTP traffic, i.e. in any further GET requests, because no information about that file is required to render the page
ex2.html. Of course, if the user clicks on that link, the browser will then issue a GET request for it. In short, embedded images will usually result in a GET request to the server on which the image is located, but links in a web page do not result in GET requests to the linked URLs.
Browsers often allow you to view the HTTP traffic that
goes on under the hood. In Chrome, if you open up the
Developer Tools (hotdog button → Tools → Developer Tools) and
click on the Network tab, you can see all the GET requests that
Chrome sends when it renders a page. Try opening it up, and
entering a common URL like
astounding how many GET's are required to render a page like
rona.academy.usna.eduand asks it to get the file
/~sy110/index.htmland sends it (serves it) to the browser.