ラベル Java EE の投稿を表示しています。 すべての投稿を表示
ラベル Java EE の投稿を表示しています。 すべての投稿を表示

2014年11月9日日曜日

Java EEとmonacoindでWEB Walletを作ってみた④ 動作確認


今回はここまでで作成したMonacoin WEB Walletの動作確認です。


まずはトップ画面を表示します。

ユーザ名が空の状態でログインしてみます。
@NotNullのバリデーションにひかかって、エラーが表示されます。

monacoindが起動していない状態で何か入れてログインしてみます。
当然エラーになります。

ちなみに今回は認証部分は未実装ですが、ログイン部分の判定をfalseにして認証エラーにした場合はこうなります。

monacoindを起動してログインしてみます。
新規の受信用アドレスが作成されて表示されます。
トランザクション履歴はまだないので空です。

表示されたWallet Address宛に送金してみます。
まだ認証されていないのでBalanceは0ですが、トランザクション履歴のところで送金されてきたことが確認出来ます。
また、このタイミングで新しい受信用アドレスが払い出されて表示されます。

しばらく待つと承認されてBalanceに反映されます。
トランザクション履歴のConfirmationsもちゃんと進んでいます。

続いて送金部分ですが、まず送金先アドレスが空の状態でSendボタンをクリックしてみます。
required="true"にひかかってエラーが表示されます。

おかしなアドレス宛に送金してみます。
JSON-RPCで返ってきたエラーが、Sendボタンの横に表示されます。

送金額をゼロにしてみます。
<f:validateDoubleRange minimum="0.00000001"/>にひかかってエラーが表示されます。

送金額を残高以上の金額にしてみます。
JSON-RPCで返ってきたエラーが表示されます。

送金が成功すると、成功したトランザクションIDが表示されます。
二重送信にならないよう、ここで送金先や送金額を消したほうが良さそうですね。

即、PC側のWalletに振り込まれてきました。


しばらく待つと、Confirmationsも問題なく進みました。

さすがBitcoinから延々と使いまわされてきたAPIだけあって、特に違和感なく動作します。

JSFについてはいくつか分からないところもありましたが、慣れたらなかなか効率的にWEBサービスが作れそうな感じです。


Read More...

2014年11月8日土曜日

Java EEとmonacoindでWEB Walletを作ってみた③ Walletの情報を保持するバッキングBeanを作成する


引き続き、MonacoinのWEB Walletを作成していきます。

今回はアカウントにひもづくWalletの情報を保持したり、送金処理をしたりするバッキングBeanです。

  • AccountBean

monacoindから取得したアカウントの情報をリクエストスコープで保持するバッキングBean。
リクエスト毎に最新の情報を取得して画面を更新するメソッドを持つ。
前回作成したUserBeanInjectして、アカウント名などを利用する。
受信用アドレス、残高、トランザクション履歴、送金先アドレス、送信金額を保持し、送金を実行するメソッドを持つ。


それではまずコードです。

package monawebwallet;

import java.io.IOException;
import java.io.Serializable;
import java.util.List;
import java.util.Map;
import javax.inject.Named;
import javax.enterprise.context.RequestScoped;
import javax.inject.Inject;
import lombok.Getter;
import lombok.Setter;
import lombok.NoArgsConstructor;

@Named(value = "accountBean")
@RequestScoped
@NoArgsConstructor
@Getter
@Setter
public class AccountBean implements Serializable {

    @Inject
    UserBean user;

    String addressStr;
    String balanceStr;

    List<Map<String, String>> transactionMapList;

    String toAddress;
    double amount;

    public void updateAccount() {
        if (user.isLogin()) {
            try {
                addressStr = CoindUtil.getaccountaddress(user.getAccountStr());
                balanceStr = CoindUtil.getbalance(user.getAccountStr());
                transactionMapList = CoindUtil.listtransactions(user.getAccountStr());
            } catch (IOException | CoindException ex) {
                user.loginFormMessage(ex.getMessage());
                clear();
            }
        } else {
            clear();
        }
    }

    public void clear() {
        user.logout();
        addressStr = "";
        balanceStr = "";
        transactionMapList = null;
    }

    public void send() {
        try {
            String txid = CoindUtil.sendfrom(user.getAccountStr(), toAddress, amount);
            user.sendFormMessage("送信成功 : " + txid);
        } catch (IOException | CoindException ex) {
            user.sendFormMessage(ex.getMessage());
        }
    }
}

まず、受信用アドレス、残高、トランザクション履歴を更新するためのupdateAccount()メソッドを作成します。

それぞれJSON-RPCmonacoindから取ってきます。
何かエラーが出たときのために、すべてを消し去るためのclear()メソッドも作成しておきます。


ちなみにこのupdateAccount()ですが、リクエスト毎に毎回実行する初期化処理のようなものですが、@PostConstructを設定しなかったのには理由があります。

どうやら@PostConstructなメソッドが呼ばれるのは、画面を更新した時で、forrmsubmitした時にも呼ばれるのですが、formaction属性に指定したメソッドが呼ばれるまえに、@PostConstructなメソッドが呼ばれるようです。

submitの結果値が変わった場合は良いのですが、action属性のメソッドで値が変わった場合は反映されません。

例えば、ログアウト処理を実行するメソッドをaction属性に指定していた場合、ログアウト処理前の状態で@PostConstructが呼ばれてしまい、一旦無駄なJSON-RPCが飛んでしまう上、ログアウト処理後の状態でもう一度呼ぶ必要があります。

また、ログイン時は認証エラーでも一旦submitされるので、認証出来てない状態でJSON-RPCが飛んでしまいます。

①submit
②バッキングBeanのプロパティへ値反映
③@PostConstructなメソッド実行
④action属性のメソッド実行
⑤action属性のメソッド実行結果反映
⑥描画

ということで、上記⑤と⑥の間に差し込むために、@PostConstructは付けずに、headタグ内のEL式でupdateAccount()を呼んでいます。


最後に送金処理ですが、送金に関する一時的な情報をココで持つのはちょっと抵抗があったのですが、h:commandButtonタグのaction属性に設定したメソッドに、h:inputTextタグのvalueを渡す方法がよく分からなかったのでこうなりました。

これは間違いなくもっと良い方法がありそうですね。

formIdUIComponentを特定して直接取ってくるとかが出来るのかな?

とりあえず今回は動いたから良しとします。


これですべて実装し終わったので、次回は動作確認です。


Read More...

2014年11月7日金曜日

Java EEとmonacoindでWEB Walletを作ってみた② ユーザー情報を保持するバッキングBeanを作成する


引き続き、MonacoinのWEB Walletを作成していきます。

今回はアカウント名を保持するバッキングBeanです。


  • UserBean

ユーザ情報としてアカウント名をセッションスコープで保持するバッキングBean。
ログイン、ログアウト、ログイン状態確認のメソッドを持つ。(認証は未実装)
エラーメッセージ表示用のメソッドもここに作成。

エラーメッセージ表示については、ここに作るのが適正なのかはちょっとよく分からないですが、このバッキングBeanをInjectしてしまえば他からも使えるので、とりあえず。


それではまずコードです。

package monawebwallet;

import java.io.Serializable;
import javax.enterprise.context.SessionScoped;
import javax.inject.Named;
import javax.validation.constraints.NotNull;
import lombok.Getter;import lombok.Setter;

@Named(value = "userBean")
@SessionScoped
@Setter
@Getter
public class UserBean implements Serializable {

    @NotNull
    String accountStr;

    public boolean isLogin() {
        return accountStr != null && accountStr.length() > 0;
    }

    public void login() {
        if (true) {
            System.out.println("login");
        } else {
            logout();
        }
    }

    public void logout() {
        accountStr = "";
        System.out.println("logout");
    }

    public void loginFormMessage(String message) {
        message("loginForm:account", message);
    }
    
    public void sendFormMessage(String message) {
        message("sendForm:send", message);
    }

    private void message(String formId, String message) {
        FacesContext context = FacesContext.getCurrentInstance();
        UIComponent component = context.getViewRoot().findComponent(formId);
        String clientId = component.getClientId(context);
        context.addMessage(clientId, new FacesMessage(message));
    }
}

まず、この辺はおさらいですが、@NamedでCDI管理とし、EL式から参照するためにuserBeanという名前をつけます。

IDを保持させるので@SessionScopedでセッションスコープを設定します。


バッキングBeanの初期設定が終わったら、ユーザID保持用のaccountStr変数を用意します。
accountStrはnullや空文字をNGとしたいので、BeanValidationのアノテーションを設定します。

ただし、@NotNullを設定しても、デフォルトでは空文字を通してしまいます。
テキストボックスに何も入力されていない状態はnullではなく空文字です。

JSF標準のValidatorではなく、HibernateValidator@NotBlankを使う手もありますが、以下のようにweb.xmlに若干追加するだけで@NotNullでも空文字を蹴るようになります。

<context-param>
  <param-name>
    javax.faces.INTERPRET_EMPTY_STRING_SUBMITTED_VALUES_AS_NULL
  </param-name>
  <param-value>true</param-value>
</context-param>

ただ、h:inputTextタグのrequired属性をtrueにすることで、どうやら同じことが可能なようなので、そちらのほうが良いかもしれません。
(と、後で気づいたけどせっかくなのでメモとして残しておく)


メソッドはlogin()logout()と、ログイン状態を判定するisLogin()を作成します。

現時点では認証ロジックの実装は行わず、login()メソッドを呼ぶと無条件でログイン成功とします。


最後にエラーメッセージ表示用のmessage()メソッドも作成しておきます。

formIdformタグのIDとinputタグなどのIDをコロンでつないだものです。

formIdをキーにしてUIComponentを取得し、getClientId()clientIdを取得します。

これでエラーメッセージをハンドリング出来るようになります。


まだ続きます。

Read More...

2014年11月6日木曜日

Java EEとmonacoindでWEB Walletを作ってみた① JSFでUIを作成する


前回作ったmonacoindユーティリティクラスを利用して、MonacoinのWEB Walletを作成してみます。


まず全体の構成としては、HTMLは1ページでログイン状態によって表示を変え、バッキングBeanはセッションスコープでアカウント名を保持するものと、リクエストスコープでアカウントの情報を保持するもので構成します。


  • 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://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Monacoin Web Wallet</title>
        #{accountBean.updateAccount()}
    </h:head>
    <h:body>
        <h:outputLink value="/MonaWebWallet/">トップ</h:outputLink>
        <h:form id="loginForm">
            <h:message for="account" /><br />
            <h:inputText id="account" value="#{userBean.accountStr}" rendered="#{! userBean.isLogin()}" />
            <h:commandButton value="Login" action="#{userBean.login()}" rendered="#{! userBean.isLogin()}" />
            <h:commandButton value="Logout" action="#{userBean.logout()}" rendered="#{userBean.isLogin()}" />
            <br />
        </h:form>

        <h:form rendered="#{userBean.isLogin()}">
            Account : <h:outputText value="#{userBean.accountStr}" />
            <br />
            Wallet Address : <h:outputText value="#{accountBean.addressStr}" />
            <br />
            Balance : 
            <h:outputText value="#{accountBean.balanceStr}">
                <f:convertNumber type="number" currencySymbol="#,##0.00000000" />
            </h:outputText>
            <br /><br /><br />
        </h:form>

        <h:form id="sendForm" rendered="#{userBean.isLogin()}">
            Send to : 
            <h:inputText id="sendTo" value="#{accountBean.toAddress}" size="50" maxlength="34" required="true">
                <f:validateLength maximum="34" minimum="34" />
            </h:inputText>
            <h:message for="sendTo" />
            <br />
            Amount : 
            <h:inputText id="sendAmount" value="#{accountBean.amount}" required="true">
                <f:validateDoubleRange minimum="0.00000001"/>
            </h:inputText>
            <h:message for="sendAmount" />
            <br />
            <h:commandButton id="send" value="Send" action="#{accountBean.send()}" rendered="#{userBean.isLogin()}" />
            <h:message for="send" />
            <br /><br />
        </h:form>

        <h:form rendered="#{userBean.isLogin()}">
            Transactions : <br />
            <h:dataTable border="1" var="transactionMap"
                         value="#{accountBean.transactionMapList}" rendered="#{accountBean.transactionMapList != null and ! accountBean.transactionMapList.isEmpty()}">
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Date"/>
                    </f:facet>
                    <h:outputText value="#{transactionMap.time * 1000}">
                        <f:convertDateTime pattern="yyyy/MM/dd HH:mm:ss" timeZone="JST"/>
                    </h:outputText>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Type"/>
                    </f:facet>
                    <h:outputText value="#{transactionMap.category}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Address"/>
                    </f:facet>
                    <h:outputText value="#{transactionMap.address}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Amount"/>
                    </f:facet>
                    <h:outputText value="#{transactionMap.amount}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Confirmations"/>
                    </f:facet>
                    <h:outputText value="#{transactionMap.confirmations}"/>
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Transaction ID"/>
                    </f:facet>
                    <h:outputText value="#{transactionMap.txid}"/>
                </h:column>
            </h:dataTable>
        </h:form>
    </h:body>
</html>


まず、ヘッダー部分にEL式でバッキングBeanのメソッドが仕込んであり、ここで初期化処理を行っています。

Javascriptで言うところの、bodyタグのonLoradのつもりで使っていますが、ここでやるのが正しいのかは良く分かりません。
何かもっとそれっぽい方法がありそうですが、色々調べたり実験したりしたのですが、これしかうまくいきませんでした。


続いて中身を見ていきますが、基本的に入力が必要なものはh:inputTextタグ、バッキングBean側から表示が必要なものはh:outputTextタグを利用しています。

トランザクション履歴については、h:dataTableタグでListtableに変換して表示します。

それぞれEL式でバッキングBeanのプロパティへバインドします。


バリデーション周りについては、アカウント名入力欄については、バッキングBean側でバリデーションをかけて入力必須にし、HTML側では特に何も設定していません。

送金先アドレスや金額欄については、f:validateLengthタグで文字列の長さ、f:validateDoubleRangeタグで数値の桁数、required属性で入力必須にしています。

入力必須にするだけであれば、後者のほうが楽なのでこっちに統一で良さそうな感じです。


エラーメッセージを表示したい場所については、h:messageタグを設置し、for属性でinput部品と関連付けます。

バリデーションのエラーを表示させたり、バッキングBeanから指定のメッセージを表示させたりします。


最後に表示非表示についてですが、ブロック毎にh:formタグで囲み、rendered属性で表示非表示を切り替えました。
やり方として正しいのか良く分かりませんが、divタグとかではrendered属性が使えないようで、コレしか思いつきませんでした。


これでUIのパーツは揃ったので、次回はバッキングBeanの作成です。


Read More...

2014年11月3日月曜日

Javaでmonacoindユーティリティクラスを作成する② WEB Walletに必要なメソッドの実装



引き続きユーティリティクラスの作成です。

Walletに最低限必要な以下4つのメソッドを実装します。

getaccountaddress
getbalance
listtransactions
sendfrom


まず、JSONRequestクラスですが、メンバ変数はString型のidmethodList<Object>型のparamsです。

idはレスポンスに同じidが含まれて返ってくるだけで、取り合えずは使わないのでハードコードしてしまいます。

methodはそれぞれのメソッド文字列を保持します。

paramsはメソッドにより異なり、sendfromでは送り先アドレスや金額もこのparamsに保持させます。

  • getaccountaddress

アカウント文字列を渡すと、アカウントの最新の受信用アドレスを返します。

public static String getaccountaddress(String accountStr) throws IOException, CoindException {
    String method = "getaccountaddress";

    List<Object> params = new ArrayList<>();
    params.add(accountStr);
    JSONResponse addressRes = connectCoind(createJSONString("1", method, params));

    return addressRes.result.toString();
}

  • getbalance

アカウント文字列を渡すと、アカウントの残高を返します。

public static String getbalance(String accountStr) throws IOException, CoindException {
    String method = "getbalance";
    List<Object> params = new ArrayList<>();
    params.add(accountStr);
    JSONResponse balanceRes = connectCoind(createJSONString("1", method, params));
    return balanceRes.result.toString();
}

  • listtransactions

アカウント文字列を渡すと、トランザクション履歴を返します。
何件目から何件目までという取得の仕方も可能ですが、今回は実装しません。

public static List<Map<String, String>> listtransactions(String accountStr) throws IOException, CoindException {
    String method = "listtransactions";
    List<Object> params = new ArrayList<>();
    params.add(accountStr);
    JSONResponse transactionsRes = connectCoind(createJSONString("1", method, params));
    return (List<Map<String, String>>) transactionsRes.result;
}

  • sendfrom

アカウント文字列、送信先アドレス、金額を渡し、成功するとそのトランザクションIDを返します。
送信先アドレスの無効、金額不足など、エラーの発生しやすいメソッドです。

public static String sendfrom(String accountStr, String toAddress, double amount) throws IOException, CoindException {
    String method = "sendfrom";
    List<Object> params = new ArrayList<>();
    params.add(accountStr);
    params.add(toAddress);
    params.add(amount);
    JSONResponse sendRes = connectCoind(createJSONString("1", method, params));

    return sendRes.result.toString();
}


ちなみにアカウント名を空文字列にすれば、アカウント名を指定しなかったことになって残高などWallet全体の数字になるかと思いきや、空文字列もアカウントとしては有効で、空文字アカウントの残高が返されます。

エラー周辺で結構ハマりましたが、これで一通り必要な機能が実装できました。


Read More...

Javaでmonacoindユーティリティクラスを作成する① JSONを扱う


今回は、JSON-RPCmonacoind操作全般を受け持つユーティリティクラスを作成します。


まずはJSONの扱いですが、2013年のJava EE7の頃に、標準のJSONライブラリが追加されたとか聞いていましたが、あんまりいけてないようです。
POJOにバインドする機能とかもないらしく、自前でマッピングしてあげないといけない?

まぁ実際のところはよく分かりませんが、無難にJacksonを使います。

公式からjackson-corejackson-databindをダウンロードしてライブラリに登録しておきます。


リクエスト用とレスポンス用のPOJOをそれぞれ作成し、Jacksonを使ってinoutstreamと直接変換します。

  • リクエスト用クラス

バージョンは1.0固定で良さそうなのでハードコードしてしまいます。
final宣言しておくと、@AllArgsConstructorアノテーションでもjsonrpc抜きのコンストラクタが作成されます。

paramsにはStringdoubleが入るので、Object型にしておきます。

@AllArgsConstructor
@Getter
@Setter
public class JSONRequest {

    final String jsonrpc = "1.0";
    String id;
    String method;
    List<Object> params;
}

  • レスポンス用クラス

errorは普段nullですが、エラーの場合にはエラー番号やエラー内容がまとめて入ってくるので、MapvalueObject型にしておきます。

@Getter
@Setter
public class JSONResponse {

    Object result;
    Map<String, Object> error;
    String id;
}

また、monacoindとの通信で発生するエラーを格納するExceptionクラスも作成しておきます。

  • monacoind用Exceptionクラス

monacoindが返してきたエラーメッセージを格納出来るようにしておきます。

@NoArgsConstructor
public class CoindException extends Exception {

    public CoindException(String msg) {
        super(msg);
    }
}

前準備は整ったので、ここからはCoindUtilクラスを作成し、必要なメソッドを実装していきます。

  • リクエスト用文字列を作成するメソッド

ObjectMapperクラスのwriteValueAsStringメソッドで、JSONRequestクラスからJSON文字列を作成します。

public static String createJSONString(String id, String method, List<Object> params) throws JsonProcessingException {
    JSONRequest jsonRequest = new JSONRequest(id, method, params);

    return new ObjectMapper().writeValueAsString(jsonRequest);
}

  • JSON文字列を受け取り、monacoindと通信するメソッド

今回はメインPCから実験用PCにアクセスしているので、monacoin.confrpcallowipでローカルホスト以外からのアクセスも許可しています。
ID、PWはmonacoin.confに設定したID、PWです。

リクエストはJSON文字列をOutputStreamPrintWriterでそのまま書き込んで送信します。

何気に、try-with-resource初めて使ったかも。


レスポンスはInputStreamを受け取って、ObjectMapperクラスのreadValueメソッドで、JSONResponseクラスに変換します。

IOExceptionはそのまま上に投げ、monacoindがエラーを返した場合は、先ほど作成したCoindExceptionにメッセージを渡してから上に投げます。

public static JSONResponse connectCoind(String json) throws IOException, CoindException {
  
    final String urlStr = "http://192.168.1.15:9359";
    final String rpcuser = "rpcuser";
    final String rpcpassword = "rpcpassword";

    URL url = new URL(urlStr);
    URLConnection connection = url.openConnection();

    Authenticator.setDefault(new Authenticator() {
        @Override
        protected PasswordAuthentication getPasswordAuthentication() {
            return new PasswordAuthentication(rpcuser, rpcpassword.toCharArray());
        }
    });
    connection.setDoOutput(true);

    connection.setRequestProperty("content-type", "text/plain;");
    OutputStream out = connection.getOutputStream();

    try (PrintWriter pw = new PrintWriter(out)) {
        pw.print(json);
    }

    JSONResponse response;
    try (InputStream in = connection.getInputStream()) {
        ObjectMapper mapper = new ObjectMapper();
        response = mapper.readValue(in, JSONResponse.class);
    } catch (IOException e) {
        try (InputStream es = ((HttpURLConnection) connection).getErrorStream()) {
            ObjectMapper mapper = new ObjectMapper();
            response = mapper.readValue(es, JSONResponse.class);
        }
    }

    Optional<Map<String, Object>> errorOpt = Optional.ofNullable(response.error);
    if (errorOpt.isPresent()) {
        throw new CoindException((String) errorOpt.get().get("message"));
    }

    return response;
}


ここで死ぬほどハマったのが、cURLからだと問題無くJSONでエラーが返ってくる状況で、普通にInputStreamを取り出すと、HTTP response code: 500が返って来たことです。

エラーの内容を見たいのに、500が返ってくるとIOExceptionが投げられてしまい、InputStreamを弄れません。

そして、Google先生との長い対話の末たどり着いたのが、ErrorStreamです。

まず一度IOExceptioncatchして、URLConnectionHttpURLConnectionにキャストした上で、getErrorStream()で改めてInputStreamを取得します。

コイツを弄ってやると、ちゃんとmonacoindが返したエラーが読めました。

エラーメッセージが読めた時は感動しましたが、これ設計としてどうなんでしょうか?常識なの?
なんだか釈然としません。


そして最後にせっかくなのでJava8で導入されたOptional使ってみました。
が、ラムダ式内部からExceptionを投げるのがうまくいかなかったので、普通にif文判定。

わざわざOptionalを使った意味があるかは不明ですが、いいんです。
使いたかっただけだから。


次回は実際にmonacoindとやり取りするメソッドの実装です。

Read More...

2014年9月7日日曜日

NetBeansを使ったJava EEアプリケーション開発


最近のJava Webフレームワークについて調べてみたところ、どうやらJava EEが良いようなので、今回はJava EEに手を出してみます。


Java EEについて調べていると、EclipseよりNetBeansで説明されていることが断然多いです。
単にJavaでの開発というとシェア的にはEclipseに分があるものの、Java EEやるならNetBeansって事でしょうか。

今まではEclipse派でしたが、NetBeansはインストールしたらすぐ使える的なことも良く書いてあるので、今回はNetBeansを試してみようと思います。


まずは、NetBeansのインストールからと言いたいところですが、NetBeansのサイトからダウンロードしてインストーラの指示通りインストールするだけでした。

インストールは割愛し、プロジェクトの作成、バッキングBeanの作成、JSFページの作成について、基本的な部分を試してみます。

今回は、ユーザー名を入力してログインボタンを押すと、ログインしたユーザー名を表示し、ログアウトボタンを押すとユーザー名が消えるだけのサイトを作成します。

  • プロジェクトの作成

新規プロジェクト⇒Java Web⇒WEBアプリケーション

プロジェクト名の入力

Java EEのバージョンやアプリケーションサーバの選択

フレームワークの選択

必要なファイルと階層構造が生成されます。

おもむろに実行すると、初期状態のindex.xhmlが開きます。

ここまでは細かい設定いらず、非常に簡単です。


また、コードを触る前にLombokというライブラリを入れておきます。
ボイラープレートコードをアノテーションだけでコンパイル時に生成してくれるかなり使えるライブラリです。

設定はLombokのサイトからlombok.jarをダウンロードして、ライブラリフォルダに登録するだけです。


  • バッキングBeanの作成

新規⇒JavaServer Faces⇒JSF管理対象Bean

Bean名やパッケージ名の入力

ソース・パッケージフォルダに指定した名前のjavaファイルが生成されます。
表示させると以下のようなコードになっています。

package monawebwallet;

import javax.inject.Named;
import javax.enterprise.context.SessionScoped;
import java.io.Serializable;

@Named(value = "loginBean")
@SessionScoped
public class LoginBean implements Serializable {

    /**
     * Creates a new instance of LoginBean
     */
    public LoginBean() {
    }
   
}

いわゆるJavaBeansですが、@Named@SessionScopedの二つのアノテーションを使用しています。

@Namedアノテーションは決まりごとで、ここで指定した名前(value)でELからアクセス出来ます。

@SessionScopedアノテーションは、バッキングBeanのスコープを定義します。
他にも@RequestScoped@ApplicationScopedなどがありますが、アカウントを保持させるので、ここではセッションスコープにしました。

このコードにアカウント文字列を保持するプロパティを追加し、Lombokの@NoArgsConstructor@Getter@Setterアノテーションを付けます。

package monawebwallet;

import java.io.Serializable;
import javax.enterprise.context.SessionScoped;
import javax.inject.Named;
import lombok.NoArgsConstructor;
import lombok.Getter;
import lombok.Setter;

@Named(value = "userBean")
@SessionScoped
@NoArgsConstructor
@Getter
@Setter
public class UserBean implements Serializable {

    String accountStr;
}

非常にすっきりしていますが、これでデフォルトコンストラクタとゲッター、セッターがコンパイル時に生成されます。


  • JSFページの作成

新規⇒JavaServer Faces⇒JSFページ

ファイル名の入力

Webページフォルダ直下に指定した名前のxhtmlファイルが生成されます。

ちなみにこのページにアクセスするには、http://localhost:8080/MonaWebWallet/login.xhtmlではなく、http://localhost:8080/MonaWebWallet/faces/login.xhtmlです。

デフォルトのindex.xhtmlについては、http://localhost:8080/MonaWebWallet/でアクセス可能ですが、実際にはweb.xmlでウェルカムページとして設定されている、faces/index.xhtmlにアクセスしています。

詳しくはweb.xmlを見て頂きたいのですが、faces配下のファイルがFacesServletの管理対象としてマッピングされています。

これ、faces配下じゃないほうにアクセスしても普通のhtml部分は表示されるため、ちょっとハマりました。
そして、そのままFacesServletが処理する前のソースが見えてしまうのでなんだか微妙なのですが、表示させない方法についてはまた別の機会に。


新規でJSFページを作る際は上記の流れですが、今回はデフォルトで生成されている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://xmlns.jcp.org/jsf/html">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        Hello from Facelets
    </h:body>
</html>

<h:body>タグ内を以下のように書き換えます。

<h:form>
    <h:inputText id="account" size="30" value="#{userBean.accountStr}" />
    <h:commandButton id="login" value="ログイン" />
    <h:commandButton id="logout" value="ログアウト" actionListener="#{userBean.setAccountStr('')}" />
</h:form>
<b><h:outputText value="#{userBean.accountStr}" /></b>

#{userBean.accountStr}のように、ELを使用することでバッキングBeanのプロパティにアクセス出来ます。

<h:form>タグの中に<h:inputText>タグを入れて、valueにELでバッキングBeanのプロパティを設定しておくと、フォームをSubmitした際に、プロパティのセッターが呼ばれて値が格納されます。

<h:outputText>タグのvalueに設定すると、プロパティのゲッターが呼ばれて、値が取り出されます。

ログイン前

ログイン後

  • 日本語対応

日本語を入力すると壮大に文字化けしました。

新規⇒Glassfish⇒Glassfish ディスクリプタ

そのまま進めると、「このプロジェクトのデプロイメント構成が見つかりません。デプロイメント・ディスクリプタのバージョンを正しく設定できませんでした。」とエラーが出ましたが、とりあえず放置します。

構成ファイルフォルダの中にsun-web.xmlが生成されるので、以下のように<parameter-encoding>タグを追加します。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE sun-web-app PUBLIC "-//Sun Microsystems, Inc.//DTD GlassFish Application Server 3.0 Servlet 3.0//EN" "http://www.sun.com/software/appserver/dtds/sun-web-app_3_0-0.dtd">
<sun-web-app error-url="">
    <class-loader delegate="true"/>
    <jsp-config>
        <property name="keepgenerated" value="true">
            <description>Keep a copy of the generated servlet class' java code.</description>
        </property>
    </jsp-config>
    <parameter-encoding default-charset="UTF-8" />
</sun-web-app>

うまくいきました。

Read More...