| Table of Contents | Previous Next |
20.5 Building a secure Web site with HTTPSThe basic idea to set up a secure Web site is to integrate the SSL with the Web server software. The SSL provides handshake and encrypted information exchange between the browser and server. As a result, secure Web communications are accomplished. The HyperText Transfer Protocol (HTTP) over a secure channel, or more precisely HTTP over SSL, becomes a new standard known as HTTPS. As we mentioned in previous sections, one of the important tasks for secure communications is the handshake between the browser and server via authentication and certificate exchange. If you can import certificates into your browser for client authentication, you have completed half of the story. Together with server authentication, mutual trust is built so that cipher suit (encryption method) exchange is employed to perform the desired secure Web communications. In fact, in many secure Web communications, client authentication is optional depending on the settings of the server software: you can turn off the client authentication requirement. In this case, there will be no client certificate request from the server. However, server authentication is a compulsory requirement for standard HTTPS on the Web. Apart from the security issue, the main difference between HTTP and HTTPS is that they use different ports. By default, an ordinary Web server uses port 80, but a secure Web server listens via port 443. For example, the following protocols are used to contact a normal and a secure Web site:
For a capable Web server, it is possible to set up a Web site listening to the two protocols above. In this case, all security operations are almost completely transparent to the end users. We will show you how to do this in the final section of this chapter. Before that, we would like to demonstrate how to build a secure Web site in the first place. 20.5.1 Basic requirements to build a secure Web siteIn normal circumstances, a secure Web site is a machine running Web server software with SSL functionalities. In this case Web communications can be secured by SSL encryption. Since secure Web sites involve SSL, the basic requirements to build one include the following:
In terms of a real example, we will show you how to build a secure Web site using the following software packages:
The main reason for selecting these packages is that they are popular and freely available with source code. That means you can build the final software from scratch and use it for both commercial and non-commercial applications. Also, it seems that the only free solution to provide secure Web communications on a PC with Windows systems is the Apache, OpenSSL, and Mod_SSL combination. We covered how to compile and set up OpenSSL in section 20.4.2. Apache is important server software and is very popular and widely used by the Web community, including both UNIX/LINUX and Windows. We have covered Apache to some degree on a number of occasions in this book. The only new software here is Mod_SSL (or mod_ssl from the official site). This is a software patch or, more accurately, an Apache interface to OpenSSL. The software can be downloaded from the official site www.modssl.org. The mod_ssl package is based on particular versions of Apache. For example, mod_ssl-x.x.x-y.y.y.tar.gz represents the mod_ssl software version x.x.x and is designed for Apache software of version y.y.y. The mod_ssl package we are going to use is mod_ssl-2.8.7-1.3.23.tar.gz and is dedicated to Apache version 1.3.23. Therefore, if you are using other versions of Apache, you may need to download the module suitable for your requirement. Also, to make mod_ssl work, you need the source code of Apache so that they can be compiled together. The Apache package we are going to use is
The Microsoft Installer (msi) version is for the Windows environment. Both these Apache packages are available from www.apache.org. When you extract or unpack the Apache, OpenSSL, and Mod_SSL package files, you should have the following subdirectories:
We assume that the OpenSSL package has already been installed on your system and the directory openssl-0.9.6c is located side by side with the others. Now, let's proceed to perform the integration of Apache and OpenSSL. 20.5.2 Integrating Apache and OpenSSL using Mod_SSLIn this section, we will show you how to integrate Apache and OpenSSL together using Mod_SSL. By default, the Mod_SSL (Apache interface to OpenSSL) package supports the UNIX/LINUX platform or platforms of a similar type. Therefore, to integrate Apache and OpenSSL on a UNIX/LINUX machine is much simpler. Believe it or not, the entire compilation, installation, and configuration process can be done in just a couple of lines as illustrated in example ex20-19.ssl. Example: ex20-19.ssl - Integrating Apache And OpenSSL With Mod_SSL 1: $ cd mod_ssl-2.8.71.3.23 2: $ ./configure \ 3: --with-apache=../apache_1.3.23 \ 4: --with-ssl=../openssl-0.9.6c \ 5: --prefix=/usr/local/apache 6: $ cd .. 7: $ cd apache_1.3.23 8: $ make 9: $ make certificate 10: $ make install Line 1 is to go to the Mod_SSL directory mod_ssl-2.8.71.3.23. Inside this directory, run the configure program with parameters (see lines 25) --with-apache=../apache_1.3.23 --with-ssl=../openssl-0.9.6c --prefix=/usr/local/apache The first parameter is to set the name and location of the Apache source directory and the second parameter sets the name and location of the OpenSSL source directory. The prefix parameter is to tell Mod_SSL where to find the installed Apache executables, libraries, and binaries. In this case, we have assumed that the installed Apache software is located in the directory /usr/local/apache. If your default directory for Apache is not /usr/local/apache, you may need to change the prefix parameter. The main function of the configure program is to set up and prepare an SSL-aware Apache ready for recompilation. Lines 67 are to go to the Apache source directory apache_1.3.23. By issuing the make command in line 8, the Apache software is recompiled with SSL features. Before the Apache software can be used for server authentication, you need to generate a certificate and import it into the server. The make command in line 9 will do just that. More precisely, the make command is to generate a private key together with a server certificate and install them into the configuration file httpd.conf of Apache. Finally, the make statement in line 10 is to install the new Apache package in the target install directory /usr/local/apache. In order to make this new Apache server work, you need to activate it with SSL. This can be done by the following command if you are using UNIX/LINUX systems: $ /usr/local/apache/bin/httpd -DSSL If your newly created secure site is called www.pwt-ex.com, you can test it with the following command:
You will see an alert window (Fig. 20.25) to tell you that you are about to enter into a secure Web communication. If you click the OK button, you will see a welcome message form Mod_SSL as illustrated in Fig. 20.26. Figure 20.25. "Security Alert" window
Figure 20.26. An SSL-aware site
If you are using a Microsoft Windows system, you may need to do this from scratch by yourself. Don't worry, we will show you how to get it done step by step. The first step is to get the following packages:
If you have a Microsoft installer, you can install the Apache package apache_1.3.23-win32-x86-src.msi by double clicking on this file. If you don't have an installer, a copy can be downloaded from the official download center of www.microsoft.com. Next, you can use the WinZip utility to unzip and extract files from the other two packages. Suppose all three packages are located in the following drive and directories: o:\apache_1.3.23 o:\mod_ssl-2.8.61.3.23 o:\openssl-0.9.6c In this case, we have assumed the default drive is o:\. Do ensure that all three source directories are side by side, otherwise you may need to change the following three compilation and configuration steps.
Now you should have the SSL-aware Apache installed. However, you cannot use SSL features such as HTTPS. The reason is that you still need to configure Apache yourself. 20.5.3 Configuring Apache to use SSLAs an example, the information in this section is dedicated to Windows users. However, the general techniques to configure the Apache server apply to us all. After installation of Apache, you should have the main program apache.exe and the following directories under o:\apache:
Among other things, you still need to configure Apache by
Before any configuration, we strongly recommend that you do some testing to make sure you have the Apache software properly built. The first test would be to activate the program apache.exe with a command-line option such as apache h If you can see all the options as listed in ex20-23.ssl, the program is working. Example: ex20-23.ssl - Testing Apache apache -h 1: O:\Apache>apache -h 2: Usage: apache [-D name] [-d directory] [-f file] [-n service] 3: [-C "directive"] [-c "directive"] [-k signal] 4: [-v] [-V] [-h] [-l] [-L] [-S] [-t] [-T] 5: -D name : define a name for use in <IfDefine name> directives 6: -d directory : specify an alternate initial ServerRoot 7: -f file : specify an alternate ServerConfigFile 8: -C "directive" : process directive before reading config files 9: -c "directive" : process directive after reading config files 10: -v : show version number 11: -V : show compile settings 12: -h : list available command line options (this page) 13: -l : list compiled-in modules 14: -L : list available configuration directives 15: -S : show parsed settings (currently only vhost settings) 16: -t : run syntax check for config files (with docroot check) 17: -T : run syntax check for config files (without docroot check) 18: -n name : name the Apache service for -k options below; 19: -k stop|shutdown : tell running Apache to shutdown 20: -k restart : tell running Apache to do a graceful restart 21: -k start : tell Apache to start 22: -k install | -I : install an Apache service 23: -k config : reconfigure an installed Apache service 24: -k uninstall | -u : uninstall an Apache service 25: -W service : after -k config|install; Apache starts after 'service' 26: -w : holds the window open for 30 seconds for fatal errors. Next, you should also perform a test of server capability to make sure that everything is fine before the configuration. Apache with SSL can be run on Windows 98, ME, NT, 2000, and XP. As recommended by the Apache authority, Apache will run better if installed as a service (net service) on Windows NT, 2000, and XP. To install and start Apache as a service on Windows XP, the following commands are used: apache k install net start apache If your system already has Apache running, you may need to stop it first by net stop apache Once you have Apache up and running, you can use your favorite browser to test it. Try the following:
You may want to change the address of localhost to some sites you know. If you can see something similar to Fig. 20.27, your Apache is properly installed. Figure 20.27. http://localhost
From Fig. 20.27, you may also think that you have properly set up SSL/LTS-aware Apache. No, you haven't, at least not yet! The reason is that you have used the http:// protocol which has no SSL involved. Also, Apache is still listening to port 80. Nonetheless, you know that the new Apache is working properly and you can concentrate on its configuration. Now, back up a copy of the Apache configuration file httpd.conf from the directory apache\conf. Edit this file with your favorite editor and perform the following configuration steps:
Now you have a new Apache configuration file httpd.conf. The next step is to save this file and relaunch Apache to use the new settings. Open a DOS window and issue the following commands: net stop apache apache k uninstall apache k install net start apache The first two commands are used to stop the Apache service and then uninstall it from the system. The third command is to install the Apache server again with new configuration settings. The final command is to start Apache as a service. You may want to test it by issuing the secure HTTP below:
You should see a page exactly the same as that in Fig. 20.27. From this page, if you click on the underlined text "documentation," a full documentation of Apache is displayed (see Fig. 20.28). If you click on the underlined text "mod_ssl User Manual," the user manual of Mod_SSL is displayed (see Fig. 20.29). Figure 20.28. Apache manual
Figure 20.29. Mod_SSL manual
As we mentioned on a number of occasions, one of the differences between HTTP and HTTPS is the use of ports. They use different ports and therefore are not compatible by default. For example, suppose the site www.pwt-ex.com is configured as a secure site. If you use the following command on a browser:
and if the system does not crash, you will get an error message. The reason is because you are using port 80 to talk to a server which can only listen via port 443. With the elegance of Apache's virtual hosts, however, it is possible and quite easy to set up a Web site listening to both port 80 and 443. 20.5.4 Configuring Apache for secure and insecure connectionsAs mentioned in section 20.5.3, you should back up a copy of the configuration file httpd.conf before any modification is made. Suppose the file httpd.conf is configured for a secure situation. In order to modify it to accept both secure and insecure connections, you need to change it back to the insecure case first. Edit the file httpd.conf with your favorite editor and perform the following two steps:
Now your Apache server is set to handle insecure connections. HTTP is working via port 80. To add secure connections to this httpd.conf file, all you need is to create a virtual host that can activate SSL and listen to port 443. You can do that by copying the following code fragment to the end of the configuration file: Example: ex20-26.ssl - Virtual Host Listens To Port 443 1: SSLMutex sem 2: SSLRandomSeed startup builtin 3: SSLSessionCache none 4: 5: SSLLog logs/SSL.log 6: SSLLogLevel info 7: 8: <IfDefine HAVE_SSL> 9: Listen 443 10: <VirtualHost www.pwt-ex.com:443> 11: SSLEngine On 12: SSLCertificateFile conf/ssl/server.crt 13: SSLCertificateKeyFile conf/ssl/server.key 14: </VirtualHost> 15: </IfDefine> Yes! That's it. By changing everything back to port 80 this means that all normal communications with HTTP will be handled in usual way. That is, Apache is listening to port 80 by default and searching the http:// document from the DocumentRoot setting in the early part of httpd.conf. Now, if you activate the following command from your browser
the Apache server, in this case, will search for the default document such as index.html from the DocumentRoot (e.g., o:\apache\htdocs) directory and return it to the browser. Note that we have used the root directory as the default URL rather than the usual http://www.pwt-ex.com/book/chap20a settings. The if-define directive <IfDefine HAVE_SSL> in lines 815 means that if HAVE_SSL is defined, Apache will listen to port 443. If the browser requests the virtual host www.pwt-ex.com in secure mode (i.e., www.pwt-ex.com:443), the certificate and key will be available from the location specified in lines 1213. Now, when you issue the command
the Apache server will use this secure virtual host to handle security and connection. Since this virtual host has the same name as the ServerName setting, Apache will search the default document (e.g., index.html) from the same directory as specified by HTTP. In order to use the new settings of this httpd.conf file, you may need to relaunch Apache using the following commands: net stop apache apache k uninstall apache k install D SSL D HAVE_SSL net start apache The third command above is to install Apache with the variables SSL and HAVE_SSL defined so that the if-define directive can take effect. Virtual host is a powerful feature of Apache and you can use it to set up different sites at different or the same locations. Each virtual host has its own settings and is treated as an independent site. For more details, the Apache manual or documentation is recommended. Now, let's consider some examples of how to use secure communications on the Web. 20.5.5 Some examples to use the secure siteTo use the site you have built in the previous section is easy. All you have to do is to put all your Web pages (both secure and insecure) into the directory specified by the variable DocumentRoot of Apache. In our case, the directory is o:\apache\htdocs. To call a page in secure mode, all you need is to change the "http" to "https" in all URL situations. For example, you can use "https" in the anchor or button element as
<a href="https://www.pwt-ex.com/abc.htm">Secure Connection</a>
<input onclick='location.href="../https@www.pwt-ex.com/abc.htm"'
type="button" value="Secure Connection" />
For the button case, when the Secure Connection button is clicked, the onclick event will activate the following statement:
In this case, the browser is requesting the abc.htm page from the Web site www.pwt-ex.com using secure mode. As a simple test example, let's consider writing some donation pages for a charity organization. For security reasons, and also the privacy of the donors, we are going to develop a page using both secure and insecure (normal) channels for the donation. Consider the simple XHTML page below:
Example: ex20-27.htm - A Page To Get Donation For Charity
1: <?xml version="1.0" encoding="iso-88591"?>
2: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
5: <head><title>Secure & Normal Web Connection - ex2027.htm</title></head>
6: <style>
7: .tx01{background-color:#000088;font-family:arial;font-size:22pt;
8: font-weight:bold;color:#ffff00;text-align:left}
9: .tx03{font-size:18pt;color:#00ff00}
10: .butSt{background-color:#aaffaa;font-family:arial;font-weight:bold;
11: font-size:14pt;color:#880000;width:250px;height:35px}
12: </style>
13: <body class="tx01" style="text-align:center">
14: Welcome To ABC Charity Site<br /><br />
15: <div class="tx03">
16: Your Privacy Is Our Top Priority <br />
17: You Have A Choice To Use <br />
18: Secure Or Normal<br />
19: Channel To Make Your Donation.
20: </div><br />
21: <input type="button" class="butSt" value="Secure Connection" onclick=
22: 'location.href="../https@www.pwt-ex.com/ex20_259628.htm"' /><br /><br />
23: <input type="button" class="butSt" value="Normal Connection"
24: onclick='location.href="../www.pwt-ex.com/ex20_259628.htm"' /><br />
25: </body>
26: </html>
This is a simple XHTML page containing two buttons offering both secure and normal communications for the charity donors. When the first button (lines 2122) is clicked, the following command is activated:
This command requests the document ex20-28.htm from the server www.pwt-ex.com over a secure channel. On entering an insecure environment from a secure environment, the browser would normal display a security alert window before any security action. Some screen shots of this are shown in Figs 20.30 and 20.31. Figure 20.30. ex20-27.htm
Figure 20.31. Alert window
When the OK button in Fig. 20.31 is clicked, the XHTML page ex20-28.htm is displayed with SSL protection (see Fig. 20.32). This ex20-28.htm page is also a very simple page to display the following message for the donor to fill in: Name Telephone Address Amount Figure 20.32. ex20-28.htm
When the donor completes all the fields and presses the Back button, example ex20-27.htm is activated with the normal HTTP channel. On leaving a secure environment and entering an insecure area, an alert window will also be displayed by the browser (see Figs 20.32 and 20.33). Figure 20.33. Alert window
For completeness of the example, the listing of ex20-28.htm is shown as follows:
Example: ex20-28.htm - A Simple Page To Accept Donation
1: <?xml version="1.0" encoding="iso-88591"?>
2: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
3: "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4: <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
5: <head><title>A Page For Charity Donation ex2028.htm</title></head>
6: <style>
7: .butSt{background-color:#aaffaa;font-family:arial;font-weight:bold;
8: font-size:14pt;color:#880000;width:200px;height:28px}
9: .txtSt{font-family:arial;font-weight:bold; text-align:center;
10: font-size:14pt;color:#ffff00}
11: .txtSt2{font-family:arial;font-weight:bold; text-align:center;
12: font-size:20pt;color:#00ff00}
13: </style>
14: <body style="background:#000088;text-align:center" class="txtSt">
15: <div class="txtSt" style="font-size:18pt;text-align:center">
16: Donation This Month:<br />
17: Disabled Children In The Third World
18: </div><br /><br />
19:
20: <table border="0" width="400" class="txtSt">
21: <tr><td >Name</td><td>
22: <input type="text" name="name" class="butSt"></td><tr>
23: <tr><td >Address</td><td>
24: <input type="text" name="add" class="butSt"></td><tr>
25: <tr><td >Telephone</td><td>
26: <input type="text" name="phone" class="butSt"></td><tr>
27: <tr><td >Amount</td><td>
28: <input type="text" name="amount" class="butSt"></td><tr>
29: </table><br />
30: <a href="ex20-27.htm" class="txtSt2">Back</a></body></html>
This page should be easy to understand. The main purpose of this example is to show how both secure and normal Web communications can be set up together. Secure Web pages are very popular in the business community. For example, most e-commerce sites have some links or connections in secure mode. Our next example is to modify the "General Login" page developed in section 20.2.3 with SSL security. In order to save some typing time, we perform the following:
Make sure all these pages are in the default directory of the secure Web site. For Apache servers, whether you are using UNIX/LINUX or Windows, the default directory is usually called htdocs. Now you can edit the PHP page ex20-29.php, locate the string variable $llst, and change it to the following: Listing: ex20-04.txt - Code Fragment Of ex20-29.php 1: $llst = 'Welcome To ABC Online Bargain Hunting<br /> ' . 2: ' This Is A Member Only Site<br /><br /> ' . 3: ' Enter User Name and Password To Log In<br />' . 4: ' <form action="ex2029.php" method="post">'. 5: ' <table class="txtSt">' . 6: ' <tr><td>Username:</td><td>' . 7: ' <input type="text" name="userId" id="userId" class="butSt" />' . 8: ' </td></tr>' . 9: ' <tr><td>Password:</td><td>' . 10: ' <input type="password" name="passId" id="passId" class="butSt" />' . 11: ' </td></tr> ' . 12: ' <tr><td colspan="2" style="text-align:center"><br />' . 13: ' <input type="submit" value="Login" class="butSt2" />' . 14: ' <input type="button" value="Join Member" class="butSt2" '. 15: ' onclick="location.href=\'../https@www.pwt-ex.com/ex20_259630.htm\'" />' . 16: ' </td></tr></table>' . 17: ' </form> '; If you compare this code fragment with the code listing in ex20-05.php, you will find that we have changed only two lines (i.e., lines 4 and 15). When the Join Member button is pressed, this page will call
In this situation, you are calling the join member page ch20fig37 in secure mode. That's it nothing more. When you issue the command
you will see the page as in Fig. 20.34. When the Join Member button is pressed, an alert window is launched (see Fig. 20.35). Figure 20.34. ex20-29.php
Figure 20.35. Alert window
When you press the OK button and if the server's certificate is not a trusted certificate in your browser, you will see a further security alert window as in Fig. 20.36. This window will tell you that the server certificate is not in your trust list and ask whether you want to proceed. If you press the Yes button, the ex20-30.htm page will be displayed in secure mode (see Fig. 20.37). Figure 20.36. Further security alert
Figure 20.37. ex20-30.htm
Alternatively, if you press the View Certificate button, the details of the certificate are as displayed as in Fig. 20.38. You can see the certificate is issued to and by the same person. Now, you have a chance to install the certificate into trust storage. If you press the Install Certificate button, the "Certificate Import Wizard" is launched. Next, you will be asked whether you want to store the certificate in a location depending on its type (see Fig. 20.39). Figure 20.38. View the certificate
Figure 20.39. Store the certificate
Next, the system will select the storage for your certificate and ask for confirmation (see Fig. 20.40). If you say yes by pressing the Yes button, the server certificate is stored in the root store. If you go to Tools | Internet Options | Content | Certificate from your IE browser and click on the Trusted Root Certification Authority tag, you will see the imported certificate as illustrated in Fig. 20.41. Figure 20.40. Confirm the storage
Figure 20.41. Certificates in trusted root certification authority
|
| Table of Contents | Previous Next |
