1) Webアプリケーション用のプロジェクトの作成
メニューバーから[ファイル] > [新規] > [プロジェクト]を選択すると、[新規プロジェクト]ウィザードが表示されます。
新規プロジェクトウィザードから[Web] > [動的 Web プロジェクト]を選択して、[次へ]をクリックします。
以下の設定項目を確認、入力してください。
設定項目 | 設定内容 |
---|---|
プロジェクト名 | WebSample |
ターゲットランタイム | Interstage Application Server V9.2 IJServer Cluster (Java EE) |
動的 Web モジュールバージョン | 2.5 |
構成 | Interstage Application Server V9.2 IJServer Cluster (Java EE) デフォルト構成 |
EARにプロジェクトを追加 | チェックしない |
情報を設定後、[次へ]をクリックしてください。Webモジュールページが表示されます。
以下の設定項目を確認、入力してください。以下の情報を設定後、[完了]をクリックしてください。
設定項目 | 設定内容 |
---|---|
コンテキストルート | WebSample |
コンテンツフォルダ | WebContent |
Java ソースフォルダ | src |
Deployment Descriptor の生成 | チェックする |
2-1) データクラスの作成
国名と総人口の情報を保持し、そこから情報を取得するデータクラスを作成します。データクラスの作成は、作成したプロジェクトを選択して、右クリックでコンテキストメニューから[新規] > [クラス]を選択します。新規Javaクラスウィザードが表示されます。
以下の設定項目を確認、入力してください。以下の情報を設定後、[完了]をクリックしてください。
設定項目 | 設定内容 |
---|---|
ソースフォルダ | WebSample/src |
パッケージ | sample |
名前 | CountryData |
以下のソースファイルが生成されます。
ソースファイル | 説明 |
---|---|
CountryData.java | データクラス |
国名と総人口を保持する処理を実装します。以下の太字の箇所をソースに追加してください。
データクラスの実装(CountryData.java)
package sample; public class CountryData { private String countryName; private int totalPopulation; |
ポイント
フィールドを追加した後にクラスを選択している状態で、メニューから[ソース] > [Getter および Setter の生成]を選択することで、getter/setterの追加を行うことができます。
2-2) ロジッククラスの作成
ロジッククラスの作成は、作成したプロジェクトを選択して、右クリックでコンテキストメニューから[新規] > [クラス]を選択します。新規Javaクラスウィザードが表示されます。
以下の設定項目を確認、入力してください。以下の情報を設定後、[完了]をクリックしてください。
設定項目 | 設定内容 |
---|---|
ソースフォルダ | WebSample/src |
パッケージ | sample |
名前 | PopulationRanking |
以下のソースファイルが生成されます。
ソースファイル | 説明 |
---|---|
PopulationRanking.java | ロジッククラス |
順位を入力して国名と総人口を返す処理を実装します。以下の太字の箇所をソースに追加してください。
ロジッククラスの実装(PopulationRanking.java)
package sample; public class PopulationRanking { private CountryData[] countries; public PopulationRanking(){ countries = new CountryData[]{ new CountryData("中国",1330000000), new CountryData("インド",1140000000), new CountryData("アメリカ",300000000), new CountryData("インドネシア",230000000), new CountryData("ブラジル",190000000), new CountryData("パキスタン",160000000), new CountryData("バングラデシュ",150000000), new CountryData("ロシア",140000000), new CountryData("ナイジェリア",140000000), new CountryData("日本",130000000) }; } public CountryData getCountryData(int rank) { --rank; if (rank < 0 || rank >= countries.length) { return null; } return countries[rank]; } } |
3-1) サーブレットクラスのひな型の作成
サーブレットクラスのひな型の作成は、作成したプロジェクトを選択して、右クリックでコンテキストメニューから[新規] > [サーブレット]を選択します。サーブレットの作成ウィザードが表示されます。
以下の設定項目を確認、入力してください。以下の情報を設定後、[次へ]をクリックしてください。
設定項目 | 設定内容 |
---|---|
Web プロジェクト | WebSample |
ソースフォルダ | ¥WebSample¥src |
Java パッケージ | sample |
クラス名 | ServletController |
スーパークラス | javax.servlet.http.HttpServlet |
以下の設定項目を確認、何も変更せずに、[次へ]をクリックしてください。
設定項目 | 設定内容 |
---|---|
名前 | ServletController |
URL マッピング | /ServletController |
以下の設定項目を確認、入力してください。以下の情報を設定後、[完了]をクリックしてください。
設定項目 | 設定内容 |
---|---|
修飾子 | public |
作成するメソッドスタブの選択 | スーパークラスからのコンストラクタ |
以下のソースファイルが生成されます。
ソースファイル | 説明 |
---|---|
ServletController.java | サーブレットクラス |
ポイント
ウィザードで指定した内容でweb.xmlにサーブレットマッピングの定義も追加されています。このアプリケーションでは必要ありませんが、web.xmlの編集については、"2.3.8 web.xmlを編集する"を参照してください。
3-2) サーブレットクラスの実装
作成されたサーブレットクラスの太字の箇所をソースに追加してください。
サーブレットクラス(ServletController.java)
package sample; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletContext; import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; /** * Servlet implementation class ServletController * */ public class ServletController extends HttpServlet { private static final long serialVersionUID = 1L; /** * @see HttpServlet#HttpServlet() */ public ServletController() { super(); } /** * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response) */ protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub request.setCharacterEncoding("Windows-31J"); ServletContext sc = getServletContext(); // 呼び出すファイル種別取得 String mode = request.getParameter("mode"); if (mode != null && mode.equals("top")) { // 入力画面のHTMLファイル呼出し RequestDispatcher inRd = getServletContext().getRequestDispatcher("/default.jsp"); inRd.forward(request, response); return; } int rank; // 入力チェック try { rank = Integer.parseInt(request.getParameter("rank")); } catch (NumberFormatException e){ RequestDispatcher errRd = sc.getRequestDispatcher("/error.jsp"); errRd.forward(request, response); return; } PopulationRanking pop = new PopulationRanking(); CountryData country = pop.getCountryData(rank); // 取得した値の確認 if(country == null){ RequestDispatcher errRd = sc.getRequestDispatcher("/error.jsp"); errRd.forward(request, response); return; } sc.setAttribute("ranking", country); RequestDispatcher outRd = sc.getRequestDispatcher("/result.jsp"); outRd.forward(request, response); |
ポイント
必要な実装をコーディングした後にJavaエディタ上で右クリックし、コンテキストメニューから[ソース] > [インポートの編成]を行うと、プロジェクトに設定されたクラスパスに従った適切なimport文が挿入できます。
4) 入出力画面の作成
4-1) 入力画面のひな型の作成
入力画面となるJSPファイルのひな型を作成します。JSPの作成は、作成したプロジェクトを選択して、右クリックでコンテキストメニューから[新規] > [JSP]を選択します。新規JavaServer Pageウィザードが表示されます。
以下の設定項目を確認、入力してください。以下の情報を設定後、[次へ]をクリックしてください。
設定項目 | 設定内容 |
---|---|
親フォルダを入力または選択 | WebSample/WebContent |
ファイル名 | default.jsp |
以下の設定項目を確認、入力してください。以下の情報を設定後、[完了]をクリックしてください。JSPが表示されます。
設定項目 | 設定内容 |
---|---|
JSP テンプレートの使用 | チェックする |
名前 | 新規 JSP ファイル (html) |
4-2) 入力画面の編集
作成されたJSPファイルの太字の文字列の部分を修正します。JSPファイルの編集については、"2.3.4.2 JSPファイルの編集"を参照してください。
入力画面(default.jsp)
<%@ page language="java" contentType="text/html; charset=windows-31j" pageEncoding="windows-31j"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-31j"> <title>世界総人口ランキング</title> </head> <body> <h1>入力画面</h1> <p>1~10の間で順位を入力してください。</p> <p></p> <form action="ServletController" method="post"> 順位:<br> <input name="rank" type="text" size="10">位<br> <p></p> <input type="submit" value="OK"> <input type="reset" value="クリア"> </form> </body> </html> |
ポイント
JSPファイルはデフォルトでは、JSPエディタに対応付けられていますが、JSPファイルを選択し、コンテキストメニューから[アプリケーションから開く] > [Web ページエディタ]を選択することで、デザインやレイアウトを確認しながら編集できるWebページエディタを使用することもできます。Webページエディタでの編集については、"2.3.5 HTML/JSPファイルをグラフィカルに編集する"を参照してください。
4-3) 出力画面のひな型の作成
入力画面と同様に、ウィザードでJSPファイルを作成します。
以下の値を入力し、[完了]をクリックします。表にない項目は初期値のままでかまいません。
設定項目 | 設定内容 |
---|---|
親フォルダを入力または選択 | WebSample/WebContent |
ファイル名 | result.jsp |
4-4) 出力画面の編集
作成されたJSPファイルの太字の文字列の部分を修正します。
出力画面(result.jsp)
<%@ page language="java" contentType="text/html; charset=windows-31j" pageEncoding="windows-31j"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-31j"> <title>世界総人口ランキング</title> </head> <body> <h1>出力画面</h1> 総人口ランキング${param.rank}位は「${applicationScope.ranking.countryName}」です。<br> 総人口は${applicationScope.ranking.totalPopulation}人です。 <br> <hr> <form action="ServletController" method="post"> <input type="submit" value="入り口に戻る"> <input type="hidden" name="mode" value="top"> </form> </body> </html> |
4-5) エラー画面のひな型の作成
入力画面と同様に、ウィザードでJSPファイルを作成します。
以下の値を入力し、[完了]をクリックします。表にない項目は初期値のままでかまいません。
設定項目 | 設定内容 |
---|---|
親フォルダを入力または選択 | WebSample/WebContent |
ファイル名 | error.jsp |
4-6) エラー画面の編集
作成されたJSPファイルの太字の文字列の部分を修正します。
エラー画面(error.jsp)
<%@ page language="java" contentType="text/html; charset=windows-31j" pageEncoding="windows-31j"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-31j"> <title>世界総人口ランキング</title> </head> <body> <h1>エラー画面</h1> 指定された範囲内の順位が入力されていないか、またはサーバエラーです。<br> <br> <hr> <form action="ServletController" method="post"> <input type="submit" value="入り口に戻る"> <input type="hidden" name="mode" value="top"> </form> </body> </html> |
5) アプリケーションの動作確認
5-1) プロジェクトとサーバの関連付け
サーバビューでサーバを選択し、コンテキストメニューから[プロジェクトの追加および除去]を選択してください。
使用可能なプロジェクトから作成したプロジェクトを選択し、[追加]をクリックしてください。構成プロジェクトに動的Webプロジェクトが追加されていることを確認してください。
以下の設定項目を確認後、[完了]をクリックしてください。
設定項目 | 設定内容 |
---|---|
構成プロジェクト | WebSample |
ポイント
サーバビューに配備先となるサーバが登録されていない場合は、サーバを追加する必要があります。サーバを追加する方法については、"7.2.6 アプリケーションの動作確認"を参照してください。
5-2) ブレークポイントの設定
サーブレットクラスのdoPost()メソッドの先頭行にブレークポイントを設定します。ブレークポイントは、エディタの左側のルーラー部分をダブルクリックして、設定もしくは解除します。
ポイント
JPSファイルについても同様にJSPエディタでブレークポイントを設定することができます。ただし、ブレークポイントは、JSPタグが記載されている行にしか設定できません。(HTMLタグなどで記載されている部分にブレークポイントを設定することはできません。)
注意
JSPファイルにブレークポイントを設定した場合、異なるフォルダにある同名のJSPファイルでも実行が中断します。
5-3) サーバの起動
サーバビューでサーバを選択し、コンテキストメニューから[デバッグ]を選択してください。
ポイント
デバッガを使用せず単純にアプリケーションを起動したい場合には、コンテキストメニューから[開始]を選択します。
サーバが起動する前に自動的にWARファイルが配備されます。
サーバビューで以下の情報を確認してください。
確認項目 | 確認内容 |
---|---|
サーバの状態 | 始動済み |
サーバの状況 | 同期済み |
WARファイル(WebSample)の状況 | 同期済み |
5-4) アプリケーションの実行
サーバビューで、配備されているプロジェクトを選択して、コンテキストメニューから[Webブラウザ]を選択します。Webブラウザが起動されて、入力画面が開きます。
設定項目 | 設定内容 |
---|---|
入力画面のURL | http://localhost/WebSample/ |
[順位:]の入力フィールドに人口ランキングの順位を入力して、[OK]をクリックします。
ポイント
プロジェクトを選択し、コンテキストメニューから[実行] > [サーバで実行]または[デバッグ] > [サーバでデバッグ]を選択することで、サーバの追加、プロジェクトの追加、サーバの起動、クライアントの起動をまとめて行うことができます。
また、クライアントとして使用するWebブラウザは、メニュー [ウィンドウ] > [Web ブラウザ] から変更することができます。
5-5) アプリケーションのデバッグ
アプリケーションが動作し、ブレークポイントで中断されます。変数ビューで変数の値を確認します。メニューから[実行] > [ステップオーバ]を選択し、変数ビューでプログラムの状況を確認します。デバッグについては、"7.2.6.1 デバッグする"を参照してください。
ポイント
変数ビューでは値の確認だけでなく、変更も行うことができます。
デバッガで中断している処理は、メニューから[実行] > [再開]を選択することで再開され、サーバ側での処理が終了し、Webブラウザに出力画面が表示されます。入力した順位の国名と総人口が表示されることを確認してください。
6) 運用環境へのアプリケーションの配布
このアプリケーションを運用環境に配布するには、WARファイルを作成する必要があります。作成したWARファイルは、サーバの配備機能を利用して、サーバに配備します。
6-1)アプリケーションのエクスポート
WARファイルの作成は、エクスポートウィザードから行います。エクスポートウィザードを起動するには、[ファイル] > [エクスポート]を選択してください。[エクスポート]から[Web]>[WAR ファイル]を選択してください。
WARエクスポートウィザードが表示されます。
以下の設定項目を確認、入力してください。以下の情報を設定後、[完了]をクリックしてください。
設定項目 | 設定内容 |
---|---|
Web モジュール | 動的Webアプリケーションプロジェクトを指定します。 |
宛先 | WARファイルの作成先を指定します。 |
6-2) 運用環境への配布
運用環境のInterstage管理コンソールにログインし、ローカルにあるWARファイルを指定することにより、リモート環境から運用環境に配備を行うことができます。