ポンクソフト

フォーム内容を表示する - CGI(Perl)の基本と掲示板作成

前ページ CGI(Perl)の基本と掲示板作成 TOP 次ページ

目次

  1. CGI(Perl)の基本と掲示板作成
  2. ブラウザに文字列を表示する
  3. アクセスカウンタを作る
  4. フォーム内容を表示する
  5. 占いプログラムを作る
  6. 掲示板 その1
  7. 掲示板 その2
  8. 掲示板 その3
  9. 掲示板 その4

フォーム内容を表示

掲示板作成への準備段階として、フォームの内容を表示するというプログラムを作成します。フォームとは、掲示板で名前を書いたり内容を書いたりする部分のことです。インターネットを使っている人なら一度は見たことがあると思います。
フォーム処理の流れは以下のようになります。
というわけでフォームを使う場合は、フォームを表示する部分とフォーム内容を処理する部分の2種類が必要になります。

フォームのHTML

まず最初にフォームの入ったHTMLファイルを作成します。
以下のHTMLをテキストエディタで入力してください。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<title>フォーム</title>
</head>
<body>
<form method="post" action="form1.cgi">
アナタの名前を教えてクダサイ:
<input type="text" name="namae">
<input type="submit" value="送信">
</form>
</body>
</html>
入力が終わったら、「form1.html」という名前でサーバにアップロードし、ブラウザで確認してみてください。テキストの書けるエリア(テキスト入力フィールドと言います)と送信ボタンが現れたと思います。
仮にテキスト入力フィールドに名前を入れて送信ボタンを押してみてください。エラーが出ますが、これは送信された内容を処理するCGIがまだ存在しないからです。

HTMLの説明

<form method="post" action="form1.cgi">
ここから</form>までの部分がフォーム本体で、複数のフォーム部品が入ります。method属性はCGIにデータをどのように送信するかを指定します。送信方法にはGETとPOSTの2種類がありますが、その違いについては今回は気にする必要はありません。action属性は送信されたデータを処理するCGIプログラムのファイル名です。
<input type="text" name="namae">
フォーム部品を配置します。フォーム部品には、テキスト入力フィールド・ラジオボタン・チェックボックスなどがありますが、その種類を指定するのがtype属性です。「text」はテキスト入力フィールドを表します。name属性はフォーム部品の名前を指定します。複数のフォーム部品を使う場合、送られたデータがどのフォーム部品のデータなのかを判別するものがname属性です。今回のテキスト入力フィールドには「namae」という名前を付けました。
<input type="submit" value="送信">
type属性が「submit」のフォーム部品は送信ボタンの役割を持ちます。このボタンが押されたときに実際にフォームのaction属性で書かれたCGIプログラムにフォームの内容が渡されます。value属性はボタンに書かれるテキストを指定します。

cgi-libライブラリ

次に、フォームの内容を処理するCGIを作るのですが、フォームで送られる内容は特殊な形式になるので、それをプログラムで使える形にするには変換処理が必要になります。その処理は全て自分で行なっても構わないのですが、少し面倒なので既存のライブラリ(プログラムの部品のこと)を使います。ライブラリ名はcgi-lib.plと言い、http://cgi-lib.berkeley.edu/からダウンロードできます。これを今回作るプログラムと同じディレクトリにコピーしておいてください。

フォームを処理するプログラム

準備ができたところで、以下のプログラムをテキストエディタで入力してください。
#!/usr/bin/perl

# フォームの内容を表示する

require "cgi-lib.pl";    # cgi-libを使用する

print "Content-type: text/html; charset=Shift_JIS\n\n";

&ReadParse(*form);

print <<EOL;
<html>
<body>
<p>
コンニチハ、 $form{"namae"} サン。
</p>
</body>
</html>
EOL
入力が終わったら、「form1.cgi」という名前でサーバにアップロードし、パーミッションを755にしてください。
その後、もういちどform1.htmlをブラウザで呼び出し、名前を入力して送信ボタンを押してください。名前が表示されれば成功です。

プログラムの説明

require "cgi-lib.pl";    # cgi-libを使用する
cgi-libライブラリをこのプログラム中で使用しますよ、という宣言をしている部分です。この宣言をしないとcgi-libライブラリが使えません。
&ReadParse(*form);
フォームで送られてきた内容をプログラムで使える形に変換する部分です。ReadParseはcgi-libの機能のひとつで、サブルーチンと言います。サブルーチンとは、機能のひとかたまりを表わすものです。Perlではサブルーチン呼び出しには先頭に&を付ける必要があります。
ここでは、フォームで送られてきた内容を解釈して、「form」という連想配列に格納しています。連想配列については後述しますが、ここでは $form{"name属性の値"} という変数にそのname属性に対応したフォーム部品の値が入る、と覚えておいてください。
コンニチハ、 $form{"namae"} サン。
ここでテキスト入力フィールドの値を表示しています。$form{"namae"} にはform1.htmlでテキスト入力フィールドに入力した値が入ります。
前ページ CGI(Perl)の基本と掲示板作成 TOP 次ページ
このエントリーをはてなブックマークに追加 そっか0

このページに関するコメントをどうぞ

お名前:


あやか
サーバに送信しましたがサーバーエラーが出ます。
2016/08/24 23:35

キライ
URLに「サーバアドレス/~自分のID/cgi/counter.cgi」とありますが、
/~自分のID/とはユーザー名でいいのでしょうか?どうもうまくテストができません。
2016/08/24 23:07

あすか
ご指摘通りにアップしましたが505エラーが出ます。
確認ください。
ttp://n-h.x0.to/cgi/bbs1.cgi
2016/08/24 23:07

サンドバック
perlで動く掲示板を探していて辿り着きました。
現在正しく動いています。

早速ですが、追加してほしい要素があります。

・過去ログの保存
・過去ログからの文字列検索
・画像の添付、表示

貴サイトの説明がとても分かりやすくて助かっています。
可能でしたら、よろしくお願いします。
2016/08/24 23:05

タニザキ
はじめてコメントします。
自分のサーバーに簡単なBBSを作りたくて探していたらこのサイトが見つかりました。
そこで目次に従い「ブラウザに文字列。。。」は旨く表示されましたが、その後は「※CGI もしくは SSI が正しく動作していません。」のエラーが出ます。どこがおかしいのでしょうか?
2016/08/24 23:05

あきこ
URLに「サーバアドレス/~自分のID/cgi/counter.cgi」とありますが、
/~自分のID/とはユーザー名でいいのでしょうか?どうもうまくテストができません。
2016/06/04 14:53

はるか
ご指摘通りにアップしましたが505エラーが出ます。
確認ください。
ttp://n-h.x0.to/cgi/bbs1.cgi
2016/05/15 21:32

はるか
サーバに送信しましたがサーバーエラーが出ます。
2016/05/15 21:05

サンドバック
perlで動く掲示板を探していて辿り着きました。
現在正しく動いています。

早速ですが、追加してほしい要素があります。

・過去ログの保存
・過去ログからの文字列検索
・画像の添付、表示

貴サイトの説明がとても分かりやすくて助かっています。
可能でしたら、よろしくお願いします。
2016/02/21 19:21

なかむら
プログラムがそのまま表示されます。
755にしましたが、実行されていない
ように思われます。
2015/10/13 16:45

残りを読む »