GWT‎ > ‎

GWTでのJSONPについて

JSONとは

GWTはセキュリティーの制限のため他のドメインのリソースを取得することができません。
もちろん、GoogleAppEngineなどを用いてProxyサーバーを立てればいいのですが、手間だったりします。

JSONPを使うと、異なるドメインのデーターを取得可能になります。データーはJSONと呼ばれるJavaScript形式で送られます。
最近ではtwitterやその他多くのサイトでjsonp形式でのデーターが提供されています。

GWTでのJSONP

JsonpRequestBuilderを使います。

注意事項

静的なJSONファイルは読み込めません。

例えばこういう静的なJSONデーターがあるとして、これをURLに指定して読み込もうとしてもtimeoutになります。
JSONPの仕組みとしてJavaScriptファイルとして読み込んで、callbackで指定したメソッドを呼び出してもらうことでデーターを渡すからです。
[{"en":"hello"},{"en":"hello"}]

GWTで静的なJSONを読み込むには、JsonpRequestBuilderのcallbackメソッドである、__gwt_jsonp__.I0.onSuccessを呼び出すように付け加えると最初の1回は読める場合があります。
ただしこうすると2回目移行の呼び出し(__gwt_jsonp__.I1,__gwt_jsonp__.I2と変化するため)、そしてGWT以外あるいは将来のGWTで読み込めなくなる可能性があります。
通常は動的にcallbackというパラメータを受け取ってその関数にJSONデーターを渡すよう加工する必要があります。
__gwt_jsonp__.I0.onSuccess([{"en":"hello"},{"en":"hello"}])

静的JSONPファイルなのにコールバック関数名を指定できるJavaScript という手法もあるようです。(未挑戦)


setCallbakについて

JsonpRequestBuilder.setCallbackParam(param)にてcallback名を指定可能です。デフォルトではcallbackとなっています。
このcallback名は、jsonに加えるファンクション名を指定するためのパラメター名です。普通はcallbackとなっていますが、違う場合に、このメソッドで指定します。

例えば、JsonpRequestBuilderでtwitterのタイムラインデーターを取得するjsonを指定した場合
http://twitter.com/status/user_timeline/akjavacom.json

内部ではcallback付きのURLが呼び出されています。
http://twitter.com/status/user_timeline/akjavacom.json?callback=__gwt_jsonp__.I0.onSuccess

そうすることで、データー取得後 __gwt_jsonp__.I0.onSuccessが呼び出されAsyncCallBackのonSuccess()が呼ばれることになります。

JSONからJavaコードを作るには

JsonpRequestBuilderでJSONPを呼び出す場合、JSONのマップするクラスを定義した方がいいのですが、少し面倒です。

でもとっても便利なサービスがあります。
JSON to GWT JavaScriotObject
詳しくは http://d.hatena.ne.jp/k2junior/20100728
Comments