App EngineをjQueryでAjax化しBigtableをCRUD操作：Google App Engineで手軽に試すJavaクラウド（3）（3/4 ページ）

[清野克行，有限会社サイバースペース]

印刷

通知 連載「％」の新着をメールで通知

髫穂ｹ晢ｽ�Post

Shareシェア

はてなブックマーク

SharePocket Button

JavaScript（jQuery）の記述

　JavaScriptのコードでは、Ajax化のためにjQueryを使用しています。jQueryでのイベント処理は、次の2種類の方式が基本となっています。

　1つは、リスト2の（1）以下の関数で、この部分は以下の形になっています。

$(function(){
    処理コード
        ：
});

　この関数定義の中にあるコードおよび関数記述は、Webブラウザへの画面ロードが完了したタイミング、つまりタグ上での操作が可能になった時点で評価されます。ただし、$("#data").keydown(asyn);以下の3つは、イベント処理関数なので、関数内の処理は対応するイベント（例えば、キー押下）が発生したときに実行されます。

　ここでは、リスト2で【1】～【4】の処理が行われ、各処理の概要はコメントに記述してありますが、この中の【3】で特徴的な処理を行っているので、簡単に解説します。

　Ajaxで採用されるイベントリスナ方式のイベント処理では、イベントは各ノードオブジェクト（タグ）を下位ノードから上位ノードに伝搬していきます。

　この例では、登録・更新・参照・削除のラジオボタンのクリックイベントは、上位ノードのID値「crud」を持つタグで検出され、イベントにより匿名関数が呼び出されます。匿名関数の中では、クリックされたラジオボタンのID値が所得されます。

　このように、Ajaxのイベント処理では多くの下位ノード（タグ）で発生したイベントをツリー構造の上位ノード（タグ）1カ所で、まとめて検知し処理できます。

　もう1つは（2）以下の部分で、この部分では関数記述がすべて以下の形式になっており、これらの関数はすべて、ほかの関数からの関数呼び出しによって実行されます。

$(function(引数、……){
    処理コード
        ：
});

　この部分での特徴的な処理をいくつか挙げてみます。

• 【5】read関数の赤線（X）の処理方式によって、サーブレットから受信した社員情報すべてを画面上のフィールドに一気に表示でき、この処理方式は【7】の入力フィールドのクリアでも使用される
• サーバとの非同期通信は【4】のA、および【6】のB、Cで行われる

　$.get(引数…)でGETメソッド、$.post(引数…)でPOSTメソッドでサーバとの通信が行われ、それぞれ第1引数にweb.xmlで指定したサーブレットのurl-pattern、第2引数にサーバに送信するクエリ文字列を連想配列形式で指定し、第3引数はサーバからのレスポンス受信時の処理関数を指定しています。

　レスポンス受信時の処理関数は、Aのように関数名（read）を指定する形式と、B、Cのように匿名関数を指定して、その中で受信処理を行う形式の両方を使用できます。関数名指定の場合は、read関数の引数respにサーバからのレスポンスデータがセットされ、匿名関数形式の場合は匿名関数の引数にサーバ受信データがセットされて、それぞれの関数内で表示処理用に使用されます。

JavaサーブレットでBigtableをCRUD処理

　ここからはJavaサーブレットでのBigtableのCRUD処理を見ていきます。登録と参照については、前回紹介したので復習になりますが、ここでもう一度確認しておきしょう。

　前回見てきたように、JDOでBigtableへデータアクセスするためには、リスト3のデータクラスと、リスト4のPM（PersistenceManager）クラスを作成しておく必要があります。

　データクラスの定義では、前回と永続化対象のデータ項目が違うだけでほとんど同じですが、1つだけ異なる項目があります。それは、キー項目の定義です。

　前回は自動生成のキー項目を使用していましたが、このサンプルでは社員番号（empno）をキー項目に指定しています。これは、このサンプルで社員番号をキーにして検索・参照を行うための指定ですが、このようにユーザー指定の任意の項目をキー指定できます。

package erp.emp;
 
import java.util.Date;
import javax.jdo.annotations.IdGeneratorStrategy;
import javax.jdo.annotations.IdentityType;
import javax.jdo.annotations.PersistenceCapable;
import javax.jdo.annotations.Persistent;
import javax.jdo.annotations.PrimaryKey;
 
@PersistenceCapable(identityType = IdentityType.APPLICATION)
public class empmas {
 
    @PrimaryKey
    @Persistent
    private String empno;
    @Persistent
    private String empname;
    @Persistent
    private String depart;
    @Persistent
    private String section;
    @Persistent
    private Date date;
    
    public empmas(String empno, String empname, String depart, String section, Date date) {
        this.empno = empno;
        this.empname = empname;
        this.depart = depart;
        this.section = section;
        this.date = date;
    }
    
    public String getEmpno() { return empno; }
    public String getEmpname() { return empname; }
    public String getDepart() { return depart; }
    public String getSection() { return section; }
    public Date getDate() { return date; }
    
    public void setEmpno(String empno) { this.empno = empno; }
    public void setEmpname(String empname) { this.empname = empname; }
    public void setDepart(String depart) { this.depart = depart; }
    public void setSection(String section) { this.section = section; }
    public void setDate(Date date) { this.date = date; }
}

リスト3　empmas.java

　PMクラスは、package指定を今回の環境に合わせているだけで、後は前回とまったく同じコード記述になっています。

package erp.emp;
 
import javax.jdo.JDOHelper;
import javax.jdo.PersistenceManagerFactory;
 
public final class PMF {
    private static final PersistenceManagerFactory pmfInstance =
        JDOHelper.getPersistenceManagerFactory("transactions-optional");
 
    private PMF() {}
 
    public static PersistenceManagerFactory get() {
        return pmfInstance;
    }
}

リスト4　PMF.java

　以上2つのクラスファイルを準備して、いよいよ次ページでは、CRUD処理を行うサーブレットの内容を見ていきます。