?? ch04_01.htm
字號:
<?label 4. Forms and CGI?><html><head><title>Forms and CGI (CGI Programming with Perl)</title><link href="../style/style1.css" type="text/css" rel="stylesheet" /><meta name="DC.Creator" content="Scott Guelich, Gunther Birznieks and Shishir Gundavaram" /><meta scheme="MIME" content="text/xml" name="DC.Format" /><meta content="en-US" name="DC.Language" /><meta content="O'Reilly & Associates, Inc." name="DC.Publisher" /><meta scheme="ISBN" name="DC.Source" content="1565924193L" /><meta name="DC.Subject.Keyword" content="stuff" /><meta name="DC.Title" content="CGI Programming with Perl" /><meta content="Text.Monograph" name="DC.Type" /></head><body bgcolor="#ffffff"><img src="gifs/smbanner.gif" alt="Book Home" usemap="#banner-map" border="0" /><map name="banner-map"><area alt="CGI Programming with Perl" href="index.htm" coords="0,0,466,65" shape="rect" /><area alt="Search this book" href="jobjects/fsearch.htm" coords="467,0,514,18" shape="rect" /></map><div class="navbar"><table border="0" width="515"><tr><td width="172" valign="top" align="left"><a href="ch03_04.htm"><img src="../gifs/txtpreva.gif" alt="Previous" border="0" /></a></td><td width="171" valign="top" align="center"><a href="index.htm">CGI Programming with Perl</a></td><td width="172" valign="top" align="right"><a href="ch04_02.htm"><img src="../gifs/txtnexta.gif" alt="Next" border="0" /></a></td></tr></table></div><hr align="left" width="515" /><h1 class="chapter">Chapter 4. Forms and CGI</h1><div class="htmltoc"><h4 class="tochead">Contents:</h4><p><a href="ch04_01.htm">Sending Data to the Server</a><br><a href="ch04_02.htm">Form Tags</a><br><a href="ch04_03.htm">Decoding Form Input</a><br></p></div><p><a name="INDEX-727" /> <a name="INDEX-728" />HTMLforms are the user interface that provides input to your CGI scripts.They are primarily used for two purposes:<a name="INDEX-729" /><a name="INDEX-730" />collecting <a name="INDEX-731" />data and accepting<a name="INDEX-732" />commands. Examples of data you collectmay include registration information, payment information, and onlinesurveys. You may also collect commands via forms, such as usingmenus, checkboxes, lists, and buttons to control various aspects ofyour application. In many cases, your forms will include elements forboth: collecting data as well as application control.</p><p>A great advantage of HTML forms is that you can use them to create afrontend for numerous gateways (such as databases or otherinformation servers) that can be accessed by any client withoutworrying about platform dependency.</p><p>In order to process data from an HTML form, the browser must send thedata via an HTTP request. A CGI script cannot check user input on theclient side; the user must press the submit button and the input canonly be validated once it has travelled to the server. JavaScript, onthe other hand, can perform actions in the browser. It can be used inconjunction with CGI scripts to provide a more responsive userinterface. We will see how to do this in <a href="ch07_01.htm">Chapter 7, "JavaScript"</a>.</p><p>This chapter covers:</p><ul><li><p>How form data is sent to the server</p></li><li><p>How to use HTML tags for writing forms</p></li><li><p>How CGI scripts decode the form data</p></li></ul><div class="sect1"><a name="ch04-84856" /><h2 class="sect1">4.1. Sending Data to the Server</h2><p>In the last <a name="INDEX-733" /> <a name="INDEX-734" /> <a name="INDEX-735" />couple of chapters, we havereferred to the options that a browser can include with an HTTPrequest. In the case of a <a name="INDEX-736" /><a name="INDEX-737" /> <a name="INDEX-738" /><a name="INDEX-739" />GET request, these options areincluded as the <a name="INDEX-740" /> <a name="INDEX-741" />query string portion of the URL passed inthe request line. In the case of a <a name="INDEX-742" /><a name="INDEX-743" />POST request, these options areincluded as the content of the HTTP request. These options aretypically generated by HTML forms.</p><p>Each HTML form <a name="INDEX-744" />element has an associated name andvalue, like this checkbox:</p><blockquote><pre class="code"><INPUT TYPE="checkbox" NAME="send_email" VALUE="yes"></pre></blockquote><p>If this checkbox is checked, then the option<tt class="literal">send_email</tt> with a value of <tt class="literal">yes</tt>is sent to the web server. Other form elements, which we will look atin a moment, act similarly. Before the browser can send form optiondata to the server, the browser must encode it. There are currentlytwo different forms of encoding form data. The default encoding,which has the <a name="INDEX-745" /><a name="INDEX-746" /><a name="INDEX-747" />mediatype of <tt class="command">application/x-www-form-urlencoded</tt>, is usedalmost exclusively. The other form of encoding,<em class="emphasis">multipart/form-data,</em><a name="INDEX-748" /><a name="INDEX-749" /><a name="INDEX-750" /> isprimarily used with forms which allow the user to upload files to theweb server. We will look at this in <a href="ch05_02.htm#ch05-67561">Section 5.2.4, "File Uploads with CGI.pm"</a>.</p><p>For now, let's look at how<tt class="command">application/x-www-form-urlencoded</tt> works. As wementioned, each HTML form element has a name and a value attribute.First, the browser collects the names and values for each element inthe form. It then takes these strings and encodes them according tothe same rules for encoding <a name="INDEX-751" /><a name="INDEX-752" />URL text that we discussed in <a href="ch02_01.htm">Chapter 2, "The Hypertext Transport Protocol "</a>. If you recall, characters that have specialmeaning for <a name="INDEX-753" /> <a name="INDEX-754" /> <a name="INDEX-755" />HTTP are replaced with a percentagesymbol and a two-digit hexadecimal number;<a name="INDEX-756" /> <a name="INDEX-757" />spaces are replaced with<tt class="literal">+</tt>. For example, the string "Thanks for thehelp!" would be converted to"Thanks+for+the+help%21".</p><p>Next, the browser joins each <a name="INDEX-758" />name and value with an equals sign. Forexample, if the user entered "30" when asked for the age,the key-value pair would be "age=30". Each<a name="INDEX-759" /><a name="INDEX-760" /> <a name="INDEX-761" />key-value pair is then joined, using the"&" character as a delimiter. Here is an example ofan <a name="INDEX-762" />HTML form:</p><blockquote><pre class="code"><HTML><HEAD> <TITLE>Mailing List</TITLE></HEAD><BODY><H1>Mailing List Signup</H1><P>Please fill out this form to be notified via email about updates and future product announcements.</P><FORM ACTION="/cgi/register.cgi" METHOD="POST"> <P> Name: <INPUT TYPE="TEXT" NAME="name"><BR> Email: <INPUT TYPE="TEXT" NAME="email"> </P> <HR> <INPUT TYPE="SUBMIT" VALUE="Submit Registration Info"></FORM></BODY></HTML></pre></blockquote><p><a href="ch04_01.htm#ch04-83168">Figure 4-1</a> shows how the form looks in Netscapewith some sample input.</p><a name="ch04-83168" /><div class="figure"><img width="443" src="figs/cgi2.0401.gif" height="213" alt="Figure 4-1" /></div><h4 class="objtitle">Figure 4-1. Sample HTML form</h4><p>When this form is submitted, the browser encodes these three elementsas:</p><blockquote><pre class="code">name=Mary+Jones&email=mjones%40jones.com</pre></blockquote><p>Since the <a name="INDEX-763" /><a name="INDEX-764" />request method is POST in thisexample, this string would be added to the HTTP request as thecontent of that message. The HTTP request message would look likethis:</p><blockquote><pre class="code">POST /cgi/register.cgi HTTP/1.1Host: localhostContent-Length: 67Content-Type: application/x-www-form-urlencodedname=Mary+Jones&email=mjones%40jones.com</pre></blockquote><p>If the request method were set to <a name="INDEX-765" />GET, then the <a name="INDEX-766" /> <a name="INDEX-767" /> <a name="INDEX-768" />request would beformatted this way instead:</p><blockquote><pre class="code">GET /cgi/register.cgi?name=Mary+Jones&email=mjones%40jones.com HTTP/1.1Host: localhost</pre></blockquote></div><hr align="left" width="515" /><div class="navbar"><table border="0" width="515"><tr><td width="172" valign="top" align="left"><a href="ch03_04.htm"><img src="../gifs/txtpreva.gif" alt="Previous" border="0" /></a></td><td width="171" valign="top" align="center"><a href="index.htm"><img src="../gifs/txthome.gif" alt="Home" border="0" /></a></td><td width="172" valign="top" align="right"><a href="ch04_02.htm"><img src="../gifs/txtnexta.gif" alt="Next" border="0" /></a></td></tr><tr><td width="172" valign="top" align="left">3.4. Examples</td><td width="171" valign="top" align="center"><a href="index/index.htm"><img src="../gifs/index.gif" alt="Book Index" border="0" /></a></td><td width="172" valign="top" align="right">4.2. Form Tags</td></tr></table></div><hr align="left" width="515" /><img src="../gifs/navbar.gif" alt="Library Navigation Links" usemap="#library-map" border="0" /><p><font size="-1"><a href="copyrght.htm">Copyright © 2001</a> O'Reilly & Associates. All rights reserved.</font></p><map name="library-map"><area href="../index.htm" coords="1,1,83,102" shape="rect" /><area href="../lnut/index.htm" coords="81,0,152,95" shape="rect" /><area href="../run/index.htm" coords="172,2,252,105" shape="rect" /><area href="../apache/index.htm" coords="238,2,334,95" shape="rect" /><area href="../sql/index.htm" coords="336,0,412,104" shape="rect" /><area href="../dbi/index.htm" coords="415,0,507,101" shape="rect" /><area href="../cgi/index.htm" coords="511,0,601,99" shape="rect" /></map></body></html>?? 快捷鍵說明
復制代碼
Ctrl + C
搜索代碼
Ctrl + F
全屏模式
F11
切換主題
Ctrl + Shift + D
顯示快捷鍵
?
增大字號
Ctrl + =
減小字號
Ctrl + -