Code.002 2002年10月14日発行
■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━■
【 Webプログラミング 】
〜 猫的プログラマーとその軌跡 〜
■━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━■
▼毎週月曜日に配信しています。
▼等幅フォントでご覧いただくとキレイに見えます。
▼登録・解除はこちらから可能です。
< http://www.ichikoro.com/webp/ >
※ぜひお友達にもご紹介ください(^^)/
先週の土日は泊りがけでmotoGPの観戦に行ってきました。
TVで流れたのは「MotoGPクラス」だったと思うのですが、今回は250CCが熱かった！
目の前を加速しながら通り過ぎていく様子はなかなかの快感。その場でドラマを
感じることが出来るのがライブ(生)のいいところ。途中疲れて寝そうになる物の(^^;、
抜きつ抜かれつな様子を見るのはドキドキ。作られたストーリーじゃない、という
のもまた魅力でしょうか。
ちなみにバイクで行くとレースが終わった後、サーキットを全員でパレードラン！
何と走れます！ 来年はあの中に入るぞと心に決め、帰ってきました。
いやー、楽しかった。
・2002MotoGP 世界選手権シリーズ第13戦
http://www.twinring.jp/event/moto_gp/index.html
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
CGI(Perl)基本動作 その2：「クエリーを受け取る」
──────────────────────────────────────
CGIへ渡される情報のことを「クエリー(Query)」と呼びます。
今回はこのクエリーをCGIへ渡し、受け取るまでを解説します。
───────
ソース1(HTML)
───────
<HTML>
<HEAD>
<TITLE>クエリーを受け取る</TITLE>
<STYLE type="text/css"><!--
/*-- DDタグの装飾 --*/
DT {font-weight:bold}
-->
</STYLE>
</HEAD>
<BODY bgcolor="#FFFFFF">
<H2 align="center">クエリーを受け取る</H2>
<DL>
<DT>■リンクから</DT>
<DD><A href="query.cgi?q=Hello">リンクから</A><BR><BR></DD>
<DT>■FORMタグから</DT>
<DD>
<FORM action="query.cgi">
<INPUT type="text" name="q" value="Hello">
<INPUT type="submit" value="FORMタグから実行(GET)">
</FORM>
<BR>
</DD>
</DL>
</BODY>
</HTML>
───────
ソース2(CGI)
───────
#!/usr/bin/perl
;#
;#クエリーを受け取る(query.cgi)
;#
use strict;
#==================================================#
# メインルーチン #
#==================================================#
package main;
{
my $query;
#--------------------------------#
# クエリーを受け取る #
#--------------------------------#
$query = $ENV{'QUERY_STRING'};
#--------------------------------#
# 表示する #
#--------------------------------#
print "Content-type: text/plain\n\n";
print $query;
#--------------------------------#
# 正常終了 #
#--------------------------------#
exit(0);
}
───────
実行方法
───────
テキストエディタ(メモ帳やSimpleText)などで上記のソース(プログラム)を
保存してください。ソース1は適当な名前(xxxx.html)でOKです。ソース2は
「query.cgi」とすると、HTMLを変更せずにすみます。
CGIの詳しい実行方法については、前回のメルマガをご参照ください。
http://backno.mag2.com/reader/BackBody?id=200210050820000000080329000
リンクの場合“query.cgi?”以降の文字を色々と変更し、実行してみてくだ
さい。FORMタグの場合、テキストボックスのnameやvalueを変更したり、ラジ
オボタンなどを追加したりすると楽しいですよ。
★重要！
このCGIはセキュリティーホールを含みます。
学習以外の用途には使用しないでください。
───────
解 説
───────
■CGIに値を渡そう！
Webサイトを作成していると、BBSやアンケートなどユーザーからの書き込
みや情報を受けつけたい場合があります。そんな時、CGIはどうやって情報
を受け取ればいいのでしょうか？
これには主に2つのやり方が考えられます。
(1)URLにクエリーを付加する
(2)FORMタグを使用する
どちらも最終的に得ることのできる値は同じです。
その時々によって、最適な物を選択してください。
※微妙に嘘をついていますが、そんなものだと思ってください。
■(1)URLの最後に値をつける
まずはリンクのパターンです。
書式的に言うと、
http://www.ichikoro.com/hoge.cgi?name=value ← '?'から後ろがクエリーです。
~~~~~~~~~~
というような形でファイル名の後ろに「名前=その値」という形で記述し
ます。ファイルとクエリーの境目には半角の“?”を使います。
複数の値を渡すには
name1=value1&name2=value2& ........ &nameN=valueN
というようにアンパサンド(&)で連結します。
この時に同じ名前を用いてもURL的には問題ありません。
例えば、投票CGIを作った時に
<H3>■好きなビールメーカーは？</H3>
<A href="http://www.hogehoge.com/vote.cgi?vote=asapi">アサピ</A><BR>
<A href="http://www.hogehoge.com/vote.cgi?vote=kyorin">キョリン</A><BR>
<A href="http://www.hogehoge.com/vote.cgi?vote=4tory">ヨントリー</A><BR>
何て感じで使うことができます。
ちなみにアンカーを併用する場合は
xxxx.cgi?name=value#top
といった具合に、アンカー名は最後に記述します。
これが意外と忘れがち(^^;
■(2)FORMタグを使用する。
FORMタグを使う場合は、基本的にそれぞれのタグのルールに従います。
正確な情報についてはW3Cのサイトをご覧くださいませ。
・HTML 4.01 Specification(英語)
17 Forms
http://www.w3.org/TR/1999/REC-html401-19991224/interact/forms.html
→の日本語訳
http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/interact/forms.html
とは言え、どんな感じになるのか、サクッと見てみましょう
<FORM action="実行するCGIのパス(URL)" method="GET|POST(次回解説)">
<!-- あらかじめコチラで固定の値をセット(ブラウザには表示されません) -->
<INPUT name="名前" value="値(もしくは初期値)" type="hidden">
<!-- ユーザーから値を入力してもらう -->
<INPUT name="名前" value="値(もしくは初期値)" type="text|password|checkbox|radio|file">
<TEXTAREA rows="幅" cols="高さ" name="名前">初期値</TEXTAREA>
<SELECT name="名前">
<OPTION value="値1">選択肢1</OPTION>
<OPTION value="値2">選択肢2</OPTION>
：
：
<OPTION value="値n">選択肢n</OPTION>
</SELECT>
<!-- 送信、リセットする -->
<INPUT type="submit|image" name="名前" value="値">
<INPUT type="reset" name="名前" value="値">
<INPUT type="button" name="名前" value="値">
</FORM>
“|”で区切られたものは、「いずれか」という意味です。
例えば
<INPUT type="submit|image">
とあった場合、
<INPUT type="submit">
or
<INPUT type="image">
のどちらかを選択できると言う意味です。
話を戻しましょう。このようにFORMを記述すると、submitボタンを押すことによって
<FORM> 〜 </FORM>の間のデータが、action属性で指定したCGIへ渡されます。ここで
CGIへ渡されるデータの形式は前述した(1)と同じです。
ちなみに、下のように
<FORM>
<FORM> </FORM>
</FORM>
FORMの中にFORMを書くことはできません。
またsubmitはFORMの中であれば、どこにあってもかまいません。
（最下部である必要はありません）
■CGI側での取得方法
今回のサンプルの場合、これらの渡した値は環境変数「QUERY_STRING」の中につ
まっています。
> $query = $ENV{'QUERY_STRING'};
といった具合に取得し
> print "Content-type: text/plain\n\n";
> print $query;
てな感じでそのまま表示しています(^^ゞ
実際に使うには、コイツに色々と処理をする必要がありますが、
今回はココまで。次回にご期待ください。
───────
次回予告
───────
今回紹介したやり方だと、あまり大量のデータを渡した場合にデータが途中で切れて
しまうといった、嬉しくないことが起こる場合があります。
そんなときにはPOSTで渡してやります。今回紹介したサンプルはいずれもGETです。
「GET？POST？？」という感じだと思いますが、それぞれが何を意味しているのか、
そもそも何かについて、次回解説したいと思います。
───────
分からない
───────
いまいちよく分からない場合は、以下へれっつらごー。
・サポートBBS
このメルマガ専用のサポート掲示板
http://www.ichikoro.com/webp/bbs/
・CGIプログラミングML
CGIなどWebに関する話題を繰り広げるメーリングリスト
このメルマガとは何の関係もありませんので発言時は注意を。
http://www.ichikoro.com/cgi/ml/
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
前回(Code.001)の補足 「IEにtext/plainを渡すべからず！」
──────────────────────────────────────
前回メルマガを配信した後に読者の方から
「実行するとダウンロード画面が出てきてしまいます。」
こんな質問がやってきました。
以下に、BBS上でお答えした内容を掲載します。
> IEでチェックされていらっしゃいますか？
> 実はIEくん、「text/plain」をそのまま表示せずに
> ダウンロード画面を出す場合があります。
>
> ・とほほのCGI入門
> http://tohoho.wakusei.ne.jp/wwwcgi4.htm
> ※「text/plain のわな(共通)」の項を参照ください。
>
> マイクロソフト的には「仕様」だと思われます(^^;
> そこで、IEで実行する場合は
>
> print "Content-type: text/plain\n";
>
> この行を
>
> print "Content-type: text/html\n";
>
> とすると上手く動きます。
> 注意書きが必要でしたね。
> 失礼しました。
>
> ただ、掲載したサンプルはCGIの仕様としては正しい物です。
> Netscapeなど他のブラウザでご覧になられると、期待通りに
> 動きます。
他にも質問やご要望は、ぜひ掲示板をご活用ください！
気付き次第、随時お答えいたします。
http://www.ichikoro.com/webp/bbs/
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
編 集 後 記
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
かなりの長電話好きです。
夜中に話し始め、そのまま朝日を拝むこともシバシバ。
しかし以前と比べて、ずいぶん安くなったとは言え通話料が高いのはつらいです。
先月も携帯だけで3万円近く(これに固定電話がプラスされると...)。毎月、月末の
請求書が怖いです(^^;
「その分楽しんでるからいいか。人生の必要経費や」
と思って過ごしていたのですが、先日ドコモの「ゆうゆうコール」を見た瞬間、
思わず申し込んでしまいました。どんなサービスかと言うと、
・あらかじめ指定した電話番号との通話を10％引き。
・指定した相手がドコモなら30％引き
ここまでなら普通のサービスなのですが、
・相手がドコモなら、相手に3分10円の無料通話をプレゼント
これに一番興味をひかれました。
お互い加入して、交互に掛け合えばかなりの割引です。かかってきた相手が
学生だったりすると、ついつい「大丈夫？かけなおそうか？」と気になって
しまうのですが、これなら罪悪感が減らせます（笑）
・ゆうゆうコール
http://www.nttdocomo.co.jp/p_s/charges/system/keitai/yuyu.html
そうそう、これらサービスの申し込みはiモードやWeb上から簡単に行うこと
ができます。
・iモード
iメニュー ＞ メニューリスト ＞ DoCoMoメニュー ＞ ドコモｅサイト
・Web
http://www.esite.nttdocomo.co.jp/
※最初にIDの発行が必要なのですが、これが郵送のため
ちょっと面倒。iモードならスグできます。
平日電話したりドコモショップに行くのって面倒なんですよね(^^;
というわけで、もっとお得な情報があったらみなさん教えてくださいね！
しばらく会っていないと、その人が生きているかどうか本当に不安になります。
上京して以来、随分と感じてきました。そんな時、声が聞けるだけで安心するん
ですよね。だから、なかなか会えない人だと話しているだけでうれしくて、つい
つい話込んでしまうんですよね。こんな気持ちを大事にしたいな、とインターネ
ットを使えば使うほど思います。
それでは、また来週お会いしましょう！ (^-^)/~~
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
【 Webプログラミング Code Sample 】
発 行 ： ichikoro.com
発行責任者 ： 勝部 麻季人
< katsube@ichikoro.com >
Webサイト ： < http://www.ichikoro.com/webp/ >
お問い合わせ先 ： < mm-webp@ichikoro.com >
Powerd by まぐまぐ
All Right Reserved, CopyRight(C) 2001 Webプログラミング Code Sample
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
