RSSリーダーを作成しました②

こんにちは、廣川です。
今回はAeroGearについてです。

今回はRestを使用したシステムということで、AeroGearというフレームワークを使用しました。
（※そもそもAeroGearを使用するためのシステムとしてRSSリーダーを作成することにした、という順番が正しいのですが）
AeroGearとは、JBossコミュニティが運営しているオープンソースのモバイル連携ライブラリです。
AeroGearには大きく分けて２通りの使用方法があります。
・RestfulなHTMLアプリケーションを作成する
・PhoneGapのようにHTML、CSS、Javascriptによってモバイル用のネイティブアプリを作成する
今回は前者についてです。
以下、AeroGearの導入方法について記述します。

1.サーバ側
準備として、AeroGearのライブラリをDLし、プロジェクト内に配置します。
まず、AbstractRoutingModuleを継承した、ルーティングを行うクラスを作成し。設定を行います。

public class Routes extends AbstractRoutingModule  {
	@Override
	public void configuration() throws Exception {

		route()
				// ①パスを指定。
				.from("/rss")
				// ②メソッドを指定。
				.on(RequestMethod.POST)
				// ③受け取るデータ形式を指定。
				.consumes(JSON)
				// ④返却するデータ形式を指定。
				.produces(JSON)
				// ⑤処理するクラスとメソッドを指定。
				.to(RssEndPoint.class).create(param(Rss.class));

		route()
				.from("/rss/{id}")
				.on(RequestMethod.GET)
				.consumes(JSON)
				.produces(JSON)
				.to(RssEndPoint.class).getList(param("id"));

	}
}

上記の記述で、
「①/rssというパスに対する②POSTリクエストを受け取ったとき、③JSON形式でデータを受け取り、⑤UserEndPointというクラスのcreateメソッドで処理を行い、④JSON形式で結果を返却する」
という設定が出来ます。
また各処理は、以下のようにリクエストされるため、パスとメソッドはその通りに受け取るよう設定します。
・登録 -> /XXX POST
・更新 -> /XXX/{id} PUT
・削除 -> /XXX/{id} DELETE
・取得 -> /XXX GET
（※XXXは上記Routesファイルで言うRSSの部分）
ここで作成したルーティングは、AeroGear.jsを用いたパイプライン通信でなければエラーになります。
@PathなどのJAX-RSアノテーションの代替としては使用できないので、注意してください。

param(Rss.class)を指定することで、受け取ったJSONデータを当該クラスのオブジェクトに自動的に変換してくれます。
@JsonSerializeアノテーションをつけて自分で実装したクラスで特殊な変換を行わせることも可能なようです。

ここで呼び出しているRssEndPointは、以下のようなファイルです。

public class RssEndPoint {
	public Rss create(Rss rss){

		/* 登録処理 */

		return rss;
	}

	public List getList(String id){
		List results;

		/* 取得処理 */

		return results;
	}
}

Rssオブジェクトを返却するとJSON（※Routesクラスで設定したデータ形式）として自動的に返却します。
RssのListを返却すると、JSONのListとして自動的に返却します。

2.例外時の動作
routesファイルに以下のような記述を追加することで、例外時の処理を設定することができます。

	// ユニーク制約違反
	route()
		.on(UniqueException.class)
		.produces(JSON)
		.to(Warning.class).duplicate(param(UniqueException.class));

上記の例だと、UniqueExceptionが発生した場合に、Warning.classのduplicateメソッドの処理を行います。
Warning.javaクラスは以下のようなファイルです。

public class Warning {
	public ErrorResponse duplicate(UniqueException exception) {
		return new JsonErrorResponse(HttpServletResponse.SC_BAD_REQUEST).message("error", "duplicate");
	}
}

duplicateが発生した時に、duplicateというerrorを返却するようにしています。

3.クライアント側
準備として、以下のライブラリをHTMLに記述します。

  <script type="text/javascript" src="js/libs/modernizr-2.6.2.min.js"></script>
 <script type="text/javascript" src="js/libs/underscore-min.js"></script>
 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.js"></script>
 <script>window.jQuery || document.write( '<script src="js/libs/jquery-1.8.2.min.js"><\/script>' )</script>
 <script type="text/javascript" src="js/libs/aerogear.js"></script>

ちなみに、４行目にある「window.jQuery || document.write( ‘<script src=”js/libs/jquery-1.8.2.min.js”><\/script>’ )」は、
window.jQueryが正常に読み込まれているかどうか判断し、読み込まれていなければアプリケーションサーバから読み込ませる、という処理です。
３行目で、JQueryをGoogleのサーバから取得しているのですが、もしサーバダウン等で読み込めなかった場合のために、安全策をとっています。
次に、JavaScriptファイルを作成し、以下のように記述を行います。

$( function() {
	// ①パイプラインを作成する
	var aerogearPipes = AeroGear.Pipeline([
				 {
					 name: "rss"
				 },
			 ]),
			 rssPipe = aerogearPipes.pipes[ "rss" ];
	// ②データストアを作成する
	var dm = AeroGear.DataManager(["rss"]),
			rssStore = dm.stores[ "rss" ],
});

まず、①のようにパイプラインを作成します。
パイプラインは、サーバ側との接続を行うオブジェクトです。
nameで指定したURLに自動的にアクセスするように設定されます。
「http://{ホスト名}/{アプリケーション名}/{nameで指定した名称。上記で言うとrss}」
に対し、アクセスを行うことになります。
次に、②のようにデータストアを作成します。
データストアはサーバから取得したデータを保持するオブジェクトです。

下準備はこれで完了です。あとは以下のような記述で、CRUD処理が行えます。

	// ③読み込み
	// 「http://{ホスト名}/{アプリケーション名}/rss/id」に対してGETリクエストを行う
	var data = rssPipe.read();

	// ④更新
	// dataにidがあれば、「http://{ホスト名}/{アプリケーション名}/rss/」に対してPUTリクエストを行う
	// dataにidがなければ、「http://{ホスト名}/{アプリケーション名}/rss/」に対してPOSTリクエストを行う
	rssPipe.save(data);
	// ⑤削除
	// 「http://{ホスト名}/{アプリケーション名}/rss/id」に対してDELETEリクエストを行う
	rssPipe.remove(data);

また、パイプラインへのアクションに対し、オプションを設定できます。
主に、取得成功時・失敗時の処理を記述することが多いです。

	var readOption = {
				success:function(data, textStatus, xhr){
					// 取得に成功したら、データストアにデータを保存
					rssStore.save(data);
				},
				error:function(xhr, textStatus, errorThrown){
					if(xhr.responseJSON.error == "duplicate"){
						// 重複エラーの場合の処理
					} else {
						// それ以外のエラーの場合の処理
					}
				},
		};
	rssPipe.read(option);

上記１～３の記述で、RSSの情報をやり取りするサーバとクライアントが完成しました。
③の「HTMLの描画について」に続きます。