§５　Webシステムの設計

■パンダクイズの概要

(1)３問の中からランダムに１問のクイズを表示する。 (2)不正解の場合、「残念でした」のページを表示して終了する。 (3)正解の場合、プレゼント応募のフォームを表示する。 (4)プレゼント応募のあて先などをサーバーに保存する。 (5)締切後に応募者の中から当選者１名を決める。

■サンプル画面
お客さまからの要望を元にサンプル画面を作成する。レイアウトは仮で入力項目やクリックするボタン、表示する項目が確認できる程度でよい。
・クイズTOP ・問題 ・正解・応募フォーム ・不正解 ・応募ありがとう

■画面遷移図を書く

サンプル画面とお客さまの要望を元に、ナビゲーションや画面の流れを確認するための画面遷移図を作成する。四角のボックスに画面のタイトルを記入して、画面間を矢印で結ぶ。

■システム機能図を書く

どの画面でどのようなCGIが必要か検討するために、画面遷移図にCGIを書き足してシステム機能図を作成する。CGIは四角の両側に縦線を書いたボックスとし、画面と区別する。ボックスの中にCGIの名称を記入する。

■画面項目を決める

システム機能図の画面からCGIのボックスに出ている矢印上へCGIに送る画面項目を記入する。項目名以外にnameの名前、文字数などの制限事項も記入する。

■CGIが表示する項目を決める

システム機能図のCGIから画面のボックスに出ている矢印上にCGIが表示する画面項目を記入する。

■機能を考える

CGIのボックスに、主な機能、注意事項をシステム機能図のCGIのボックスに吹き出しなどを使ってで記入する。

■ファイルの項目を決める

CGIが読み込んだり書き出したりするファイルのレイアウト決める。 ファイルレイアウトとは、項目名、型、文字数、項目の順番などである。

ファイルレイアウトの固定長vs可変長 固定長のファイルレイアウトとは各項目の長さを決め、１件のデーターの長さを固定する方法。 長さに満たない項目は空白などで補って決められた長さにする。 C言語やCOBOL言語では処理効率が良いので使われているが、perlで扱うとプログラムが少し複雑になる。 可変長のファイルレイアウトは、項目同士を区切る記号を決めて項目の長さを決めない方法。 １件ずつのデーターの区切りは改行を使うことが多い。 区切り記号は\t(タブ)や,(カンマ)が使われることが多いが項目のデーターに区切り記号の文字が含まれないように気をつけること。 もともと可変長の文章を扱う言語として作られたperlでは得意とする処理である。 ただし、途中のデーターだけを取り出したり、一部を変更したり、 逆からデーターを取り出したりすることは苦手である。

■ディレクトリ構成を決める

HTML、画像、CGI、データーファイルを置くディレクトリ構成を決める。CGIが出力するHTMLの中で画像を使う場合などディレクトリ位置をプログラムの中に記述したり、HTMLの中にリンクを書いたりするので あらかじめ決めておくとプログラム作成がスムーズに進む。

ページを跨ってデーターを渡すには? ▼hiddenでhtmlのページに埋め込む ・やりとりするデーターの量が多くなる。 ・パスワードなど見られてはいけないデーターも見られてしまう。 ・プログラム的には手軽な方法である。 ▼クッキーを使う ・やりとりするデーターの量が多くなる。 ・クッキー未対応のブラウザや、利用しない設定になっている場合に対応できない。 ▼サーバーのファイルを使う ・IDをhiddenやクッキーで扱い、それ以外のデーターをサーバーに一時的に保存して使う。 ・やりとりするデーター量が少なくなるし、データーを保護できる。 ・処理の最後で一時的なデーターを削除するが、途中で操作をやめた場合不要なデーターが残ってしまう。