名簿CGI２

名簿CGI（画像・SS付き）

目的
　先の名簿作成CGIに以下の機能を追加します。
　　画像送信、表示機能
　　スタイルシートでレイアウトを調整可能
　　表示画像サイズの調整
　名簿編集
画像送信
1. 画像送信
  ファイル名を送るには、fileタグを利用します。以下のタグを表示すると、参照ボタン付きの文字入力ボックスが生成されます。参照ボタンを押すとファイル選択画面が表示されます。このとき、ファイル名は英数字とする必要があります。
```
 <INPUT type="file" name="file" size="50" >
```
  また、このタグを含む FORM タグは、method を POST 、enctype に multipart/form-data を指定します。
```
<FORM method="POST" enctype="multipart/form-data" action="./adrsBook2.cgi">
```
2. ファイル受信ライブラリ
  　ファイルが選択されると、ブラウザはファイルの内容をメールの添付と同様な形式（マルティパート）でバイナリ形式を文字に変換して送ってきます。CGIでこのデータを受け取り、画像に再構成するのに、CGI_Lite ライブラリを利用します。先頭で、ライブラリの利用を宣言します、
```
    use CGI_Lite;
```
  my $cgi = new CGI_Lite();で、CGI_Lite() クラスの実体を $cgi に作成し、画像を保存するディレクトリ、受信用バッファのサイズ、タイムスタンプ（日付）の有無などを設定します。parse_form_data(); で、受信データを解析（parse）し、ファイルを $UploadDir に配置し、そのファイル名を $form{'file'} に設定します。
```
 my $UploadDir="./img";
 my $BUFFER = 2048;
 my  $cgi = new CGI_Lite();
#画像のアップロードのための設定
  $cgi->set_directory("$UploadDir") || die &error;
  $cgi->set_platform("Unix");
  $cgi -> set_buffer_size($BUFFER);
  $cgi -> add_timestamp(0);
  $cgi->close_all_files; 
#FORM,画像受け取り
  my %form;
  %form=$cgi->parse_form_data();
```
  　CGI_Lite ライブラリ（CGI_Lite.pm）はインターネットからダウンロードできます。このライブラリは、mimew.pl と jcode.pl を必要とします。これらのファイルをダウンロードして、cgi のあるフォルダに配置してください。
3. 画像のサイズ
  　画像のサイズが大きいと、レイアウトが崩れます。画像のサイズを知り、横幅を250画素以下に調整します。require "imgSz.pl";　でソースファイルを読み込みます。&imgSz::getSize("$UploadDir/$file"); で $file のサイズを知ります。幅が 250以上のとき、幅を250に制限し、高さを調整します。imgSz.pl もインターネットからダウンロードできます。
```
  require "imgSz.pl";

  ($width,$height)=&imgSz::getSize("$UploadDir/$file");
  if($width > 250) { #幅が250以下になるようサイズ調整　
       $height =int( $height * 250/$width);
        $width=250; 
   };
```
  imgSz（imgSz.pl）はインターネットからダウンロードできます。
ソース
1. cgi：adrsBook2.cgi
  ここに、cgi のソースファイルがあります。先頭で　hidden で渡される、mode の値にしたがい、record（登録）、view（表示）、edit(編集)処理を行う関数（サブルーティン）を呼び出します。
```
  if($form{'mode'} eq 'record') {&record();} #ファイルに保存
  if($form{'mode'} eq 'view') {&view();} #名簿を表示
  if($form{'mode'} eq 'edit') {&edit();} #編集
```
2. record
  　必須項目の入力がない場合、入力を要請します。クッキーを利用して入力を保存しておくと、入力時に直前の入力を再利用できます（ここでは省略しています）。パスワードが一致するかチェックします。
  　名簿ファイルを読み込み、ファイルの項目が登録する学籍番号より大きくなったら、その前にデータを登録します。登録完了メッセージを出して終了します。
3. view
  　パスワードが一致するかチェックします。ファイルから項目を読み取り、テーブル形式で表示する HTML を生成します。このとき td タグに対するスタイルを設定します。これだけでも、すっきりした表が出力できます。
```
  print qq(<STYLE>\n\n</STYLE>);
```
4. edit
  $form{'no'} で、編集する　ファイルの項目の番号が渡されます。ファイルから、同じ番号の項目を読み取り、現在の値を表示します。入力された値を、record に引き渡します。
5. 実行
  　この cgi は、起動用 html なしで直接起動できます。
```
<A href="adrsBook2.cgi?mode=edit">名簿表示・編集</A>
```
  　実行するには、cgi のあるフォルダに、$UploadDir で指定するディレクトリ（img）を作成し、w 許可を設定しておく必要があります。また、cgi のあるフォルダに名簿を保存するファイル adrsBook.txt を作成し、w 許可を設定しておく必要があります
発展
1. ブログ
  　画像と記事の登録、編集ができれば簡単なブログページが作成できます。カレンダを表示するプログラムを入手すれば、もっとブログらしくなります。
2. 検索
  　Ｐｅｒｌの正規表現を利用すると強力な検索が可能になります。登録記事から指定された内容を含む記事を検索、表示する機能を追加してください。
3. メール
  　サーバーのメール送信機能を利用すると、Perl でメール送信を行うことができます。選択したメールアドレスにメール送信を行う機能を追加してください。

目的

画像送信

画像送信

ファイル受信ライブラリ

画像のサイズ

ソース

cgi：adrsBook2.cgi

record

view

edit

実行

発展

ブログ

検索

メール