1

Web アプリケーション 開発方法の考察

平成 21 年 1 月 31 日

花川ゼミ

5105013 飯田あゆ美 5105136 髙島麻代

2

―目次― 第１章 はじめに ･･････････････････････････････････････････････････P.3 第２章 関連研究････････････････････････････････････････････････････P.4

2-1.Web アプリケーションとは････････････････････････････････････P.4 2-2.フレームワークとは･･････････････････････････････････････････P.4 2-3.MVC モデルとは･････････････････････････････････････････････P.5 2-4.クライアントサイド･アプリケーションとは･････････････････････P.5 2-5.サーバサイド･アプリケーションとは･･･････････････････････････P.5 第３章 Struts について･････････････････････････････････････････････P.7

3-1.Struts とは･･････････････････････････････････････････････････P.7 3-2.Struts の特徴と構造･･････････････････････････････････････････P.7 第４章 Struts の検証･･･････････････････････････････････････････････P.7 第５章 CGI について･･････････････････････････････････････････････P.13

5-1.CGI とは･･･････････････････････････････････････････････････P.14 5-2.CGI の特徴と構造･･･････････････････････････････････････････P.14 5-3.CGI の仕様･････････････････････････････････････････････････P.16 第６章 CGI の検証････････････････････････････････････････････････P.19 第７章 考察･･････････････････････････････････････････････････････P.22

7-1.Struts のメリット･･･････････････････････････････････････････P.22 7-2. Struts のデメリット･････････････････････････････････････････P.22

7-3. CGI のメリット･････････････････････････････････････････････P.23 7-4. CGI のデメリット･･･････････････････････････････････････････P.23 7-5. Struts と CGI の比較････････････････････････････････････････P.23 第８章 おわりに･･････････････････････････････････････････････････P.25 参考文献･･････････････････････････････････････････････････････････P.25 謝辞･･････････････････････････････････････････････････････････････P.26

3

第 1 章 はじめに

近年、インターネットを閲覧すると様々な Web アプリケーションを目にする機会が多く

なってきた。掲示板やオンラインショッピング、本学が提供している HInT システムもそ

の一つである。これらは従来の Web ページのような HTML 文を作成し、その情報をブラ

ウザを経由して読み込むだけではなく、状況等により情報が変わる等のブラウザにてアク

セスできるアプリケーション、つまり Web アプリケーションへと時代は変わりつつある。

Web アプリケーションの最大の特徴は、PC に一台一台にソフトウェアを導入しなくてもブ

ラウザソフトが導入されていれば、プログラムが実行可能である点にある。近年 Web アプ

リケーションで最も有名なものが楽天市場等のオンラインショッピングであるが、他にも

様々な分野で Web アプリケーションが利用されている。例えば本学ならばネット学習が導

入されている。これはクライアント PC 等のブラウザからアクセスする事で学生がテストや、

課題提出等の様々な学習支援を行う事が可能になる Web アプリケーションである。これに

より、PC の管理者が PC 一台一台に専用ソフトを入れる必要がなくなる。その他にも、教

員の授業への負担を軽減、学生が自宅から本日の講義の復習、または予習等ができる Webアプリケーションとなっている。このようにオンラインショッピング等の商用目的で使用

される事が多かった Web アプリケーションが学習目的の Web アプリケーションサービス

の提供を行う事も珍しくなくなってきたのが近年である。 しかし、このような Web アプリケーションを開発するには様々な知識と技術が必要とさ

れる。理由としてブラウザを経由する事にある。ブラウザとは基本的に HTML を解釈する

機能（一部スクリプト言語が実行可能）しか搭載されていない。そのため例えば簡単なメ

ッセージを吐き出すだけでも HTML 文と CGI プログラムの両方を理解する必要がある。

更にオンラインショッピング等になればユーザが操作しやすい GUI の作成の他、商品等の

データを保持しておくデータベースシステムが必要となり、これらを統合するプログラム

も必要となってくる。このように Web アプリケーションの開発は通常のアプリケーション

開発を行う場合と異なり様々な知識が必要となる。そこで、複雑な Web アプリケーション

を容易に開発する為のStrutsや JSFなどのフレームワークを用いた開発方法論が提案され、

利用されている。これにより、Web アプリケーションの知識が無い開発者が開発しても、

容易に作業を進める事ができる他、大規模な Web アプリケーションの開発においても作業

の分担を容易にする事ができる。しかし、Web アプリケーションの専門知識が殆ど無いに

も関わらず開発を行うため、かえって Web アプリケーションの開発が困難となる場合も想

定される。 そこで、実際に Struts フレームワークを使用し、Web アプリケーション開発を行った。

これに伴い、全くフレームワークを使用せずにテキストエディタ等だけで同様の Web アプ

リケーションを構築する。これにより、開発者の観点からフレームワークを使用した場合

の長所と短所、使用しない場合の長所と短所についての考察を行う。

4

２章では関連研究を記す。３章では Struts について述べ、４章では実際に製作した Webアプリケーションの解説を交えながら Struts の検証を行う。５章では CGI について述べ、

６章では CGI を使用した方法での Web アプリケーションの解説と検証を行う。そして、７

章では二つの方法を比較して考察を述べる。最後に、８章で考察を終えての感想と今度の

課題について述べる。

第 2 章 関連研究

2-1.Web アプリケーションとは Web ブラウザからのリクエストによって動的なコンテンツを提供するアプリケーション

を指す。クライアントに Web ブラウザがインストールされていれば、ネットワークに接続

されているあらゆるクライアントにアプリケーション機能を容易に提供できる為、爆発的

に適用範囲が増えている。クライアントとなるブラウザは Web サーバに対しリクエストを

投げ、これに対してサーバが動的にコンテンツを生成し、クライアントにコンテンツを提

供する。Web ブラウザに動的な Web ページを提供する代表的な方法には、CGI など古くか

ら使われている技術に加え、サーバサイド Java と呼ばれる技術が存在する[1]。図 1 に Webアプリケーションである阪南大学教育システム Hint の例を示す。 また、Web アプリケーションには、プログラム自体をサーバからクライアントに送信し

てクライアント側で実行するものと、サーバの側でプログラムを実行してクライアントに

はその結果だけを返すものとがある。前者の事をクライアントサイド・アプリケーション

と呼び、後者をサーバサイド・アプリケーションと呼ぶ[8]。これらは 2-4、2-5 で詳しく記

述する。

2-2.フレームワークとは フレームワークという言葉は現在、プログラミング以外の世界でも「枠組み」という意

味合いで広く使われている。しかし、プログラミングの世界では「アプリケーションの土

台として機能するソフトウェア」の事を示す[1]。 そもそも Web アプリケーションで必ず必要となる「入力の受け取り」や、「入力が正しい

図 1.阪南大学 HIｎT システム

5

かどうかの検証処理」などの作業は大体どの Web アプリケーションでも似たような処理と

なり、開発者が独自のコードを記述して実装する必要性は無い。そこで、これらの定型処

理のコーディング部分をフレームワークに任せる。そうする事で、開発中の Web アプリケ

ーションの独自に必要とされる部分だけを開発すれば済む為、開発効率の向上が見込める

のである。 2-3．MVC モデルとは ソフトウェアの設計モデルの一つで、処理の中核を担う「Model」、表示や出力を扱う

「View」、入力を受け取ってその内容に応じて View と Model を制御する「Controller」の

三要素の組み合わせによってシステムを実装する方式の事を示す。それぞれの頭文字を取

って MVC モデルと略して称される。 主に、メインの処理は Model に実装し、Model は画面出力などは行わない。処理結果は

View に渡され、そこで画面表示などが行われる。ユーザからの入力は Controller が受け取

り、何らかの処理が必要な場合は Model に依頼し、出力が必要な場合は View に依頼する。 このように明確に機能ごとに分離する事で、開発作業の分業が容易となり、また互いに仕

様変更の影響を受け難くて済むようになる[1]。 2-4．クライアントサイド・アプリケーションとは HTML を介して Web サーバ上に保存されたプログラムをクライアントに送信し、クライ

アントの CPU で実行するタイプの Web アプリケーションを指す。Web サーバはプログラ

ムを送信するだけなので負担が軽くなるという利点を持つが、その反面でアプリケーショ

ンの処理速度がクライアント CPU の能力に依存するという欠点も持ち合わせる[7]。 2-5．サーバサイド・アプリケーションとは クライアントからの要求に従ってプログラムを Web サーバのメモリに読み込み、Web サ

ーバのCPUで実行し、処理結果がHTMLを介してクライアントに送信されるタイプのWebアプリケーションを指す。クライアントは、処理結果となる HTML ファイルを受け取るだ

けとなる為、クライアントによって処理速度に違いが出る事は殆ど無いという利点を持つ

が、その反面で Web サーバに負荷が集中するという欠点も持ち合わせる[7]。

第 3 章 Struts について

3-1.Struts とは Strutsとは、Craig R.McClanahan 氏によって作成され、2000 年に The Apache Software Foundation の Jakarta Project に寄贈された Web アプリケーション向けの、MVC モデル

に基づいたフレームワークである。寄贈された後も同プロジェクトに於いて様々な改良が

重ねられ、2004 年 3 月 18 日には The Apache Software Foundation の TLP（Top Level Project）となった。今では、J2EE（Java2 Enterprise Edition）で Web アプリケーション

構築する際のフレームワークとして最もポピュラーなものの一つになっている。

6

また、Struts は Apache Software License というライセンスに基づいて公開されており、

誰でも自由かつ無償で利用・改変・再配布できる[3]。図 2 に The Apache Software Foundation のロゴマークを示す。

3-2.Struts の特徴と構造 Struts を使って Web アプリケーションを作成する場合、Struts のフレームワークに用意

されている部品を必要に応じて準備していく作業が開発の基本である。その Struts を構成

する重要な要素が以下のものである[2]。図 3 に Struts の構造と処理の流れを表したものを

示す。 ① ActionServelet

Struts における Web アプリケーション全体の制御を行う部分。元々Struts に用意さ

れているので、プログラマが自分で作成する必要は無い。 ② JSP

クライアント側に表示するGUIの部分は JSPを使う。但し、通常の JSPとは異なり、

Struts に用意されている専用のカスタムタグを使って作成される。専用のタグを使う事

によるメリットは、これを元に HTML を独自にレンタリングすることが可能となる点

である。 ③ ActionFormBean

表示用 JSP から送信されたフォームの情報を管理する為の部分。Struts では、送信

された情報は全て対応するアクションフォームに保管される。この値は外部から読み書

きする事が可能で、次に JSP を表示する必要が生じた際には、保管された値を元にペ

ージが構築される。 ④ ActionClass

送信された際の処理を担当する部分。アクションクラスには、実行する処理をまとめ

たメソッドが定義されており、表示用 JSP からフォームが送信されると対応するアク

ションクラス内のメソッドを呼び出して処理を行う。

図 2. The Apache Software Foundation のロゴマーク

7

以下に、Struts フレームワークの手順を示す。

① Client からの要求を ActionServlet が受け取り、処理のフリー制御を行う。 ② ActionMapping にアクセスし、記された内容に従ってページ遷移を行う。

(Mapping など処理のフロー制御に関する情報は、StrutsConfig.xml に予め開発者

が記述しておく必要がある。) ③ Client によって入力された値がある場合、ActionFormBean にアクセスし、値を

格納する。(例：氏名やログイン ID など) ④ ActionClass にアクセスし、その中に記されたコード内容に沿って情報の処理が行

われる。 ⑤ 必要とされる JSP ページが生成される。 ⑥ Client に JSP ページが送信される。 ※StrutsConfig.xml などの例は、次章――『Struts の検証』を参照。

第 4 章 Struts の検証

この章では、実際に著者が製作したプログラムに基づいて、Struts の大まかな流れや仕

組みについて紹介する。作成したプログラムの内容は、簡単に説明すると選択問題の回答

結果を集計し、それをグラフ化して表示するというものである。図 4に回答結果グラフ表

示までの一連の流れを表すイメージ図を示す。

図 3.Struts の構造と処理の流れを表したもの（CCRAFT Corporation より転載）

8

注）青色の表示は実際に表示される画面、赤色はプログラム上での処理作業を示している

プログラムと表示される画面を用いて、それぞれの解説を行う。図 5に StrutsConfig.xmlを示す。

① StrutsConfig.xml の作成 一番始めに行うプログラミング作業が、Mapping など処理のフロー制御に関する情

報を StrutsConfig.xml に記述する事である。予め登録されているタグの中に、遷移す

る為に必要な情報を入力していくのである。各属性の意味は以下の通り[4]。 <form-bean>

・ name: フォーム Bean の名前。名前は任意に指定したもの。 ・ type: 登録するフォーム Bean のクラス。(FQCN で指定) <action-mappings> ・ path: リクエスト時のパスの名前。 ・ type: 実行するアクションクラスのクラス名。(FCQN で指定) ・ name: 使用するフォーム Bean の名前 ・ scope: フォーム Bean を保存するスコープ。

(application,session,request,page のいずれか)

図 4.回答結果グラフ表示までの一連の流れ

9

② 問題ページの表示 最初にクライアント側の画面に表示されるのが、この問題ページである。ここに表示さ

れる問題は選択問題になっており、自らが正しいと思った項目のラジオボタンをチェック

する事で解答を行うことができる。 そして、選択された解答に対応する値(value)が送信され、その値はデータベースに格納さ

れる。例えば、”太陽”を選択した場合、対応する値である”2”が送信されてデータベースに

格納される事になるのである。今回は、My SQL データベースを使用した。図 6 に問題ペ

ージの表示画面を、図 7 に問題ページの JSP を、図 8 にデータベースに格納する為のコー

ドを、それぞれ示す。

図 5. StrutsConfig.xml

10

※ 行番号 23～26 が、それぞれの解答に値を対応付けている。 (property="radio"は、ラジオボタンを使う事を示し、 value="1"が木星の値を示す)

※ 行番号 29 が、送信ボタンを示している。

※ 行番号９が、送信された値をデータベースに書き込む処理を示している。

(該当テーブルに、送信されてきた学生 ID と選択された解答の値を書き込む)

③ 正否の判断を行い、結果を表示する

次に表示されるのが、解答結果が正しいのか間違っているのかを解答者に伝えるページ

である。例えばこの場合、「夜に見える天体はどれ？？」という問題なので、正しい解答で

ある「月」を選択した場合なら正解を伝える文が表示され、間違った解答である「木星」

や「太陽」などを選択した場合には不正解を伝える文が表示される事になる。 コードの内容は単純で、送信された値が”3”であるならば正解、それ以外の値が送信され

図 7.問題ページの JSP

図 8.データベースに格納する為のコード

11

てきた場合は不正解と表示するように記している。図 9 に解答ページの表示画面を、図 10に正否判断を行うコードを示す。

※ 行番号 19～24 までが条件分岐のコードとなっている。 ※ 行番号 19～20 では、送信されてきた値が”3”ならば、”正解です！”と表示させる。 ※ 行番号 23～24 では、送信されてきた値がそれ以外ならば、”不正解”と表示させる。

④ グラフの表示 解答結果のグラフ表示は、まずデータベースに格納されている値を取り出す事から始ま

る。次に、予め用意しておいた画像データを使用し、回答数に応じて特定の長さづつ横に

図 9..解答ページの表示 (左が正解の場合、右が不正解の場合)

図 10..正否判断を行うコード

12

並べていく。図 11 にグラフ棒の表示の仕組みを、図 12 にグラフ表示画面を、図 13 にデー

タベースに格納した値を取り出すコード、図 14 に取り出した値をグラフ化するコードをそ

れぞれ示す。

図 11.グラフ棒の表示の仕組み

図 12.グラフ表示画面

13

※ 行番号 30～33 が、棒線の高さや幅などの設定を行うコード。

(例: String html1 は g1.jpg の画像を使用し、解答数×100 の幅で、24 ﾋﾟｸｾﾙの高さ)

第 5 章 CGI について

図 13.データベースに格納した値を取り出すコード

図 14.取り出した値をグラフ化するコード

14

5-1.CGI とは CGI とは、Common Gateway Interface の略称である。Web サーバがクライアント側か

らの要求に応じて、プログラムを起動させるための仕組みを指す[8]。本来、Web サーバか

ら外部プログラムを呼び出す方法の取り決めが CGI にあたるが、インターネット上ではこ

の仕組みを利用して作られたプログラム本体を CGI として扱う事も少なくない。また、CGIを使ったものとして有名なのが、掲示板、メール送信フォーム、アンケート、といった機

能で、それらはインターネットを利用する人の殆どが関わりを持つものである。 Web サーバにある文書ファイルを送信して表示させるだけの静的な Web ページから、

CGI は特定のプラットホームに依存しない動的なページを作り出すことができる。実際に

利用されている阪南大学 HInT システムログイン画面を例に挙げて、以下に説明する。図

15 に CGI の構造と処理の流れについて表すイメージ図を示す。

まず、Web ページにあるログインフォームに、仮に ID は ABC、パスワードを Pass と入

力し、OK ボタンをクリックしてデータを送信する。これで、クライアント側からの要求と

して、ABC と Pass は Web ページ内に書き込まれている情報として Web サーバに送られ

る。 次に、データを受け取った Web サーバは、動作すべき外部プログラム、つまり CGI プロ

グラムを判別してそのプログラムを起動させる。例えば Login.cgi が指定されていると、

Login.cgi プログラムへ ABC と PASS の文字列を引き渡す。Login.cgi プログラムはログイ

ン情報が格納されているデータベースを参照して ABC と Pass の正しさを確認し、かつロ

グインした個人を特定する。もし、データベース上の ID とパスワードと一致しなければ、

ログイン情報が誤りである旨のページの HTML の文字列を Web サーバへ返信するのであ

る。 最後に、Web サーバが送られてきた Web ページの HTML 文字列のデータをクライアン

トに渡し、返信結果がブラウザ上に表示される。したがって、ID とパスワードがデータベ

ースの情報と一致した場合、ログインが正常に認められ、特定された個人の専用ページに

遷移する。 5-2.CGI の特徴と構造 CGI はあくまでも Web サーバとのインタフェースの仕組みを指すので、外部プログラム

図 15．CGI の構造と処理の流れ

15

の使用言語は様々なものが使われている。今回は最もよく利用されている言語 Perl でコー

ドを記す。また、ブラウザに文字列を表示するだけの単純な例を使ったプログラムで解説を

行う。図 16 に Peal のテキスト表示コードを示す。 まず、Perl の基本的な決まり事として、命令の最後には必ず「；(セミコロン)」を使用す

る事になっている。

はじめに、行番号１で必ずパスを記入しておかなければならない。これは、Perl のイン

タプリタを使用して CGI プログラムを実行する為である。ここではインタプリタのある

/usr/bin ディレクトリを指定しているが、ディレクトリが異なる場合は、#!に続けてパスを

記入する。 次に、行番号３でヘッダー情報を書き込む。このヘッダー情報はprint関数で出力し、print

のすぐ後ろには出力データを示す。この出力データは「“”（ダブルクォート）」で囲み、こ

こでは content-type:test/plain¥n¥n のようになっているが、CGI ヘッダーと呼ばれる CGIの仕様で定められたものである。「今から送るのはどのようなものか」を明記し、ここでは

テキスト文書とした。また、ダブルクォート内の¥n は改行を意味し、空白行を設けるため

２つ記入している。

最後の行番号５は同じ print 関数であるが、実際にページで表示される内容である。

図 17 では、ブラウザ上に「Hello World !」だけが表示されており、実行すると我々が目

で確認できる部分である。以上のように、Perl で必要なパスと CGI ヘッダー情報を書き込

めば web ブラウザを通して CGI から外部プログラムを実行させることができ、非常に簡単

16

な文字列の表示だけでも CGI プログラムとなる。 5-3.CGI の仕様 CGI ではヘッダー情報、パラメータの渡し方、エンコード、環境変数の４つの仕様があ

る[9]。以下にそれぞれの説明をする。 (1) ヘッダー情報

以下の有効な HTTP ヘッダーを明記する。 ① Content-type

5-2 でも触れたが、ファイルデータがどのようなものであるかを示し、よく使われ

る形式である。MIME タイプを指定し、以下のようにする。 Word 文書である場合、MIME タイプは”application/msword”となり、従って

“Content-type: application/msword”と記述する。 ② Content-length

ファイルのデータサイズをバイト単位で示し、バイナリデータを含む。サイズを

サーバ通知する事により、サーバからの予想外のデータ終了するエラーを防ぐ事が

可能である。 データサイズが 1234 バイトである場合、“Content-length:1234“と記述する。

③ Location 指定した URL に遷移する。一般的に呼び出しで毎回のスタティックドキュメン

トを作成して返す時に、サーバのリダイレクションとして遷移先を固定し既存ドキ

ュメントを返す。これによってその都度の HTML ドキュメントを動的に生成する

必要がなくなりプログラムの効率が良くなる。遷移先は自分のサーバ内のドキュメ

ントに制限されておらず、サーバ外であれば URL は http:// で始まる完全な形で指

定する。 自分のサーバ内ドキュメントの場合、ファイル名を move.html と仮定すると、

“Location:/move.html”と記述する。 ④ Status

ファイルデータがどのような状態であるかをクライアントに示し、ステータスコ

ードを指定して記す。ステータスコードは IETF の発行する技術仕様書で定められ

ている [10]。以下によく見られるステータスコードの使用例を示す。 (ア) 見つからない場合、値は 404 となるので“Status:404”と記述する。 (イ) アクセス権限がない場合、値は 403 となるので“Status:403”と記述する。 (ウ) サーバ内部でエラーがある場合、値は 500 となるので“Status:500”と記述す

る。 (エ) 成功した場合、値は 200 となるので“Status:200”と記述する。 (オ) クライアントの要求が不当な場合、値は 400 となるので“Status:400”と記述

する。

17

(カ) サービスの利用が不可能な場合、値は 503 となるので“Status:503”と記述す

る。 ⑤ Expires

キャッシュの有効期限を指定する。多くのブラウザではキャッシュ機能が動いて

いるので、初回以外はキャッシュからドキュメントの再ロードを行う。キャッシュ

自体の再ロードが必要になる場合は、ここで指定できる。 キャッシュ更新時を 2009 年 3 月 19 日木曜日にする場合、“Expires:Thu, 19 Mar

2009 00:00:00 GMT”と記述する。 ⑥ Pragma

キャッシングのオン、オフを指定する。 キャッシュを指定しない場合、“Pragma: no-cache”と記述する。

⑤と⑥に於いては、ブラウザによって正しくハンドルされない場合もある。 更に、5-2 の行番号 3 で説明したように、ヘッダー情報終わりの次の行は必ず空白行

にしなければならない。これは、ファイル実行終了の判別をヘッダー情報の使用によっ

て把握する為である。Perl では、２つの改行キャラクタ(¥n¥n)で空白行を作り出す。

空白行の後の行は、全てデータとしてみなされる。 (2) パラメータの渡し方

サーバが URL を受け取ると、URL の先頭部分は読み込むべき CGI プログラムを示

し、基本的に”?”の後ろの部分をクエリ文字列と認識して、これを CGI プログラムへの

パラメータとする。渡し方は以下の４つである。 ① METHOD=GET

フォームの input タグ内の NAME 属性で指定された変数に、Web ブラウザ上で

入力された値を割り当てて、”=”で繋ぐ。使用する環境変数 QUERY_STRING の

サイズには上限がある。 変数 Sample に値 Yes を指定する場合、“Sample=Yes”となるので、

“http://....../aaa.cgi? Sample=Yes”と記述する。 ② コマンドライン引数

環境変数 QUERY_STRING に”=”が含まれない場合、スペースの置き換えとし

て”+”を使い、そのままコマンドライン引数として渡される。 ①例の環境変数 QUERY_STRING に入った Sample=Yes の”=”が含まれない場

合、Sample Yes は Sample+Yes に置き換えるので、“ http://....../aaa.cgi? Sample+Yes”と記述する。

③ METHOD=POST 送信データサイズが大きい場合に使用する。データは URL に反映されず、環境

変数CONTENT_LENGTHで送信データサイズをセットして標準入出力で渡され

る。

18

どのような場合でも URL は変わらないので、“http://....../aaa.cgi”と記述する。 ④ URL にスラッシュ(/)を使う

エキストラパス情報として付加データを認識する。但し、CGIプログラムの URLがどこで終了しているのかと、その後ろの余分な URL 部分の存在を認識している

サーバに限り、環境変数を使う。 環 境 変 数 PATH_INFO に 余 分 な URL 部 分 を 格 納 、 環 境 変 数

PATH_TRANSLATEDを使いエキストラパス情報をルートディレクトリにマップ

す る 。 Sample フ ォ ル ダ に 入 っ た sample.txt を 表 示 さ せ た い 場 合 、

“http://....../aaa.cgi/sample/sample.txt”と記述する。 (3) エンコード

渡すデータは規則に従ってエンコード(符号化)が必要である。(2)-②の GET メソッド

ではブラウザ上のフォームで入力された値がそのまま URL の一部となるので、URLでは使用できない文字などを入れる事はできない。このような時の為に、エンコードが

定められている。 • スペースは「+(プラス）」に置き換える。 • 特殊文字や日本語などは「%」の後に 16 進数表記で記す。

(4) 環境変数 環境変数とは、スクリプトのどこからでも参照できる特殊な変数である。また、環境

変数は様々な所で利用されるので、CGI で利用できる分が決められている。上記の(2)のパラメータの渡し方でも、CGI で使用できる環境変数の一部を使用している。以下

に Perl での環境変数の使い方の例を示す。 • パ ラ メ ー タ 受 け 渡 し 時 に 使 用 す る QUERY_STRING の 場 合 は 、

“＄ENV{‘QUERY_STRING’}”と記述する。 • パラメータ受け渡しのデータサイズセット時に使用する CONTENT_LENGTH 場

合は、“＄ENV{‘CONTENT_LENGTH’}”と記述する。 • エ キ ス ト ラ パ ス 情 報 の 格 納 時 に 使 用 す る PATH_INFO の 場 合 は 、

“＄ENV{‘PATH_INFO’}”と記述する。 • PATH_INFO のルートディレクトリのマップ時に使用する PATH_TRANSLATED

の場合は、“＄ENV{‘PATH_TRANSLATED’}”と記述する。 • クライアントの IP アドレスが分かる REMOTE_ADDR を使用する場合は、

“＄ENV{‘REMOTE_ADDR’}”と記述する。 • クライアントのホスト名がわかる REMOTE_HOST を使用する場合は、

“＄ENV{‘REMOTE_HOST’}”と記述する。 • ユ ー ザ の 認 証 名 が わ か る REMOTE_USER を 使 用 す る 場 合 は 、

“＄ENV{‘REMOTE_USER’}”と記述する。

19

第 6 章 CGI の検証

ここでは、具体的な CGI プログラムとして言語を PHP(Hypertext Preprocessor)に限定

して、実際に製作したプログラムを元に説明する。また、PHP は HTML 埋め込み型のサ

ーバサイドスクリプト言語であるので、従来の CGI プログラムの様に print 関数といった

HTML を書き出すための命令は必要ない。プログラムは第 4 章の図 4 と同じ条件の元、問

題ページからグラフ表示までの構成である。 ① 問題ページの表示

クライアント側の表示画面で Struts と同様であるが、PHP など CGI の場合、問題

ページでの Form タグ内で次に読み込む情報先を予め書き込んでおけば良い。したが

って、このページは完全に HTML ファイルとする事が出来る。 書き方は違うものの、第 4 章‐②のように値(value)を送信、データベースへデータ

を格納する。”太陽”を選択すると value は”2”となる。また、対応する部分の propertyは type に相当する。図 18 に、左側問題ページ表示画面と右側 HTML コードを示す。

※ 行番号 14、Form タグ内の action で PHP ファイルの呼び出し ※ 行番号 15、17、19、21、input タグ内の type=”radio”でラジオボタンの使用とな

る ② 結果表示とデータベースへのデータ格納

ここでは、結果判断と表示、データベースへのデータ格納を同じファイルに書き込ん

だ。Struts とは異なり、プログラム全体としてそれぞれのフロー制御や管理体系の構

造を持っているわけではない。その都度、行いたい動作に対して命令を書き込んでいく

ので、一つの動作に対して同じファイル内で様々な処理を書き込む。図 19 に、解答ペ

ージの正否判断コードを示す。

図 18．問題ページの表示画面と HTML

20

※ 行番号 11～18 まで、条件分岐のコード ※ 11～14 では、正解時、”問題１、正解です。”と表示 ※ 16～18 では、不正解時、” 問題１、間違いです。”と表示

データベースのデータ格納も、Struts と同様に MySQL データベースを使用して

PHP からアクセスする。しかし、スクリプト言語なのでそのまま HTML ファイルに

アクセス処理を書き込むことになる。図 20 にそのコードを示す。

※ 行番号 25～30、MySQL のアクセス操作 ※ 行番号 28、送信された値の書き込み処理

③ グラフの表示 グラフ表示に於いても同様の表し方を PHP で処理を行った。ここで Struts と異な

る点が、グラフ化のための HTML 出力部分である。その他 CGI プログラムに於いて、

基本的に CGIスクリプト内でHTMLそのものを print関数の使用をするなどして出力

を行う必要がある。

21

PHP は HTML 埋め込み型である為に、通常 HTML 部分は HTML の規則に従って

書き込めばよい。しかし、他の CGI プログラムでは、処理後のページ表示は print 関

数を使っての HTML 生成が一般的である。図 21 にグラフ表示画面、図 22 にデータベ

ースに格納されたデータ取り出しコード、図 23 にグラフ作成コードをそれぞれ示す。

22

※ 行番号 47～49、グラフ棒の高さと幅を設定

(52～54、57～59、62～64 も同様である)

第 7 章 考察

本章では、同じ問題出力と回答、正解の表示とグラフ表示する Web アプリケーションを

Struts フレームワークを使って作成した場合と、フレームワークを使わずに PHP を使って

CGI プログラムを作成した場合の比較を行う。 7-1.Struts のメリット ここでは、Struts を使用する事によって得られるメリットとなる部分について幾つか紹

介する。 一番のメリットは、作業分担が容易となる部分である。Struts は MVC モデルを使用し

ている為、Model、View、Controller それぞれの結合が弱い。この特徴により、ロジック

(Model)を作る担当の人、デザイン(View)を作る担当の人、画面遷移(Controller)を作る担当

の人などと、大多数の人間でそれぞれの作業を分担して作成する事が容易となるのだ。 二つ目は、一定の品質を保てるという点である。Struts はフレームワークなので動作が

規定されており、開発者は Web アプリケーションを作成するにあたって必要なパーツを埋

めていくという流れで開発を進める。その為、開発者によって作り方が大きく異なるとい

う事が無いので開発者が何人いてもスムーズに作業を進める事ができるのである。 三つ目は、柔軟な画面遷移が実現できるという点である。Struts の場合、画面遷移情報

を全て設定ファイル(struts-config.xml)に記す為、複雑になりがちな画面遷移処理を容易に

記述する事が可能となるのである[5]。 7-2.Struts のデメリット

23

Struts のデメリットとなる部分について紹介する。 Struts を使用するにあたって、何よりもまず一番初めに生じる問題がフレームワークと

いうものについて学習する時間を要する事であろう。フレームワークは多機能であるが故

に、JSP やサーブレットのように単純な動作ではない。それを使う為には、フレームワー

クの構造全体についての理解、そして提供されるクラスライブラリの使い方を覚える必要

がある。その一例が、MVC モデルについての理解である。説明や図で見ると分かりやすい

ように感じたのだが、実際に Struts に当て嵌めてみると、どのファイルが View に当たる

のか、Controller に当たるのかなどが理解できず、どこにコードを書けば良いのか分からな

かった。これを理解するまでは、プログラミング作業を行うことが出来なかった。 二つ目は、フレームワークは汎用的な処理を想定した機能を提供している為、何らかの

特殊な処理をするアプリケーションでは対応しきれない場合や、無理に利用しようとする

と処理が複雑になる可能性があるという点である[6]。 7-3.CGI のメリット プログラムを実際に製作して実感した事は、Web アプリケーション製作の始めやすい点

である。print 関数などのファイル出力命令を書き込み Web サーバ上で実行させれば、そ

れだけで CGI プログラムとなる。また、Web アプリケーション構造をはっきりと理解せず

とも、実行したい動作に対して必要な処理を書き連ねていけばよい。したがって、動的な

ページを実現させたい個人サイト所有者は、気軽に取り組めるプログラムといえよう。 更に、実行したい動作に対しての様々な処理という事で、製作者は動作の流れ、動作の

追加、新たな処理の追加等の行いやすさに繋がる。 7-4.CGI のデメリット 一方で、CGI は一般的にプログラム規模が小さい。これは、個々のプログラムの把握の

し易さから来る欠点である。フレームワークの枠組みによる動作の独立性が無いが為に、

大きくなればなるほど動作に対して処理を延々と書き込まなければならない。また、大規

模プログラムが製作できたとしても、プログラムのおおまかな構造が分かり難い。したが

って、作業分担し難く、大多数の人間が関わるプロジェクトには不向きである。 そして、Struts にある動作の規定が CGI には無く、類似した動作も一つずつ書かなけれ

ばならず、作業時間が増える。共通部分を作り、あてはまるパーツをはめ込んでいく様な

Struts の効率の良さが CGI に無いという事は、業務執行にも大きな影響を与えるであろう。 7-5. Struts と CGI の比較

24

Struts フレームワークと CGI の具体的な比較考察を図 24 を基に述べる。 まず、４章の Struts フレームワークの図９で紹介した「解答ページ」の表示について説

明する。まず、図 10 で示すように、JSP で HTML ファイル中に正否判断を行うコードを

記述している。図 10 の<%から%>に囲まれた部分が正否判断のコードである。これは実際

に入力されたコードが“３”であるかをチェックして、正解か不正解かのメッセージを出

力する JSP プログラムコードである。更に、6 章の図 18 に示すように、CGI でも同様に

PHP プログラムを HTML ファイルに書き込む。図 18 の<%php から%>に囲まれた部分が

実際の HTML ファイルに埋め込まれた正否判断の PHP プログラムコードである。これら

はどちらも If 文を使い、特定の値以外の数値が返された場合は”不正解”を示す文字を表示

するようにという命令が書かれている。正否という判断（MVC モデルのモデル部分）の処

理コードはあるが、主に表示（正解か不正解を画面上に表示）する為のコードであり MVCモデルの View にあたる。 同様に、グラフ表示の処理でも図 14 で示すように、JSP で HTML ファイル中にグラフ

表示に関するコードを記述している。図 14 の<%から%>に囲まれた部分がグラフ表示の設

定に関するコードである。これは棒線の高さや幅などの設定を行うコードで、指定した画

像を使用し、解答数×100 の幅で、24 ピクセルの高さで表示するように設定したプログラ

ムコードである。そして、6 章の図 23 に示すように、CGI でも同じように高さは 10 ピク

セルで固定、幅を回答数×50 で表示するように設定したプログラムコードである。このグ

ラフに関するコードは、表示デザインに関する事のみ記しているので MVC モデルの Viewにあたる。

25

次にデータベースアクセスの処理を比較する。このデータベースアクセス処理が CGI と

Struts では大きく異なっている。まず、CGI は図 22 に示すようにデータベースアクセス処

理も HTML ファイルの中に<%php から%>の中に PHP プログラムコードとして記述され

ている。CGIは他のグラフ表示コードや成否判断コードと同じ仕組みである。しかし、Strutsではデータアクセス処理は Servlet を利用した Java プログラムで書かれている。この JavaプログラムはHTMLファイルとは全く別のファイルであり、保存されるフォルダも異なる。

更に、データベースアクセス処理は MVC モデルの C（Control）部分にあたる。つまり、

View でもなく、Model でもなく、全体をコントロールする処理である。 まとめると、Struts と CGI の決定的な違いは、Struts では MVC モデルの Control 部分

であるデータベースアクセス処理は Servlet でのプログラムとなり、HTML ファイルとは

独立した Java ファイルで作成されている事と分かった。それに対し、CGI の PHP プログ

ラムでは基本的に動作に対する全ての処理を HTML ファイルに書き込むので、データベー

スアクセス処理においてもそのまま同じ HTML ファイルに書き込む。また、Java ファイ

ルがHTMLファイルから独立しているので、Strutsではデータベース部分の変更があれば、

Java プログラムファイルのみを変更すればよいので作業分担が容易にできる。更に、MVCモデルをはっきり理解せずにプログラムを製作しても、Struts の性質上自然と MVC モデ

ルに則したプログラムが出来上がるのである。反対に CGI では、敢えて動作処理のファイ

ルを別々の HTML ファイルに作ったとしても、それぞれの処理の変更箇所が関わりあって

いる為、完全に HTML ファイルを機能ごとに分割する事は難しい。

第 8 章 おわりに

Struts フレームワークと CGI、二つの方法を使用して Web アプリケーションの作成を行

った事により、実際に作成してみなければ実感できなかった利便性や問題点を考察する事

ができた。そして、双方のメリットとなる点やデメリットとなる点を比較し、開発環境や

開発人数、また利用目的などによって開発方法を選択する必要性を感じた。大規模、大人

数のプログラムになるほど Struts フレームワークの利便性が顕著になる。その逆に、小規

模で少人数または個人で作成する Web アプリケーションの場合は、Struts フレームワーク

を使用するよりも CGI を使用する方が複雑な設定などを行う必要も無く、コーディング作

業に時間を費やす事が出来る。 今後の課題としては、阪南大学のネット学習のような、もう少し大きなシステムを開発

し、Struts と CGI の比較検証を行う事により、もっと突き詰めてどちらの開発方法が良い

かの考察を行ないたいと思う。

―参考文献― [1]. IT 用語辞典 e-Words http://e-words.jp/ [2]. Eclipse3 ではじめる Java フレームワーク入門 著者：掌田 津那乃 発行所：株式

26

会社 秀和システム [3]. Apache Struts アプリケーション開発入門 著者：株式会社四次元データ 発行所：

ソフトバンク クリエイティブ株式会社 [4]. http://www.stackasterisk.jp/tech/java/index.jsp [5]. http://www.infoscience.co.jp/technical/struts/index.html [6]. ITmedia エンタープライズ http://www.itmedia.co.jp/enterprise/ [7]. http://www.grapecity.com/japan/powernews/column/web_app/001/default.htm [8]. http://ja.wikipedia.org/wiki/Common_Gateway_Interface [9]. http://www.tohoho-web.com/wwwcgi3.htm [10].http://ja.wikipedia.org/wiki/HTTP%E3%82%B9%E3%83%86%E3%83%BC%E3%82%BF%E3%82%B9%E3%82%B3%E3%83%BC%E3%83%89 [11]. http://www.tohoho-web.com/wwwcgi3.htm#CgiEnvironment [12]. CGI プログラミング on the World Wide Web 著者：Shishir Gundavaram 田辺茂

也：監訳 株式会社エディックス：訳 発行所：オライリー・ジャパン [13]. 10 日でおぼえる Perl/CGI 入門教室 著者：高橋大吾 発行所：株式会社 翔泳社 ―謝辞― ゼミの活動に限らず、多くの事を学ばせて下さいました花川典子先生に感謝致します。Webアプリケーション開発に於いて多くの御助力を頂きました池宮直氏に感謝致します。同じ

く、多くの御助力を頂きました麻山勇樹氏に感謝致します。卒業論文の執筆に於いて、多

くの御助力を頂きました尾花将輝氏に感謝致します。2 年間のゼミ活動に於いて、お世話に

なった先輩方に感謝致します。同じく、お世話になった同期メンバーに感謝致します。長

い学生生活を支え続けてくれた家族に感謝致します。