買い物かご 掲示板 メール DB 利用規定 FAQ サポートBBS


次(変数の設定と変更)
前(---)
必要なツール
最低限必要な知識
Make CGI Top
Basic

Home



CGI内のHTML --最低限必要な知識--


HTMLタグを修正する

■CGIを改造する上で知っていなくてはならないこと

CGIを改造するためには、少なくとも基本的なHTMLタグの知識を持っている必要があります。ホームページをツールのみで作成している人は、タグを知らないことが多いですし、ある意味知る必要がないわけですが、CGIを改造しようとするからには、最低限HTMLタグは知っておいてください。

CGIをプログラミングするツールとしてはPerlが最も代表的です。私もPerlでプログラミングしています。Perlは、CやVB、Javaとは異なり、コンパイルする必要はありません。メモ帳などのエディタで作成したソースコードを、そのままパーミッションを755にしてサーバーにアップロードしてあげれば、動作します。

ここでは、CGI内で表示されるHTMLのデザインを変更する方法と、Perl Editorを使って、CGIでHTMLを自動生成する方法を説明します。

■CGIソースコード内にHTMLのタグを書きこむには。

いままで、CGIソースコードの初期設定しか見たことがないという人も多いでしょう。それ以降は、見てもわからないし、手元が滑って、何かの文字を消してしまったら、二度と動かなくなる、そんな不安に刈られて、鬼門のごとく避けてきたかもしれません。

しかし、ルールさえ理解してしまえば、それほど恐ろしいものでもありません。守るべきルールは以下の通りです。


1.「\」「\n」「;」

「\」「\n」「;」などの記号は、CGIスクリプトを動かすうえで重要な意味を持つ記号です。CGIソースの中で、

print "<font size=\"2\" color=\"#FF0000\">こんにちは</font>\n";

のような文をあちこちで見かけることでしょう。そして、HTMLのタグを知っている人なら、この文が何を意味しているのか、うすうす理解できるのではないでしょうか?

そう、この文は、CGIの中で「<font size="2" color="#FF000000">こんにちは</font> 」を表示させるための文なのです。

CGI内でHTMLのタグを使う場合は「print」文を使います。
print "<font size=\"2\" color=\"#FF000000\">こんにちは</font>\n";
は、ブラウザに、フォントの大きさが2で、赤色の「こんにちは」という文字を表示せよ。という指示を出しているわけです。

ところが、純粋なHTMLタグにはない、\やら\nやら;やらの記号が混じっていますね。これらの記号を無視すると、CGIはサーバーエラーを起こして表示してくれません。

print "<font size="2" color="#FF0000">こんにちは</font>

と書いた場合は、 サーバーエラーとなってしまうのです。

「\」「\n」「;(セミコロン)」は次の意味を持っています。

\ CGIを構成するPerlが利用する命令記号をエスケープする記号。
エスケープとは、文字通り「逃げる」という意味で、\記号を"など、Perlが使用する記号の前につけることで、「この"はただの文字に過ぎません。特別な意味は持ちませんよ」と教えているのです。
\n 「改行」を意味する記号です。「\」がついていますが、この場合はエスケープ記号ではありませんので注意してください。
; 文の終わりを意味する記号です。

ということは・・・

print "<font size=\"2\" color=\"#FF0000\">こんにちは</font>\n";

で、「こんにちは」の文字の色を赤から青に変えたいのなら、

print "<font size=\"2\" color=\"#0000FF\">こんにちは</font>\n";

\"#FF0000\" を \"#0000FF\" に変えてあげればいいことになります。

テーブルの色を変えたり、文字揃えを中央寄せにしたりする場合も同様に、「\」「\n」「;」を削除しないように注意しながら、該当するタグを変更します。


2.「$」
さて、フォントの色や大きさを変えることができたところで、もう少し、CGIのソースコードをたどってみましょう。

あちこちで「$」で始まる文字を目にするでしょう。「$」は文字通り「ドル記号」 と読みます。もちろんお金のことではありません。Perlで「変数」を意味する記号です。

スクリプトの初期設定を見てください。

#送信するメールアドレス
$mailto = 'xx@xxx.ne.jp';

のように、頭に$のついた文字があるはずです。たまに@や%のついた文字も目にすると思いますが、今回は$にターゲットを絞ります。

この$mailtoは、以下のように使われています。

print "<a href=\"mailto:$mailto\">メール送信先</a>\n";
となり、ブラウザ上では、
<a href="mailto:xx@xxx.ne.jp">メール送信先</a>
に置きかえられて、あなたにメールを送信できるようになるのです。


配布用のスクリプトの場合は、あらかじめ初期設定でユーザーごとに変更される可能性のある文字や数字などを「$」記号のついた変数に割り当てることで、該当する個所を一気に変更してしまうことができるのです。

ということは・・・

HTMLのタグ部分を変更している途中で「$」で始まる文字が現れたら、その文字は絶対に消してはいけません。

消してしまった場合は、本来文字が表示される部分の変数が消えてしまったわけですから、当然、該当個所は空白になります。最悪の場合、サーバーエラーを起こして動作しなくなることもあります。


3.ヒアドキュメント

ソースコードの中で、

print <<"EOF";

HTMLタグ




EOF

を見ることもあるでしょう。この、print <<"EOF"; で始まり、EOF で終わる文を、ヒアドキュメントと呼びます。print <<"EOF";とEOFの間には、面倒な\や\nや;やprint・・・を考えることなく、自由にHTMLタグを書きこむことができます。

なお、EOFは特定の文字でなくてはならないという決まりはありません。最初と最後の文字が同じであれば、何をつかってもかまいません。

print <<"POGI";

HTMLタグ




POGI

2.で指摘した、$で始まる変数部分に注意しさえすれば、ホームページ作成ツールで作ったソースをそのまま貼りつけても動作します。(たまにサーバーエラーを起こすことがあります。原因はほとんど不明なことが多いようです)

本来のソースにはない、独自の文章やイメージ画像などを付け加えたいときに利用しましょう。

注意!

  1. print <<"EOF";の;(セミコロン)の後ろや文字と文字の間にスペースをいれないこと。
  2. ヒアドキュメントの終わりを意味する「EOF」は、必ず行頭においてください。
  3. ヒアドキュメントの終わりを意味する「EOF」の後ろに、文字やスペースをいれないこと。

これらの約束を守らないと、サーバーエラーを起こしてスクリプトが動作しません。


HTMLタグを生成する

次に、自分でHTML文書を生成してみましょう。ここでは「Perl Editor」を使います。

  1. 「Perl Editor」を起動すると、白紙の新規文書が表示されます。この状態で、メニューバーの「定型文」-「初期設定」をクリックします。

  2. 次に、「定型文」-「HTML出力」をクリックします。

  3. ファイルを名前をつけて保存します。保存先は、AN HTTPDの「cgi-bin」フォルダ内です。ファイル名はなんでもかまいませんが、ここでは「test.cgi」とします。

  4. jcode.plを用意します。jcode.plは「test.cgi」と同じ場所に置くこと。

  5. AN HTTPDが起動しているかを確認します。次にブラウザを起動し、アドレスバーにhttp://127.0.0.1/cgi-bin/test.cgi と入力します。

  6. 薄緑色の背景で、上部に短めのラインが表示されましたか?
    表示されたら成功です。

次に、

print "<hr width=40\%><br>\n";

print "</body></html>\n";

の間にprint文を使ってHTMLタグを書いて見ましょう。ヒアドキュメントを使ってもかまいません。

完成したら上書き保存して、確認しましょう。サーバーエラーで表示できない場合は、もう一度このページの上へ戻って、注意点をおさらいしましょう。

スクリプトの初期設定を変更して背景色を変更したり、文字色やリンク色を変更してみましょう。

勘の鋭い方は、自分で変数を設定して文字や色などを変化させて見ましょう。



Web寺子屋 OGIPOGI E-mail:info@web-terakoya.net
Copyright© 2000-2001 OGIPOGI All Rights Reserved.