■■■■■■■■■■■■■■■■■■■■■■■■■■■■■
                      2007年11月04日

    楽しいJava講座 - 初心者から達人へのパスポート
                  vol.077

                                セルゲイ・ランダウ
 バックナンバー: http://www.flsi.co.jp/Java_text/
■■■■■■■■■■■■■■■■■■■■■■■■■■■■■


[このメールマガジンは、画面を最大化して見てください。]


========================================================
◆ 01.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. 不許無断複製