- 1. CGI.pm とは
- 2. CGI.pm を利用するための準備
- 3. フォームからのデータを受け取る
- 3.1 フォームデータを変数に格納する
- 3.2 複数選択フォームデータを配列に格納する
- 3.3 nameリストを取り出す
- 4. HTTPヘッダの出力
- 4.1 標準HTTPヘッダの出力
- 4.2 リダイレクションヘッダの出力
- 5. HTMLドキュメントの出力
- 5.1 HTMLドキュメントヘッダ
- 5.2 HTMLドキュメントの締めくくり
- 5.3 見出し
- 5.4 中央揃え（<CENTER>）
- 5.5 箇条書きリスト(<UL>, <LI>）
- 5.6 ハイパーリンク（<A>）
- 5.7 水平罫線（<HR>）
- 5.8 強調（<STRONG>）
- 5.9 改行（<BR>）
- 5.10 サンプル
CGI.pm を使ってみよう
1. CGI.pm とは
CGI.pmでは、主に以下の二つの目的に役立ちます。
- フォームからのデータを受け取る
- 動的ドキュメントの作成
- 標準HTMLの出力
- フォームの出力
上に示したことをPerlスクリプトで作成することは、非常に面倒なことです。CGI.pmを使うことによって、簡単に目的を達成することができます。ほかにもいろいろな機能がありますが、ここでは割愛いたします。
CGI.pm は、Perl5には標準で組み込まれており、ほとんどのプロバイダーで利用可能です。詳細な情報は、オリジナルサイト（http://stein.cshl.org/WWW/software/CGI/cgi_docs.html）をご覧下さい。（英文です）
2. CGI.pm を利用するための準備
CGI.pm を利用するためには、Perlスクリプト上で、CGI.pm を呼び出さなければいけません。
use CGI;
CGI.pm を使う場合には、必ずこれを書き込んでください。次に、問い合わせオブジェクトの作成をしなければいけません。
$q = new CGI;
変数名は、$q である必要はありません。ご自由に決めてください。ここでは、すべて $q で統一して説明します。
3. フォームからのデータを受け取る
3.1 フォームデータを変数に格納する。
フォームに入力・選択された値を取得する方法を、以下のフォームを例にしたがって説明します。
<form action="http://www.futomi.com/lecture/form/exec/posttest.cgi" method="post">
<p>お名前：<input type="text" name="namae" value="太郎" size="20" /></p>
<p>OS：
<input type="radio" name="OS" value="win" checked="checked" /> Windows
<input type="radio" name="OS" value="mac" /> Machintosh
<input type="radio" name="OS" value="unix" />Unix</p>
<p><input type="submit" name="submit" value="送信" /></p>
</form>
<p>お名前：<input type="text" name="namae" value="太郎" size="20" /></p>
<p>OS：
<input type="radio" name="OS" value="win" checked="checked" /> Windows
<input type="radio" name="OS" value="mac" /> Machintosh
<input type="radio" name="OS" value="unix" />Unix</p>
<p><input type="submit" name="submit" value="送信" /></p>
</form>
フォームの値を取り出すのは、非常に簡単です。「お名前」の欄（テキストフィールド）の入力データは、
$Name = $q->param('namae');
で取り出せます。入力データは、スカラー変数「$Name」に格納されます。
同様に、「OS」の選択項目（ラジオボタン）を取り出すには、
$SelectedOS = $q->param('OS');
で取り出せます。$SelectedOS に格納されるデータは、フォームHTMLで、valueで指定された値です。たとえば、Windowsを選択したのであれば、$SelectedOS には、「win」という文字列が格納されます。
ポップアップメニュー（プルダウンメニュー）、テキストエリアにおいても、まったく同様に取得することができます。
3.2 複数選択フォームデータを配列に格納する。
では、複数選択可能なフォームである「チェックボックス」や「スクローリングリスト」の場合は、どのように取得するのでしょう。以下の例で説明します。
<form action="http://www.futomi.com/lecture/form/exec/posttest.cgi" method="post">
<p>OS：
<input type="checkbox" name="OS" value="win" checked="checked" /> Windows
<input type="checkbox" name="OS" value="mac" /> Machintosh
<input type="checkbox" name="OS" value="unix" checked="checked" /> Unix</p>
<p>PC Maker：<br />
<select name="MAKER" size="6" multiple="multiple">
<option selected="selected" value="fujitsu">富士通</option>
<option value="toshiba">東芝</option>
<option selected="selected" value="nec">日本電気</option>
<option value="dell">デル</option>
<option selected="selected" value="compaq">コンパック</option>
<option value="gateway">ゲートウェイ</option>
</select></p>
<p><input type="submit" name="submit" value="送信" /></p>
</form>
<p>OS：
<input type="checkbox" name="OS" value="win" checked="checked" /> Windows
<input type="checkbox" name="OS" value="mac" /> Machintosh
<input type="checkbox" name="OS" value="unix" checked="checked" /> Unix</p>
<p>PC Maker：<br />
<select name="MAKER" size="6" multiple="multiple">
<option selected="selected" value="fujitsu">富士通</option>
<option value="toshiba">東芝</option>
<option selected="selected" value="nec">日本電気</option>
<option value="dell">デル</option>
<option selected="selected" value="compaq">コンパック</option>
<option value="gateway">ゲートウェイ</option>
</select></p>
<p><input type="submit" name="submit" value="送信" /></p>
</form>
複数選択可能なフォームの場合には、以下のように配列変数を用意することで受ける取ることができます。
@OsList = $q->param('OS');
@MakerList = $q->param('MAKER');
@MakerList = $q->param('MAKER');
フォーム例では、OSに「Windows」「Unix」が選択されていますので、配列「@OsList」には、「win」「unix」の２つの要素が格納されます。同様に PC Maker には「富士通」「日本電気」「コンパック」が選択されていますので、配列「@MakerList」には、「fujitsu」「nec」「compaq」の３つの要素が格納されます。
3.3 nameリストを取り出す
フォームHTMLで指定された name の値のリストを取り出すことができます。
<form action="/cgi-bin/lecture/form/posttest.cgi" method="post">
<p>お名前：<input type="text" name="namae" value="太郎" size="20" /></p>
<p>OS：
<input type="radio" name="OS" value="win" checked="checked" /> Windows
<input type="radio" name="OS" value="mac" /> Machintosh
<input type="radio" name="OS" value="unix" /> Unix</p>
<p><input type="submit" name="submit" value="送信" /></p>
</form>
<p>お名前：<input type="text" name="namae" value="太郎" size="20" /></p>
<p>OS：
<input type="radio" name="OS" value="win" checked="checked" /> Windows
<input type="radio" name="OS" value="mac" /> Machintosh
<input type="radio" name="OS" value="unix" /> Unix</p>
<p><input type="submit" name="submit" value="送信" /></p>
</form>
@names = $q->param;
配列 @names には、「OS」「namae」という２つの要素が格納されます。
4. HTTPヘッダの出力
4.1 標準HTTPヘッダの出力
CGIでページを出力する際には、必ず標準HTTPヘッダを出力しなければいけません。各ヘッダを以下のとおりに出力することができます。（\n は改行を表します。）
| 記述例 | 出力内容 |
|---|---|
| print $q->header; | Content-Type: text/html |
| print $q->header('image/gif'); | Content-Type: image/gif |
| print $q->header('text/html','204 No response'); | Status: 204 No response Content-Type: text/html |
| print $q->header(-type=>'image/gif', -nph=>1, -status=>'402 Payment required', -expires=>'+3d', -cookie=>$cookie, -charset=>'utf-7', -attachment=>'foo.gif', -Cost=>'$2.00'); |
HTTP/1.0 402 Payment required Status: 402 Payment required Set-Cookie: Expires: Tue, 06 Mar 2001 09:26:31 GMT Date: Sat, 03 Mar 2001 09:26:31 GMT Attachment: foo.gif Charset: utf-7 Cost: $2.00 Content-Type: image/gif |
4.2 リダイレクションヘッダの出力
リダイレクションヘッダーを出力することによって、指定のURLへリダイレクトさせることができます。
| 記述例 | 出力内容 |
|---|---|
| print $q->redirect('http://www.futomi.com/'); | Status: 302 Moved Location: http://www.futomi.com/ |
| print $q->redirect(-uri=>'http://www.futomi.com/', -nph=>1); | HTTP/1.0 302 Moved Status: 302 Moved Location: http://www.futomi.com/ |
5. HTMLドキュメントの出力
5.1 HTMLドキュメントヘッダ
start_html関数で、<HTML>, <HEAD>, <TITLE>, <BODY>タグを出力します。
| 記述例 | 出力内容 |
|---|---|
| print $q->start_html; | <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <HTML><HEAD><TITLE>Untitled Document</TITLE> </HEAD><BODY> |
| print $q->start_html(-title=>'futomi\'s CGI Cafe'); | <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <HTML><HEAD><TITLE>futomi's CGI Cafe</TITLE> </HEAD><BODY> |
| print $q->start_html(-title=>'futomi\'s CGI Cafe', -BGCOLOR=>'#FFFFFF'); | <!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN"> <HTML><HEAD><TITLE>futomi's CGI Cafe</TITLE> </HEAD><BODY BGCOLOR="#FFFFFF"> |
１つ目の例は、一番シンプルなパターンです。ただ、<TITLE>には「Untitled Document」が自動的に挿入されてしまいますので、注意が必要です。最低限、２番目の例のように、-title を指定したほうがよろしいかと思います。
もし、-title で指定する文字列に「'」が含まれる場合には、手前に「\」を入れてください。もしくは「"」で囲んでください。
３つ目の例は、BODYタグ内でのBGCOLORを指定しています。-BGCOLOR を指定しないと、BGCOLORは何も指定されません。Netscapeの場合には、BGCOLORが指定されない場合、バックがグレーになってしまいます。
5.2 HTMLドキュメントの締めくくり
| 記述例 | 出力内容 |
|---|---|
| print $q->end_html; | </BODY></HTML> |
CGIでHTMLを出力するときには、最後にこれを入れましょう。
5.3 見出し
| 記述例 | 出力内容 |
|---|---|
| print $q->h1('futomi\'s CGI Cafe にようこそ！'); | <H1>futomi's CGI Cafe にようこそ！</H1> |
| print $q->h2('futomi\'s CGI Cafe にようこそ！'); | <H2>futomi's CGI Cafe にようこそ！</H2> |
5.4 中央揃え（<CENTER>）
| 記述例 | 出力内容 |
|---|---|
| print $q->center($q->h1('futomi\'s CGI Cafe にようこそ！')); | <CENTER><H1>futomi's CGI Cafe にようこそ！</H1></CENTER> |
5.5 箇条書きリスト(<UL>, <LI>）
| 記述例 | 出力内容 |
|---|---|
print $q->ul(
$q->li('高機能アクセスカウンター'),
$q->li('RevoCounter')
);
|
<UL><LI>高機能アクセスカウンター</LI> <LI>RevoCounter</LI></UL> |
5.6 ハイパーリンク（<A>）
| 記述例 | 出力内容 |
|---|---|
print $q->a(
{href=>"http://www.futomi.com/"}, "トップページ"
);
|
<A HREF="http://www.futomi.com/">トップページ</A> |
5.7 水平罫線（<HR>）
| 記述例 | 出力内容 |
|---|---|
print $q->hr; |
<HR> |
5.8 強調（<STRONG>）
| 記述例 | 出力内容 |
|---|---|
print $q->strong("強調文字");
|
<STRONG>強調文字</STRONG> |
5.9 改行（<BR>）
| 記述例 | 出力内容 |
|---|---|
print $q->br; |
<BR> |
5.10 サンプル
これまで紹介したものの例を示します。-> サンプルを表示する
サンプルで使っているCGIのソースは以下の通りです。
#!/usr/bin/perl
use CGI;
my $q = new CGI;
print $q->header(-charset=>"utf-8");
print $q->start_html(-title=>"futomi\'s CGI Cafe", -BGCOLOR=>'#ffffff'),
$q->center($q->h1('futomi\'s CGI Cafe にようこそ！')),
$q->hr,
$q->ul(
$q->li('高機能アクセスカウンター'),
$q->li('RevoCounter')
),
$q->br,
$q->br,
$q->a({href=>"http://www.futomi.com/"}, "トップページ"),
$q->br,
$q->br,
$q->strong("強調文字"),
$q->end_html;
exit;
use CGI;
my $q = new CGI;
print $q->header(-charset=>"utf-8");
print $q->start_html(-title=>"futomi\'s CGI Cafe", -BGCOLOR=>'#ffffff'),
$q->center($q->h1('futomi\'s CGI Cafe にようこそ！')),
$q->hr,
$q->ul(
$q->li('高機能アクセスカウンター'),
$q->li('RevoCounter')
),
$q->br,
$q->br,
$q->a({href=>"http://www.futomi.com/"}, "トップページ"),
$q->br,
$q->br,
$q->strong("強調文字"),
$q->end_html;
exit;