トップページphp
45コメント42KB

Java EE part1

■ このスレッドは過去ログ倉庫に格納されています
0001nobodyさん2011/03/21(月) 00:15:17.26ID:???
このスレではJava EE中心の話題を扱います。
GuiceやSpring等のDI関連の話題もOKです。

Java EE at a Glance(OracleのJavaEE公式)
http://www.oracle.com/technetwork/java/javaee/overview/index.html

NetBeans(統合開発環境)
http://netbeans.org/index_ja.html

Eclipse(統合開発環境)
http://www.eclipse.org/
0002 ◆WeIzaoS14noj 2011/03/23(水) 01:41:18.04ID:???
JavaEE 6でお手軽AjaxChat開発

バージョンアップを重ねる毎にリッチな環境が簡単に作れるようになったJavaEE。
かつては初期の開発難度や肥大化した工数によって敬遠されがちでしたが、今はそうではありません。
最新のJavaEE 6環境で簡単にWebアプリが開発できることを、私が勉強しながらお伝えします。


【0.開発概要】
ログイン画面とチャット画面をもつシンプルなアプリケーションを作成します。
今回の開発ではデータベースにはアクセスしません。
本開発では作業者は主に以下の7ファイルを作成・編集(=コーディング)します。
・ログイン画面(index.xhtml, LoginPage.java)
・チャット画面(chat.xhtml, ChatPage.java)
・その他の管理クラス(User.java, Message.java MessagePool.java, SessionFilter.java)
0003 ◆WeIzaoS14noj 2011/03/23(水) 01:42:15.06ID:???
【1.開発環境のインストール】
NetBeansのJava開発用(ダウンロードページの左から3つ目)をインストールする
※開発環境はEclipseでもいいけど、以下の説明はNetBeans向けになっています。


【2.まずはプロジェクトの作成】
新規プロジェクト
 →Java EE
  →Web アプリケーション
完了

プロジェクト名に「AjaxChat」
主プロジェクトに設定にチェック
次へ

サーバー「GlassFish Server3」
Java EE バージョン「Java EE 6 Web」
コンテキストパス「/AjaxChat」※
次へ
http://localhost:8080/AjaxChat/がアプリケーションのトップページとなる

フレームワーク「JavaServer Faces」
完了

プロジェクトを右クリック
→実行
(メニューバー、ツールバーの「主プロジェクトを実行」でもよい)

これでHallo Worldレベルですがプロジェクトが作成できました。
0004 ◆WeIzaoS14noj 2011/03/23(水) 01:45:38.62ID:???
【3.ログイン画面の作成】
・index.html
---------------------------------------------------------------------------
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html">
<h:head>
<title>AjaxChat ログインページ</title>
</h:head>
<h:body>
<h1>AjaxChat ログインページ</h1>
<h:form id="loginForm" prependId="false">
Room Name: <h:inputText id="roomName" value="#{loginPage.roomName}" validator="#{loginPage.validate}" />
<h:message id="roomNameError" for="roomName" style="color: red"/><br />
User Name: <h:inputText id="userName" value="#{loginPage.userName}" validator="#{loginPage.validate}" />
<h:message id="userNameError" for="userName" style="color: red"/><br />
<h:commandButton id="login" value="Login" action="#{loginPage.login}"/>
</h:form>
</h:body>
</html>
---------------------------------------------------------------------------
見慣れないタグが付けられていますが、各々は基本的にはHTMLのinputタグに変換されます。
HTML式に書くことも可能ですが、その場合は余計なタグをいくつか記述する必要が在るので、
HTMLだけを描くデザイナと仕事をするでもなければ、JSFタグを直接打った方が補完も利き手間要らずです。
0005 ◆WeIzaoS14noj 2011/03/23(水) 01:46:45.43ID:???
・User.java
→新規
 →その他
  →JavaServer Faces
   →JSF管理対象Bean
    →クラス名「User」
     パッケージ名「ajaxchat」
     スコープ「session」
完了
---------------------------------------------------------------------------
@ManagedBean
@SessionScoped
public class User implements Serializable {
    private String roomName;
    private String userName;
    public String getRoomName() {
        return roomName;
    }
    public void setRoomName(String roomName) {
        this.roomName = roomName;
    }
    public String getUserName() {
        return userName;
    }
    public void setUserName(String userName) {
        this.userName = userName;
    }
    public boolean isLoginNow() {
        return roomName != null && !roomName.isEmpty()
                && userName != null && !userName.isEmpty();
    }
}
0006 ◆WeIzaoS14noj 2011/03/23(水) 01:48:46.40ID:???
・LoginPage.java
→新規
 →JSF管理対象Bean
  →クラス名「LoginPage」
   パッケージ名「ajaxchat」
   スコープ「view」
完了
---------------------------------------------------------------------------
@ManagedBean
@ViewScoped
public class LoginPage implements Serializable {
    private String roomName;
    private String userName;
    @ManagedProperty("#{user}")
    private User user;
    public String getRoomName() {
        return roomName;
    }
    public void setRoomName(String roomName) {
        this.roomName = roomName;
    }
    public String getUserName() {
        return userName;
    }
    public void setUserName(String userName) {
        this.userName = userName;
    }
0007 ◆WeIzaoS14noj 2011/03/23(水) 01:49:59.74ID:???
    public User getUser() {
        return user;
    }
    public void setUser(User user) {
        this.user = user;
    }
    // 入力検査
    public void validate(FacesContext fc, UIComponent component, Object value) {
        String id = component.getId();
        String inputData = (String) value;
        if ("roomName".equals(id)) {
            if (inputData.isEmpty()) {
                throw new ValidatorException(new FacesMessage("ルーム名は必須です。"));
            }
        } else if ("userName".equals(id)) {
            if (inputData.isEmpty()) {
                throw new ValidatorException(new FacesMessage("ユーザ名は必須です。"));
            }
        }
    }
    public String login() {
        user.setRoomName(roomName);
        user.setUserName(userName);
        //?faces-redirect=trueを入れるとブラウザ上でもページが遷移する(リダイレクトだから)
        return "chat?faces-redirect=true";
    }
}
0008 ◆WeIzaoS14noj 2011/03/23(水) 01:51:26.54ID:???
・chat.html
→新規
 →その他
  →JavaServer Faces
   →JSF ページ
    →ファイル名「chat」
完了
※今回は遷移後の確認画面としてのみ利用。

ここまで出来たら実行して確認。未入力欄があると入力欄横にエラーメッセージ、
入力要件を満たすと次画面に遷移します。
値検査、画面遷移、セッション管理が出来ました。Strutsより簡単です。
0009 ◆WeIzaoS14noj 2011/03/23(水) 01:52:12.41ID:???
【4.さっそくAjax化しよう】
・index.xhtml
---------------------------------------------------------------------------
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>AjaxChat ログインページ</title>
    </h:head>
    <h:body>
        <h1>AjaxChat ログインページ</h1>
        <h:form id="loginForm" prependId="false">
            Room Name: <h:inputText id="roomName" value="#{loginPage.roomName}" validator="#{loginPage.validate}" />
            <h:message id="roomNameError" for="roomName" style="color: red"/><br />
            User Name: <h:inputText id="userName" value="#{loginPage.userName}" validator="#{loginPage.validate}" />
            <h:message id="userNameError" for="userName" style="color: red"/><br />
            <h:commandButton id="login" value="Login" action="#{loginPage.login}">
                <f:ajax execute="roomName userName" render="roomNameError userNameError"/>
            </h:commandButton>
        </h:form>
    </h:body>
</html>
■ このスレッドは過去ログ倉庫に格納されています