◆フォームを使ったデータを出力
実際に簡単なフォームから送られるデータの流れと、動作を確認していきましょう！input.htm(入力用HTMLファイル)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>入力してみよう</TITLE>
</HEAD>
<BODY>
<H3>入力してみよう(POST編)</H3>
<FORM action="output.cgi" method="POST">
お名前<INPUT type=text name="name"><BR>
性別<INPUT type=radio name="sex" value="男">
男 / <INPUT type=radio name="sex" value="女">女<BR>
<INPUT type=submit value="送信"> <INPUT type=reset value=クリア">
</FORM>
<HR>
<H3>入力してみよう(GET編)</H3>
<FORM action="output.cgi" method="GET">
お名前<INPUT type=text name="name"><BR>
性別<INPUT type=radio name="sex" value="男">
男 / <INPUT type=radio name="sex" value="女">女<BR>
<INPUT type=submit value="送信"> <INPUT type=reset value=クリア">
</FORM>
</BODY>
</HTML>
<HTML>
<HEAD>
<TITLE>入力してみよう</TITLE>
</HEAD>
<BODY>
<H3>入力してみよう(POST編)</H3>
<FORM action="output.cgi" method="POST">
お名前<INPUT type=text name="name"><BR>
性別<INPUT type=radio name="sex" value="男">
男 / <INPUT type=radio name="sex" value="女">女<BR>
<INPUT type=submit value="送信"> <INPUT type=reset value=クリア">
</FORM>
<HR>
<H3>入力してみよう(GET編)</H3>
<FORM action="output.cgi" method="GET">
お名前<INPUT type=text name="name"><BR>
性別<INPUT type=radio name="sex" value="男">
男 / <INPUT type=radio name="sex" value="女">女<BR>
<INPUT type=submit value="送信"> <INPUT type=reset value=クリア">
</FORM>
</BODY>
</HTML>
output.cgi(出力用CGIファイル)
#!/usr/local/bin/perl
$|=1; #データのフラッシュ
require './jcode.pl'; #jcode.plへのパス
print "Content-type: text/html\n\n"; # データ形式
# プラウザからのデータ取込み
if ($ENV{'REQUEST_METHOD'} eq "POST") {
read(STDIN, $buffer, $ENV{'CONTENT_LENGTH'});
}
else {
$buffer = $ENV{'QUERY_STRING'};
}
# プラウザからのデータ変換
$i = 0;
@pairs = split(/&/,$buffer);
foreach $pair (@pairs) {
#１行毎に$name,$valueを取り出す
($name, $value) = split(/=/, $pair);
# 変換演算子 tr + を スペースに置き換え
$value =~ tr/+/ /;
# 変換演算子 s/// 単語の構成文字にマッチ
$value =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg;
# タグ処理
if ($tag == 0) {
$value =~ s/</<\;/g;
$value =~ s/>/>\;/g;
}
else {
$value =~ s/<!--(.|\n)*-->//g;
$value =~ s/<>/<\;>\;/g;
}
# " を " に変換
$value =~ s/"/"/g;
#\n を "" に変換
# $value =~ s/\n//g;
# 日本語に変換(デコード処理部分)
&jcode'convert(*value,'sjis');
&jcode'convert(*name,'sjis');
$FORM{$name} = $value;
@num[$i]=$value;
$i=$i++;
}
##---------出力HTML------------
print <<"EOT";
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>出力結果</TITLE>
</HEAD>
<BODY>
<H3>出力結果</H3>
あなたのお名前は$FORM{'name'}さんです。<BR>
性別は$FORM{'sex'}です。<BR><BR>
あなたのお名前は@num[0]さんです。<BR>
性別は@num[1]です。<BR><BR>
</BODY>
</HTML>
EOT
exit;
$|=1; #データのフラッシュ
require './jcode.pl'; #jcode.plへのパス
print "Content-type: text/html\n\n"; # データ形式
# プラウザからのデータ取込み
if ($ENV{'REQUEST_METHOD'} eq "POST") {
read(STDIN, $buffer, $ENV{'CONTENT_LENGTH'});
}
else {
$buffer = $ENV{'QUERY_STRING'};
}
# プラウザからのデータ変換
$i = 0;
@pairs = split(/&/,$buffer);
foreach $pair (@pairs) {
#１行毎に$name,$valueを取り出す
($name, $value) = split(/=/, $pair);
# 変換演算子 tr + を スペースに置き換え
$value =~ tr/+/ /;
# 変換演算子 s/// 単語の構成文字にマッチ
$value =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg;
# タグ処理
if ($tag == 0) {
$value =~ s/</<\;/g;
$value =~ s/>/>\;/g;
}
else {
$value =~ s/<!--(.|\n)*-->//g;
$value =~ s/<>/<\;>\;/g;
}
# " を " に変換
$value =~ s/"/"/g;
#\n を "" に変換
# $value =~ s/\n//g;
# 日本語に変換(デコード処理部分)
&jcode'convert(*value,'sjis');
&jcode'convert(*name,'sjis');
$FORM{$name} = $value;
@num[$i]=$value;
$i=$i++;
}
##---------出力HTML------------
print <<"EOT";
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<HTML>
<HEAD>
<TITLE>出力結果</TITLE>
</HEAD>
<BODY>
<H3>出力結果</H3>
あなたのお名前は$FORM{'name'}さんです。<BR>
性別は$FORM{'sex'}です。<BR><BR>
あなたのお名前は@num[0]さんです。<BR>
性別は@num[1]です。<BR><BR>
</BODY>
</HTML>
EOT
exit;
上記の二つのファイルとjcode.plを同一フォルダ内にアップロードして下さい。
例：
| フォルダ | ファイル名 | パーミッション |
| cgi-bin/ | 777 | |
| / | input.htm | 644 |
| / | output.cgi | 755 |
| / | jcode.pl | 644 |
とにかく実際にアップロードしてみて確かめてください。上手く出来た人は、POSTとGETの時の違いを見てみると良いでしょう。またFORMをいろいろと変化させてアレンジしてみるのも練習になると思います。とにかくいろいろ自分なりに弄くってみることが、成長の第一歩だと言うことを忘れないで下さいねo(≧▽≦)o
□初級編 プログラミングに入る前に
| 第四章 Perlでよく用いられる記号たち | |
| ・変数・配列 | プログラミングって?変数と配列って? |
| ・演算子・比較演算子 | 演算子の紹介と文字化け |
| ・コメント・簡単な命令文 | コメントの重要性と命令文の種類 |
| 第五章 データを受け渡してみよう | |
| ・POSTとGET | フォームからのデータ受取 |
| ・デコード方法 | デコードって?ライブラリの使用 |
| ・jcode.pl | jcode.plって何? |
| ・出力させてみよう<< | フォームを使ったデータを出力させてみる |
| 第六章 プログラムの中身って？ | |
| ・繰り返し文 | for文、foreach文、while文の使い方 |
| ・条件分岐 | if文の使い方、パターンマッチについての説明 |
| ・サブルーチン | なにものだ?!利用方法を説明 |
| ・ファイルの入出力 | 外部ファイルの読み込み書き出しについて |
| 第七章 改造してみよう！ | |
| ・文字や画像の差し替え | まずは簡単なところから |
| ・レイアウトの変更 | 駄目元でもいいからやってよう |
| ・やってはいけないこと、エチケット | 守ってね♪ |