WebOTX アプリケーション開発ガイド WebOTX アプリケーション開発ガイドバージョン : 7.1 版数 : 第 2 版リリース : 2010 年 1 月 Copyright (C) 1998-2010 NEC Corporation. All rights reserved. 4-1-1
目次 4. J2EE WebOTX...3 4.1. Webアプリケーション...3 4.1.1. Webアプリケーションを作成する...3 4.1.2. Webアプリケーションを配備する...17 4.1.3. Webアプリケーションを使う...20 4-1-2
4.J2EE WebOTX 4.1.Web アプリケーション WebOTX Developer's Studio は Web アプリケーションの作成の手助けをいたします ここでは Web ページに入力した文字列を表示する簡単な Web アプリケーションを作る際の開発の手順を説明いたします 4.1.1.Web アプリケーションを作成する データベースや EJB などを使用しない スタンドアロンな Web アプリケーションを MVC2 を用いて作成します MVC2 とは MVC アーキテクチャを Web アプリケーションに適用したものです JSP Model 2 アーキテクチャとも呼ばれます Web プロジェクトを作成します メニューから ファイル 新規 プロジェクトを選択して新規プロジェクト画面を表示させます Web プロジェクトとは WebOTX Developer's Studio での Web アプリケーション作成用プロジェクトです 新規プロジェクト画面の Web を開き Web プロジェクト (WebOTX) を選択して [ 次へ ] をクリックします 4-1-3
プロジェクト名に HelloSample を入力し [ 次へ ] をクリックします 文字エンコードフィルタを利用する事で マルチバイト文字のエンコードが自動で行われるようになります Web アプリケーション実行支援ライブラリにチェックを付けて文字エンコードフィルタを利用するにもチェックを付けて [ 終了 ] をクリックします 入力画面用の HTML ファイルを作成します 4-1-4
HelloSample プロジェクトを選択します ポップアップメニューから新規 その他を選択して選択画面を表示させます 選択画面から Web を開き HTML(WebOTX) を選択して [ 次へ ] をクリックします ファイル名に hello.html を入力し [ 終了 ] をクリックします 4-1-5
hello.html を選択します ポップアップメニューからアプリケーションから開く テキスト エディターを選択します hello.html を以下の通り編集し保存します <!DOCTYPE HTML PUBLIC "-//w3c//dtd html 4.0 transitional//en"> <html> <head> <meta HTTP-EQUIV="Content-Type" Content="text/html; charset=shift_jis"> <title>hello</title> </head> <body bgcolor="#ffffff"> <form method="post" action="helloservlet"> 名前を入力してください :<input type="text" name="name" size="20"> <input type="submit" value=" こんにちは "> </form> </body> </html> 出力画面用の JSP ファイルを作成します 赤色部分が 修正あるいは追加する個所です 一括 JSP コンパイル JSP コンパイル機能が動作しない場合 第 7 部開発時のトラブルシューティング の 3 章 J2EE WebOTX(pdf 形式 ) 3.1.4.JSP コンパイルが動作しない の手順に従い 対処くださるようお願い致 4-1-6
します HelloSample プロジェクトを選択します ポップアップメニューから新規 その他を選択して選択画面を表示させます 選択画面から Web を開き JSP ウィザードを選択して [ 次へ ] をクリックします ファイル名に hello.jsp を入力し [ 次へ ] をクリックします 4-1-7
[ 終了 ] をクリックします hello.jsp を選択します ポップアップメニューからアプリケーションから開く テキスト エディターを選択します hello.jsp を以下の通り編集し保存します <%@ page pageencoding="ms932" contenttype="text/html; charset=windows-31j" %> <%@ taglib uri="/web-inf/otxjsptag.tld" prefix="otxjsp" %> <jsp:usebean id="hellobean" scope="request" type="sample.hellobean" /> <!DOCTYPE HTML PUBLIC "-//w3c//dtd html 4.0 transitional//en"> <html> <head> <title> こんにちは </title> </head> <body bgcolor="#ffffff"> こんにちは <jsp:getproperty name="hellobean" property="name"/> さん <br> あなたの名前は <jsp:getproperty name="hellobean" property="score"/> 点です <br> <a href="hello.html"> さようなら </a> <form> 赤色部分が 修正あるいは追加する個所です 1 行目の pageencoding の値は JSP ファイルのエンコード形式を示すため エディタのテキストファイルエンコードの設定により変動します 4-1-8
<!- ここからFORMの部品を配置してください --> <!- ここまでFORMの部品を配置してください --> <!- ここからは消さないでください --> <otxjsp:checkdata/> <!- ここまでは消さないでください --> </form> </body> </html> ビジネスロジック クラスを作成します メニューからウィンドウ パースペクティブを開く Java を選択し Java パースペクティブに変更します パッケージ エクスプローラーにて HelloSample プロジェクトを選択します ポップアップメニューから新規 クラスを選択して新規 Java クラス画面を表示させます 4-1-9
H パッケージに sample を入力し 名前に HelloModel を入力し [ 終了 ] をクリックします 生成された HelloModel クラスに以下のメソッドの記述を追加し保存します public int getscore(string name){ int sum = 0; char[] carray = name.tochararray(); for(int i=0; i<carray.length; i++){ sum += carray[i]; } return (sum % 10) + 1; } ここでのビジネスロジックは 名前から 1 ~10 までの点数を取得するといった処理を行っています ビジネスロジック用のクラスは サーブレット用 API を import しない汎用的なクラスとして作成する事が望ましいです Bean を作成します パッケージ エクスプローラーにて HelloSample プロジェクトを選択します 4-1-10
ポップアップメニューから新規 クラスを選択して新規 Java クラス画面を表示させます パッケージに sample を入力し 名前に HelloBean を入力し スーパークラスからのコンストラクタにチェックを付け [ 終了 ] をクリックします 生成された HelloBean クラスに String 型の name と int 型の score フィールドを追加します public class HelloBean { private String name; // この行を追加 private int score; // この行を追加 } 4-1-11
HelloBean.java ソース内のクラス名の宣言部分をクリックし ポップアップメニューからソース Getter および Setter の生成を選択します [ すべて選択 ] をクリックしツリーの要素全てにチェックが付く事を確認します 4-1-12
[OK] をクリックします HelloBean クラスのコードが以下の通りになっている事を確認して保存します package sample; /** * @author * */ public class HelloBean { private String name; private int score; この Bean は Servlet(MVC の Control) と JSP(MVC の View) とのインタフェースとなります /** * */ public HelloBean() { super(); // TODO 自動生成されたコンストラクター スタブ } /** * @return */ public String getname() { return name; } /** * @return */ public int getscore() { return score; } /** * @param string */ public void setname(string string) { name = string; } 4-1-13
/** *@param i */ public void setscore(int i) { score = i; } } サーブレットを作成します パッケージ エクスプローラーにて HelloSample プロジェクトを選択します ポップアップメニューから新規 その他を選択して選択画面を表示させます 選択画面から Web を開き Servlet(WebOTX) を選択して [ 次へ ] をクリックします パッケージに sample を入力し 名前に HelloServlet を入力し メソッドの dopost() にチェックを付け [ 次へ ] をクリックします 4-1-14
Servlet 名に HelloServlet を入力し URL に /HelloServlet を入力し [ 終了 ] をクリックします 生成された HelloServlet.java の dopost() メソッドを以下の通り実装して保存します protected void dopost( HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { HelloModel model = new HelloModel(); // リクエストパラメータから name の値を取得する String name = request.getparameter("name"); // ビジネスロジックを実行する int score = model.getscore(name); // JSP とのインタフェース Bean を生成し値を設定する HelloBean bean = new HelloBean(); bean.setname(name); bean.setscore(score); // hellobean という名前で Bean をリクエストに設定する request.setattribute("hellobean", bean); // /hello.jsp に forward する request.getrequestdispatcher("/hello.jsp").forward(request, response); } ビルドを行います 4-1-15
パッケージ エクスプローラーにて HelloSample プロジェクトを選択します メニューからプロジェクト プロジェクトのビルドを選択して Java ソースファイルをコンパイルします TODO はエラーではありません タスクタブをクリックしてタスクビューを表示し コンパイルエラーが出ていない事を確認します メニューからファイル エクスポートを選択してエクスポート画面を表示します 4-1-16
WAR ファイルを選択し [ 次へ ] をクリックします プロジェクトを HelloSample に設定し 出力ファイルに < 任意のディレクトリ名 >\HelloSample.war を入力し [ 終了 ] をクリックします 4.1.2.Web アプリケーションを配備する 4-1-17
配備ツールを起動します スタートメニューからプログラム (P) WebOTX 配備ツールを選択して配備ツールを起動します 配備操作を行うにはテスト用サーバが動作している必要があります テスト用サーバ情報の初期設定をします メニューからファイル サーバを追加を選択します 既にテスト用サーバ情報の初期設定を行っている場合はこれらの作業は不要です サーバ名に localhost を入力し サーバポートに 6202 が設定されているのを確認し [OK] をクリックします ツリーの localhost:6202 をクリックすると サーバに接続画面が表示されます 4-1-18
ユーザ名に admin を入力 パスワードに adminadmin を入力し [OK] をクリックします localhost:6202 の下に domain1 が存在する事を確認します Web アプリケーションの配備をします メニューからファイル 開くを選択します 先に生成した HelloSample.war を選択して [ モジュールを開く ] をクリックします 4-1-19
一般タブを開き WAR 名前を HelloSample に コンテキストルートを /HelloSample に設定し メニューからファイル 保存を選択します メニューからツール 配備を選択します メッセージペインに完了メッセージが表示されるのを確認します 4.1.3.Web アプリケーションを使う配備した Web アプリケーションを使ってみます Web ブラウザを起動し以下の URL へアクセスします http://localhost/hellosample/hello.html 4-1-20
hello.html の画面が表示されたら名前を入力して [ こんにちは ] をクリックします 入力した名前の点数が表示されます さようなら をクリックすると最初の画面に戻ります 4-1-21