| ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 2007年11月04日 楽しいJava講座 - 初心者から達人へのパスポート vol.077 セルゲイ・ランダウ バックナンバー： http://www.flsi.co.jp/Java_text/ ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ [このメールマガジンは、画面を最大化して見てください。] ======================================================== ◆ ０１．Tomcatのアプリケーション開発 ======================================================== では、今回はサーブレットとBeanとJSPを使った簡単なWebアプリ ケーションの連携プレイの様子を見ていきましょう。 この連携プレイの大雑把な流れは、以下のようになります。 (1) まず、WebブラウザーでURLを指定することによって、サーブ レットを呼び出すためのWebページ(HTMLファイル)が開かれます。 (2) Webページのフォームに入力を行ってSubmitボタン（送信ボタン） をクリックすることによってサーブレットが呼び出され、入力データ がサーブレットに渡されます。 (3) サーブレットはBeanを起動し、必要な入力データをBeanに渡し、 Webブラウザーに応答を返すためにJSPを呼び出します。 (4) JSPはBeanから処理結果を受け取ってWebページに組み込み、 WebページをWebブラウザーに返します。 では、例として年齢計算をする簡単なクラス(Bean)を作成し、 このBeanに年齢計算をさせるためのWebページを用意してみま しょう。 まず、年齢計算をするBean(AgeCalcというクラス名にする)を以下の ように作成しておきましょう。 (1) Eclipseのパッケージ・エクスプローラーの中のJStudy2の中の WEB-INF/srcを右クリックし、「新規」→「パッケージ」を選択し ます。 (2) 「名前」に jp.co.flsi.lecture.webapp.bean を入力し、「終了」ボタンをクリックします。 (3) パッケージ・エクスプローラーの中にできた jp.co.flsi.lecture.webapp.beanを右クリックし、 「新規」→「クラス」を選択します。 (4) 「名前」に AgeCalc と入力し、「終了」ボタンをクリックします。 (5) AgeCalcのエディターが開いたら、下記のようなソース・コード に編集します。 -------------------------------------------------------- package jp.co.flsi.lecture.webapp.bean; import java.text.DateFormat; import java.text.SimpleDateFormat; import java.util.Date; public class AgeCalc { private int dayOfBirth; private int age; public void setDayOfBirth(int dayOfBirth) { this.dayOfBirth = dayOfBirth; } public int getDayOfBirth() { return dayOfBirth; } public void setAge(int age) { this.age = age; } public int getAge() { return age; } public void calcAge() { Date today = new Date(); DateFormat format = new SimpleDateFormat("yyyyMMdd"); String stringToday = format.format(today); setAge((Integer.parseInt(stringToday) - getDayOfBirth()) / 10000); } } -------------------------------------------------------- このソース・コードでは、プロパティーやメソッドをJavaBeansの ルールに従って作成してありますから、サーブレットやJSPから Beanとして認識してもらえます。なお、引数無しのコンストラク ターはデフォルトのコンストラクターとしてコンパイラーが自動的 に生成してくれますから、このソース・コードには記述がありませ ん。（ただし、もし引数付きのコンストラクターをコーディングした 場合には、引数無しのコンストラクターも明示的に記述する必要がある ことに注意してください。） では、続いて、サーブレット(AgeCalcServletというクラス名にする)を 下記のように作成してください。 (1) Eclipseのパッケージ・エクスプローラーの中のJStudy2の中の WEB-INF/srcを右クリックし、「新規」→「パッケージ」を選択します。 (2) 「名前」に jp.co.flsi.lecture.webapp.servlet を入力し、「終了」ボタンをクリックします。 (3) パッケージ・エクスプローラーの中にできた jp.co.flsi.lecture.webapp.servletを右クリックし、 「新規」→「クラス」を選択します。 (4) 「名前」に AgeCalcServlet と入力し、「スーパークラス」に javax.servlet.http.HttpServlet と入力し、「終了」ボタンをクリックします。 (5) AgeCalcServletのエディターが開いたら、下記のようなソース・コード に編集します。 -------------------------------------------------------- package jp.co.flsi.lecture.webapp.servlet; import java.io.IOException; //import java.io.PrintWriter; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import jp.co.flsi.lecture.webapp.bean.AgeCalc; public class AgeCalcServlet extends HttpServlet { public void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException { AgeCalc calc = new AgeCalc(); calc.setDayOfBirth(Integer.parseInt(request.getParameter("dayOfBirth"))); calc.calcAge(); request.setAttribute("AGECALC",calc); getServletContext().getRequestDispatcher("/ageresult.jsp").forward(request,response); } } -------------------------------------------------------- 新しいサーブレットを作成したので、これをweb.xmlファイルに登録 しておきましょう。 すなわち、パッケージ・エクスプローラーのJStudy2の中のWEB-INF の中のweb.xmlを下記のように編集しておきましょう。 -------------------------------------------------------- <?xml version="1.0" encoding="ISO-8859-1"?> <web-app xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" version="2.5"> <servlet> <servlet-name>TestServlet</servlet-name> <servlet-class>jp.flsi.lecture.servlet.TestServlet</servlet-class> </servlet> <servlet> <servlet-name>TestServlet2</servlet-name> <servlet-class>jp.flsi.lecture.servlet.TestServlet2</servlet-class> </servlet> <servlet> <servlet-name>AgeCalcServlet</servlet-name> <servlet-class>jp.co.flsi.lecture.webapp.servlet.AgeCalcServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>TestServlet</servlet-name> <url-pattern>/servlet/test</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>TestServlet2</servlet-name> <url-pattern>/servlet/test2</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>AgeCalcServlet</servlet-name> <url-pattern>/servlet/age</url-pattern> </servlet-mapping> </web-app> -------------------------------------------------------- では、続いて、JSPの作成を行います。 以下のようにして、ageresult.jspという名前のファイルを作成 しましょう。 (1) Eclipseのパッケージ・エクスプローラーの中のJStudy2を右クリックし、 「新規」→「ファイル」を選択します。 (2) 「名前」に ageresult.jsp を入力し、「終了」ボタンをクリックします。 (3) ageresult.jspのエディターが開いたら、下記のようなソース・コードに 編集します。 -------------------------------------------------------- <HTML> <HEAD> <TITLE>年齢計算の結果のページ</TITLE> </HEAD> <BODY bgcolor="#77ffff" text="#fa5a00"> <H1>vol.077 [年齢計算の結果のページ]</H1> <jsp:useBean class="jp.co.flsi.lecture.webapp.bean.AgeCalc" id="AGECALC" scope="request" /> <%= "あなたの年齢は" + AGECALC.getAge() + "歳です。"%> </BODY> </HTML> -------------------------------------------------------- 最後に、AgeCalcServletを呼び出すために下記のようにHTMLファイルを 作成しておきましょう。 (1) Eclipseのパッケージ・エクスプローラーの中のJStudy2を右クリックし、 「新規」→「ファイル」を選択します。 (2) 「名前」に age.html を入力し、「終了」ボタンをクリックします。 (3) パッケージ・エクスプローラーの中にできたage.htmlを右クリックし、 「アプリケーションから開く」→「テキスト・エディター」を選択し、 下記のようなソース・コードに編集します。 -------------------------------------------------------- <HTML> <HEAD> <TITLE>年齢計算のテストのページ</TITLE> </HEAD> <BODY bgcolor="#77ffff" text="#fa5a00"> <H1>vol.077 年齢計算のテストのページ</H1> <FORM action="http://localhost:8080/JStudy2/servlet/age" method="POST"> <BR> あなたの生年月日をYYYYMMDDの形式で入力してください。 <BR> <INPUT TYPE="text" NAME="dayOfBirth" VALUE="" SIZE=10> <BR> <BR> <INPUT TYPE="submit" NAME="submit" VALUE="送信"> </FORM> </BODY> </HTML> -------------------------------------------------------- 編集したファイルをすべて保管したあと、EclipseからTomcatを起動 （メニュー・バーから「Tomcat」→「Tomcat起動」）した後、テスト をしてみましょう。 (1) Webブラウザーを起動し、下記URLを入力してください。 http://localhost:8080/JStudy2/age.html (2) 自分の生年月日をYYYYMMDD形式（たとえば1978年11月1日生まれなら 19781101）で入力し、「送信」ボタンをクリックします。 (3) 正しい結果が返ってくることを確認してください。 以上のソース・コードについては次回解説します。 その後、段々と複雑なWebアプリケーションの開発方法の話にはいって いきます。 今回はここまでにします。 何か、わからないところがありましたら、下記のWebページまで質問を お寄せください。 （続く） ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━┓ ★ホームページ： http://www.flsi.co.jp/Java_text/ ★このメールマガジンは 「まぐまぐ（http://www.mag2.com）」 を利用して発行しています。 ★バックナンバーは http://www.flsi.co.jp/Java_text/ にあります。 ★このメールマガジンの登録／解除は下記Webページでできます。 http://www.mag2.com/m/0000193915.html ★このメールマガジンへの質問は下記Webページにて受け付けて います。わからない所がありましたら、どしどしと質問をお寄 せください。 http://www.flsi.co.jp/Java_text/ ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━┛ Copyright (C) 2007 Future Lifestyle Inc. 不許無断複製 |