Web Applications

The scenario above shows how a browser downloads and renders a simple Web page. Let’s have another look at the HTTP request, so we can see what the server does when it responds to the request:

GET /index.html HTTP/1.1
Host: www.example.com
Accept-Language: en

1. The browser sends the GET request to the server. As you saw above, the first line of the request specifies the resource (/index.html) that the browser is requesting.
2. When the Web server receives this request, it locates the root folder of the Web site on its hard drive, looks for a file called index.html, and then reads this file from the disk.
3. The Web server sends the contents of the file back to the browser inside the HTTP response.

So if the Web site root folder is C:\Website, then the Web server returns the contents of C:\Website\index.html. Likewise, when the browser requests /images/logo.jpg, then the Web server returns C:\Website\images\logo.jpg.

This system works very well if a Web site does not change its content very often. Every time the Web site owners want to change the content, they can upload a replacement for index.html (or whatever file needs to be changed).

However, the system is less efficient if the Web site contents change regularly, for example if the Web site displays data that changes regularly. In this scenario, it is not practical to constantly create HTML files that contain the data. Imagine if your Web mail application worked by reading files from the hard drive. Every time you deleted an email, the Web mail application would need a new HTML page to represent your Inbox, so that the Inbox no longer contained the deleted email. The Web mail application would therefore need to create a new HTML file on the hard drive to represent the new Inbox.

The solution to scenarios like this is to create a Web application that works with the Web server to create the page dynamically each time a browser requests it. Usually the information on the page is stored in a database. This kind of Web site is called a dynamic Web site, in contrast with astatic Web site where the contents are not generated each time a Web page is requested.

When a browser requests a page from a dynamic Web site runs, the request cycle works as follows:

1. The first part of the cycle works the same as with a static Web site – the browser specifies the resource name inside an HTTP GET request.
2. After this, however, things work slightly differently. The Web server recognizes that the file extension is something different than .html – for example, the file extension might be .aspx, which is an ASP.NET file – and it calls the appropriate Web application to process the request.
3. The Web application reads the requested file from the file system.
4. Instead of returning the file directly, the Web application processes the file and runs any instructions that it finds within (see below).
5. These instructions may load data from a database or perform some other processing. The Web application dynamically generates some HTML according to the instructions in the file, and then returns the generated HTML to the Web server.
6. The Web server forwards this HTML content to the browser. The browser itself is unaware that any of this HTML generation has taken place – it just treats the HTML in the same way as if it were a static file.

The exact way that the Web application generates the HTML varies from application to application, as does the computer language that is used to specify the instructions to the Web application.

Typically, however, the file that contains the instructions is a mixture of regular HTML and special programming instructions. The HTML describes the appearance and structure of the Web page, and the programming instructions describe how to access the information in the database. When the Web server processes the file, it replaces the special programming instructions with regular HTML. The instructions tell the Web application how to generate the regular HTML which it will use to replace the instructions.

An example helps to illustrate how this works. Here’s how our static Web page might look if it were generated dynamically by using ASP.NET:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title><%=Page.Title%></title>
    <link rel="stylesheet" href="/style.css" type="text/css" />
  </head>
  <body>
    <asp:image id="imgLogo" ImageUrl="~/images/logo.jpg" height="50px" width="200px" BorderWidth="0px" runat="server"></asp:image>
    <h1><asp:label id="lblPageTitle" Text='Welcome to Example.com' Runat="server"></asp:label> </h1>
    <p>Welcome to the Example.com Web site. We hope you will find lots of examples here.</p>
    <p>The full list of examples is on <asp:hyperlink id="lnkExamples" NavigateUrl='~/example-list.html' runat="server"> this Web page.</asp:hyperlink></p>
  </body>
</html>

The detail of how this works is not important right now. However, you can see that certain parts of the original page have been replaced with different code that is not HTML (the tags that begin<asp: are not HTML). The ASP.NET Web application replaces these tags with valid HTML when it processes the page, so that the result would look similar to the static page you saw earlier. In the ASP.NET context, there would usually be some Visual Basic or C# code that would work with this page to create the dynamic results.