![](/fwcr/rensai/googlewebtoolkit01/gra2.gif)
GoogleからJava開発者へのサプライズ!な贈り物、Google Web Toolkit[3]
JavaScript×HTMLとJavaのシームレスな開発環境を体験してみよう
リトルソフト株式会社 長尾寿宏
2006/8/26
Yahoo!WebサービスとGoogle Web Toolkitで、JavaScript×HTMLとJavaのシームレスな開発環境を体験しながら、ウィジェット、グリッド、スクロール、フレームなどを表示させ画像検索アプリを完成させよう。グリッドのバグ回避についても解説。 |
![]() |
Webサービスから結果セットを読み出して表示させるまで |
前々回「JavaをAjaxに変換するグーグルのGWTを使ってみよう」、前回「Yahoo!のAPIとGWTを使って画像検索アプリ!」から引き続き、画像検索アプリケーションを作成しながら、Google Web Toolkit(GWT)のプログラミングを詳しく見ていきたいと思います。
今回はGWTが提供するリモート・プロシージャ・コール(RPC)のメカニズムを利用して、Yahoo!画像検索Webサービスの結果セットをクライアント側に転送し、ユーザーインターフェイスへ表示する処理を実装します。
![]() |
RPCインターフェイスの定義とサービスメソッドの実装 |
・GWTのRPCとは?
このようにGWTクライアント側プログラムはスタンドアロンプログラムのごとく、自らのユーザーインターフェイスを描画するので、従来型のWebアプリケーションのように、HTMLページ、あるいはHTMLの断片をサーバ側に要求する必要がありません。
GWTサーバ側プログラムの実体はcom.google.gwt.user.server.rpc.RemoteServiceServletを継承したJavaサーブレットとなりますが、ユーザービュー遷移の制御やHTML生成といった一般的なWebアプリケーションフレームワークが提供している機能は存在せず、リモート・プロシージャ・コール(RPC)機能に特化した内容となっています。
GWT RPCの特徴は、クライアント側とサーバ側との間で、HTTPプロトコルにより、Javaオブジェクトを簡単にやりとりできる点です。
もちろん、クライアント側プログラムはWebブラウザの中で実行されているJavaScriptコードですので、サーバ側で生成されたJavaオブジェクトのインスタンスを直接参照しているわけではありません。
GWTが提供しているRPCメカニズムにより、サーバ側のJavaオブジェクトが自動的に直列化され、クライアント側でJavaScriptオブジェクトとして復元されるのです。クライアント側からリモートメソッドの引数としてサーバ側に渡される際も同様な直列化と復元が行われます。
![]() |
検索結果セットのクラスを作成する |
今回作成するアプリケーションでは、サーバ側プログラムの中でYahoo!検索Webサービスへの問い合わせ処理を行い、取得した結果をJavaオブジェクトに詰め込んで、クライアント側プログラムへ返却します。そこで、まず検索結果セットを格納するためのクラスを作成しましょう。
RPCメソッドのパラメータあるいは戻り値に指定する型は直列化可能な型である必要があります。具体的には、
- char、 byte、 short、 int、 long、 boolean、 float、or doubleといったプリミティブ型
- String、Dateおよびプリミティブ型のラッパークラス(Character、 Byte、 Short、 Integer、 Long、 Boolean、 Float、 Double)
- 直列化可能な型の配列
- 直列化可能なユーザー定義クラス
以上の型を指定することができます。
また、直列化可能なユーザー定義クラスを作成する場合は、IsSerializableインターフェイスを実装する必要があります。
以下が検索結果セット格納クラス(ImageSearchResultSet)のコードです。
package jp.littlesoft.gwttest1.client; |
ImageSearchResultSetクラスをはじめ、それぞれの入れ子クラスにIsSerializableインターフェイスの実装が指定されている点に注意してください。
Yahoo!検索Webサービスによって返される結果セットの詳細については、こちら(http://developer.yahoo.co.jp/search/image/V1/imageSearch.html)を参照してください。
![]() |
サービスインターフェイスの定義 |
まず作成するのは、GWT提供のRemoteServiceインターフェイスを拡張したサービスインターフェイスです。
package jp.littlesoft.gwttest1.client;
|
executeメソッドは、パラメータとして検索結果の先頭位置(start)、返却結果件数(size)、検索キーワード(keyword)を指定できます。また、戻り値の型は先に作成した検索結果セットクラス(ImageSearchResultSet)です。
1/5 | ![]() |
INDEX |
||
JavaScript×HTMLとJavaのシームレスな開発環境を体験してみよう | ||
![]() |
Page1<Webサービスから結果セットを読み出して表示させるまで/RPCインターフェイスの定義とサービスメソッドの実装/検索結果セットのクラスを作成する/サービスインターフェイスの定義> | |
Page2<サーバ側 サービスメソッドの実装/非同期インターフェイスの定義> | ||
Page3<クライアント側 検索機能の実装/ウィジェットへの値設定> | ||
Page4<グリッドの利用/グリッドのバグ回避/スクロールに伴う自動読み込み> | ||
Page5<背景色変更と内部フレーム表示/今後のバージョンアップも期待> |
Ajax関連記事 |
![]() |
Ajaxフレームワーク「Spry」で作る「リンク集2.0」 特集:AdobeのAjaxフレームワーク「Spry」を使ってみよう アドビのAjaxフレームワーク「Spry」。さっそく簡単なリンク集のサンプルを作成しながら、その機能を探ってみよう 「リッチクライアント & 帳票」フォーラム 2006/6/21 |
![]() |
古くて新しいAjaxの真実を見極める 「Webインターフェイスの新しい手法」「画期的なWebアプリケーションの仕組み」であるとして開発者たちの人気を集めるAjaxとは何なのか、その真実を見極めてみよう 最終更新 2005/8/2 |
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 (2017/7/12)
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET/POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 (2017/7/10)
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文&ループ脱出のbreak/スキップのcontinue【更新】 (2017/6/26)
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート (2017/6/12)
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
![]() |
|
|
|
![]() |