web servers don mcgregor research associate moves institute [email protected]
TRANSCRIPT
2
Client and Server
• HTML is a file format that allows you to lay out a web page
• A web browser renders HTML• A web server provides files to a web
browser
3
HTML
<html><body> <b>Hello world</b> !</body></html>
Save this file as simple.htmlOpen in a web browser: File->Open FileThe text (hello world) is displayed on the page. Hello world is inBold, the exclamation point is not.There are other ways to mark up text--<H1>, <i>, etc.
4
Web Browser
• Notice that the web browser renders this just fine without a web server.
• We can make the HTML page more complex—have it load an image
• <img src=“foo.jpg”/>• This causes the web browser to render the
image in the page. Notice the web browser has to have access to all the files specified in the HTML
5
Web Server
• Rendering files saved on your local PC isn’t so interesting. We want to render files from web servers.
• So: – Set up a web server on a host we’ll call
demo.com– Configure the web server to look in a particular
directory for files like simple.html and foo.jpg– Have your web browser contact the server and
get the files from there rather than your own disk
6
Web Server
Demo.comHost
Content Dir (configured)
Simple.html
Foo.jpg
http://
http://demo.com/simple.html really means:• Go to the host at demo.com• Contact the web server (http) running there
• The web server has a content directory configured—other people don’t need to know what that is
• Get the file simple.html from whatever content directory is configured• Return that to the web browser for rendering, just like loading the file from disk• The web browser may have to retrieve other files, like foo.jpg
7
HTML
<html><body> <b>Hello world</b> !<img src=http://faculty.nps.edu/ravi/NPS_logo.jpg”/></body></html>
What does this do? Where is it getting the jpg file?
8
HTML
• How about this? Where are the javascript files being loaded from?
<html><body><script type=“text/javascript” src=“myJavascript.js”></Script><script type=“text/javascript” src=http://demo.com/moreJavascript.js> </script> <b>Hello world</b> !<img src=http://faculty.nps.edu/ravi/NPS_logo.jpg”/></body></html>
9
HTML
• myJavascript.js is being loaded from the same web server as the HTML page, relative to the location of the HTML file
• moreJavascript.js is being loaded from the web server at demo.com
10
HTML• Obviously at some point it makes sense to start putting
similar files into directories—maybe you put all images into content/images on the server, and all javascript files into content/javascript
<html><body><script type=“text/javascript” src=“js/myJavascript.js”></Script><script type=“text/javascript” src=http://demo.com/js/moreJavascript.js> </script> <b>Hello world</b> !<img src=http://faculty.nps.edu/images/NPS_logo.jpg”/></body></html>
11
Web Server
• A web server is mostly just a way to get files, aka “content”, to the web browser
• The win is that you can change files once, on the server, and everyone will see those changes when they load their web page
• Web servers can also do some other things, if configured, like be an endpoint for a websocket.
12
Dynamic Content
• Web servers can generate dynamic content—based on the request they can generate HTML on the fly
• Example: generate a list of all items available for sale. The items for sale depend on what’s been purchased and removed from inventory
• You can have a server-side Java program query a database, generate HTML, and return that to the web browser
• The user asks for http://demo.com/inventory?widgets and gets back a dynamically generated HTML page
13
Dynamic Content
14
Dynamic Content
• The HTML page wasn’t written in a text editor. Instead the HTML was generated by a program to fit a web page template, based on the results of a live query of the inventory in a database
• No one had to pull up the html file to edit “9mm.html” to reduce the stock on hand by one when someone purchased ammo