SlideShare ist ein Scribd-Unternehmen logo
1 von 24
GWT アプリケーション開発の基
        本
その1  ~ DB からデータを読んで Grid に表示する ~


   (株)ケーピーエス 伊東 成幸
目次
   サンプルの紹介
   開発環境
   クライアント・サーバー間通信の概要
   クライアント モジュールの実装
   サーバー モジュールの実装
   RPC 通信の実装
   GWT の可能性 (GXT アプリケーション )
1.サンプルの紹介
   GWT アプリケーション
2.開発環境
   Java 5.0
   Tomcat 5.5
   GWT 1.6
   postgres 8.2

   Windows Vista Business
   Eclipse 3.4
3.クライアント・サーバー間通信の
概要
   通信の仕組み

  1. GWT では、クライアント・サーバー間通信をメッセージ交換
  ではなく
    手続き呼び出し (Remote Procedure Call ・以下 RPC) を使
  う。

 2 .クライアント側ではサーバーのサービスメソッドを呼び出して、
   その結果を戻り値として受け取る。

                  GWT で決められた手続きに従って
 3 .サーバー側では、サービスメソッドが呼び出される事でクライア
  ント              作成したモジュールで通信を行いま
                  す。
   からの呼び出しと引数を受信する。
                         (Ajax と同じ XMLHttpRequest をラ
4 .通信は非同期で行われる。          ップ )
3.クライアント・サーバー間通信の
概要     Client Module Server Module

GWT 側で提供
                  ServiceDefTarget   RemoteService    RemoteServiceServlet

                    < interface >     < interface >



開発者が作成

                   ServiceProxy         Service          ServiceImpl
                       ( 注 1)         < interface >

     extends
                                     ServiceAsync
     implements

 注 1 GWT が自動生                         < interface >
 成
3.クライアント・サーバー間通信の
概要
   ServiceProxy を生成するネーミングルール

    1. Proxy インターフェース名は『サービスインタフェース名 +
    Async 』

    2. Proxy のメソッド名はサービスインタフェースのメソッド名と
    同じにする。
       ⇒ 戻り値は『 void 』とする。
       ⇒ 引数の最後にサービスの結果を受ける AsyncCallback 型
         のオブジェクトを追加する
4.クライアント モジュールの実
装     Client Module Server Module

GWT 側で提供
                                                          RemoteServiceServlet
                  ServiceDefTarget   RemoteService
                    < interface >        < interface >



開発者が作成
                                     ①                    ③
                   ServiceProxy          ShohinService    ShohinServiceImpl

                       ( 注 1)            < interface >
                                     ②
     extends                         ShohinServiceAsync
     implements
                                         < interface >
 注 1 GWT が自動生
 成
4.クライアント モジュールの実
装
■   Service ・ Proxy インターフェースの作成

     ① ShohinServiceの作成
     ② ShohinServiceAsync の作成
4.クライアント モジュールの実
装
ShohinService の作成
a )マーカーインターフェースである RemoteService を継承したサービ
スの作成

b )サーバーが提供するサービスをメソッドとして宣言する。



   public interface ShohinService extends RemoteService {

           public List shohin(String shohinMakerCode);

   }
4.クライアント モジュールの実
装
②   ShohinServiceAsync の作成
    a )メソッドの戻り値を void とする

    b ) ShohinService のメソッドに AsyncCallback 型のオブジェクトを追加
    する。

    c )非同期での戻り値を AsyncCallback 型のオブジェクトで受け取る。

        public interface ShohinServiceAsync {

             public void shohin(String shohinMakerCode,AsyncCallback callback);

        }
5.サーバー モジュールの実装
■   サービスメソッドの作成とサーブレット登録

    ① ShohinServiceImpl   の作成
    ② Servlet   への登録
5.サーバー モジュールの実装
    ShohinServiceImpl の作成
    a ) HttpServlet を継承している RemoteServiceServlet を継承する。

    b ) ShohinService を実装する。

    c )サービスクラスは、サーブレットとして実行されるのでスレッドセー
    フにする。
        public class ShohinServiceImpl extends
                 RemoteServiceServlet implements ShohinService {

             public List shohin(String shohinMakerCode) {
                                         :
                   return list;
                                          内容は次ページに
             }
         }
5.サーバー モジュールの実装
   ShohinServiceImpl の作成
 


    a ) shohin メソッドの内容

         Class.forName("org.postgresql.Driver");
         Connection con =
                    DriverManager.getConnection("jdbc:postgresql://*****", "*****",
       "*****");
         String sql = "select * from shohin where shohin_maker_cd = ?;";
         PreparedStatement st = con.prepareStatement(sql.toString());
         st.setString(1,shohinMakerCode);
                                                                Shohin クラスは
        ResultSet rs = st.executeQuery();
        while (rs.next()) {                                     IsSerializable
                  Shohin shohin = new Shohin();                 を
                  shohin.setShohinCd(rs.getString(1));
                             :                                  実装した
                  list.add(shohin);                             JavaBean
        }
        return list;
5.サーバー モジュールの実装
   JavaBean(Shohin) の内容
 


    a )プロパティの定義とゲッター・セッターのみ

      public class Shohin implements IsSerializable {
                 private String shohinCd;                    他にも使用でき
                 private String shohinName;                  る型の限定があ
                               :                             ります

                public Shohin(){                             (次ページへ)
                }

                public String getShohinCd() {
                           return shohinCd;
                }
                public void setShohinCd(String shohinCd) {
                           this.shohinCd = shohinCd;
                }
                                      :
      }
5.サーバー モジュールの実装
   RPC 通信で使用できる型
 


    a )基本型・参照型・配列・クラス・ユーザ定義型があります


      基本型
        char 、 byte 、 short 、 int 、 long 、 boolean 、 float 、 double

      参照型

      String 、 Date 、 Char 、 Byte 、 Short 、 Integer 、 Long 、 Boolean 、 Float
      、 Double

      配列・クラス
               配
      列、 List 、 Map 、 Set 、 ArrayList 、 HashMap 、 HashSet 、 Stack 、 Vecto
      r、

      AbstractList 、 AbstractCollection 、 AbstractMap 、 AbstractSet 、 Collectio
      n

      ユーザ定義型
        IsSerializable インターフェースを実装したユーザ定義クラス
5.サーバー モジュールの実装
②   Servlet への登録
    a )サービスクラスを Servlet として、『 web.xml 』に登録する。


       <servlet>
            <servlet-name>shohin</servlet-name>
            <servlet-class>
                   jp.co.kpscorp.SeminarGXT.gwt.server.ShohinServiceImpl
            </servlet-class>
       </servlet>

       <servlet-mapping>
              <servlet-name>shohin</servlet-name>
              <url-pattern>/SeminarGXT/shohin</url-pattern>
       </servlet-mapping>
6. RPC 通信の実装
   Entry ポイントの作成
    a )プロキシのインスタンスを取得する。

    b )エントリーポイントにサービスへの接続点を設定する。


       ShohinServiceAsync proxy =  
                      (ShohinServiceAsync)GWT.create(ShohinService.class);

       ServiceDefTarget entrypoint = (ServiceDefTarget)proxy;

       String entryURL = GWT.getModuleBaseURL() + "shohin";

       entrypoint.setServiceEntryPoint(entryURL);       サーブレットの url-
                                                        pattern
6. RPC 通信の実装
②    サービスの結果に対する処理を決める
    a ) AsyncCallback の作成時に「 onSuccess 」と「 onFailure 」を実装し
    ます。

    b )結果により、 「 onSuccess 」 ( 成功 ) と「 onFailure 」 ( 失敗 ) で処
    理を振り分ける。
        AsyncCallback callback = new AsyncCallback(){

             public void onFailure(Throwable caught) {
                    Window.alert(caught.toString());
             }

             public void onSuccess(Object result) {
                           :
             }
        }                                  内容は次ページに
6. RPC 通信の実装
②   サービスの結果に対する処理を決める
    a ) onSuccess 時の処理
        public void onSuccess(Object result) {
                 List list = (List)result;

                Grid grid = new Grid(list.size(),5);
                grid.setStyleName("shohinGrid meisai");
                ColumnFormatter cf = grid.getColumnFormatter();
                for(int a=0; a<list.size(); a++){
                            Shohin shohin = (Shohin)list.get(a);
                            grid.setText(a,0,shohin.getShohinCd());
                            grid.setText(a,1,shohin.getShohinName());
                                        :
                            cf.setStyleName(0,"ShohinCd");
                            cf.setStyleName(1,"ShohinName");
                                        :
                }
        }
6. RPC 通信の実装
③   サービスを呼び出す
    a )作成したプロキシーと AsyncCallback オブジェクトを使いサービスを
    呼び出す。

    b )通信は非同期で行われ、結果は onSuccess と onFailure に返る。

        ShohinServiceAsync proxy =  
                      (ShohinServiceAsync)GWT.create(ShohinService.class);

        AsyncCallback callback = new AsyncCallback(){ ・・ }

        String shohin_maker_cd;

        proxy.shohin(shohin_maker_cd,callback);
7. GWT の可能性 (GXT アプリケー
ション )
   GXT とは?

  ExtGWT (以下、 GXT )は、 RIA 開発用の JavaScript フレームワー
  クで
 有名な『 Ext JS 』の GWT 版であり、 Java のコードだけで
  JavaScript の動的な動き (Ajax) を実現するフレームワークです。

  GXT では様々な部品が用意され、サンプルソースも公開されていま
  す。 

 最後に、ここまで作成した GWT アプリケーションの GXT 版を紹介し
 ます。
7. GWT の可能性 (GXT アプリケー
ション )
   GXT アプリケーション
7. GWT の可能性 (GXT アプリケー
ション )
   KPS フレームワーク

Weitere ähnliche Inhalte

Was ist angesagt?

明日から使える Java SE 7
明日から使える Java SE 7明日から使える Java SE 7
明日から使える Java SE 7Yuichi Sakuraba
 
Solr meeting in Japan 2011
Solr meeting in Japan 2011Solr meeting in Japan 2011
Solr meeting in Japan 2011Takahiko Ito
 
Development app-with-elixir
Development app-with-elixirDevelopment app-with-elixir
Development app-with-elixirk1complete
 
LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall )
LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall ) LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall )
LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall ) Hironobu Isoda
 
構築手順 Ssis イベントログ取込み 第2版
構築手順 Ssis イベントログ取込み 第2版構築手順 Ssis イベントログ取込み 第2版
構築手順 Ssis イベントログ取込み 第2版junichi anno
 
DTraceによるMySQL解析ことはじめ
DTraceによるMySQL解析ことはじめDTraceによるMySQL解析ことはじめ
DTraceによるMySQL解析ことはじめMikiya Okuno
 
JJUG CCC 2012 Real World Groovy/Grails
JJUG CCC 2012 Real World Groovy/GrailsJJUG CCC 2012 Real World Groovy/Grails
JJUG CCC 2012 Real World Groovy/GrailsUehara Junji
 
コア・コンテキスト管理 - FIWARE WednesdayWebinars
コア・コンテキスト管理 - FIWARE WednesdayWebinarsコア・コンテキスト管理 - FIWARE WednesdayWebinars
コア・コンテキスト管理 - FIWARE WednesdayWebinarsfisuda
 
AutoDock_doc_japanese_ver.1.0
AutoDock_doc_japanese_ver.1.0AutoDock_doc_japanese_ver.1.0
AutoDock_doc_japanese_ver.1.0Satoshi Kume
 
コンピューティングとJava~なにわTECH道
コンピューティングとJava~なにわTECH道コンピューティングとJava~なにわTECH道
コンピューティングとJava~なにわTECH道なおき きしだ
 
AutoDock_vina_japanese_ver.1.0
AutoDock_vina_japanese_ver.1.0AutoDock_vina_japanese_ver.1.0
AutoDock_vina_japanese_ver.1.0Satoshi Kume
 
FIWAREシステム内の短期履歴の管理
FIWAREシステム内の短期履歴の管理FIWAREシステム内の短期履歴の管理
FIWAREシステム内の短期履歴の管理fisuda
 
Elasticsearchの基本動作まとめ
Elasticsearchの基本動作まとめElasticsearchの基本動作まとめ
Elasticsearchの基本動作まとめ朋哉 池田
 
NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)
NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)
NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)fisuda
 

Was ist angesagt? (17)

明日から使える Java SE 7
明日から使える Java SE 7明日から使える Java SE 7
明日から使える Java SE 7
 
Solr meeting in Japan 2011
Solr meeting in Japan 2011Solr meeting in Japan 2011
Solr meeting in Japan 2011
 
Development app-with-elixir
Development app-with-elixirDevelopment app-with-elixir
Development app-with-elixir
 
MongoDB勉強会資料
MongoDB勉強会資料MongoDB勉強会資料
MongoDB勉強会資料
 
LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall )
LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall ) LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall )
LogbackからLog4j 2への移行によるアプリケーションのスループット改善 ( JJUG CCC 2021 Fall )
 
SPDYの話
SPDYの話SPDYの話
SPDYの話
 
構築手順 Ssis イベントログ取込み 第2版
構築手順 Ssis イベントログ取込み 第2版構築手順 Ssis イベントログ取込み 第2版
構築手順 Ssis イベントログ取込み 第2版
 
DTraceによるMySQL解析ことはじめ
DTraceによるMySQL解析ことはじめDTraceによるMySQL解析ことはじめ
DTraceによるMySQL解析ことはじめ
 
JJUG CCC 2012 Real World Groovy/Grails
JJUG CCC 2012 Real World Groovy/GrailsJJUG CCC 2012 Real World Groovy/Grails
JJUG CCC 2012 Real World Groovy/Grails
 
コア・コンテキスト管理 - FIWARE WednesdayWebinars
コア・コンテキスト管理 - FIWARE WednesdayWebinarsコア・コンテキスト管理 - FIWARE WednesdayWebinars
コア・コンテキスト管理 - FIWARE WednesdayWebinars
 
AutoDock_doc_japanese_ver.1.0
AutoDock_doc_japanese_ver.1.0AutoDock_doc_japanese_ver.1.0
AutoDock_doc_japanese_ver.1.0
 
コンピューティングとJava~なにわTECH道
コンピューティングとJava~なにわTECH道コンピューティングとJava~なにわTECH道
コンピューティングとJava~なにわTECH道
 
はじめてのMongoDB
はじめてのMongoDBはじめてのMongoDB
はじめてのMongoDB
 
AutoDock_vina_japanese_ver.1.0
AutoDock_vina_japanese_ver.1.0AutoDock_vina_japanese_ver.1.0
AutoDock_vina_japanese_ver.1.0
 
FIWAREシステム内の短期履歴の管理
FIWAREシステム内の短期履歴の管理FIWAREシステム内の短期履歴の管理
FIWAREシステム内の短期履歴の管理
 
Elasticsearchの基本動作まとめ
Elasticsearchの基本動作まとめElasticsearchの基本動作まとめ
Elasticsearchの基本動作まとめ
 
NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)
NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)
NGSIv1 を知っている開発者向けの NGSIv2 の概要 (Orion 2.0.0対応)
 

Ähnlich wie Gwt1

How to Make Own Framework built on OWIN
How to Make Own Framework built on OWINHow to Make Own Framework built on OWIN
How to Make Own Framework built on OWINYoshifumi Kawai
 
Ibm worklight デモ環境とサンプルコード
Ibm worklight デモ環境とサンプルコードIbm worklight デモ環境とサンプルコード
Ibm worklight デモ環境とサンプルコードK Kimura
 
Azure で Serverless 初心者向けタッチ&トライ
Azure で Serverless 初心者向けタッチ&トライAzure で Serverless 初心者向けタッチ&トライ
Azure で Serverless 初心者向けタッチ&トライMasanobu Sato
 
Inside mobage platform
Inside mobage platformInside mobage platform
Inside mobage platformToru Yamaguchi
 
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
Next2Dで始めるゲーム開発  - Game Development Starting with Next2DNext2Dで始めるゲーム開発  - Game Development Starting with Next2D
Next2Dで始めるゲーム開発 - Game Development Starting with Next2DToshiyuki Ienaga
 
Spring mvc
Spring mvcSpring mvc
Spring mvcRyo Asai
 
Let's build a simple app with .net 6 asp.net core web api, react, and elasti...
Let's build a simple app with  .net 6 asp.net core web api, react, and elasti...Let's build a simple app with  .net 6 asp.net core web api, react, and elasti...
Let's build a simple app with .net 6 asp.net core web api, react, and elasti...Shotaro Suzuki
 
Qlik TechFest C-5 Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装まで
Qlik TechFest C-5  Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装までQlik TechFest C-5  Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装まで
Qlik TechFest C-5 Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装までQlikPresalesJapan
 
TypeScriptで書くLambdaをCDKでいい感じに管理する.pptx
TypeScriptで書くLambdaをCDKでいい感じに管理する.pptxTypeScriptで書くLambdaをCDKでいい感じに管理する.pptx
TypeScriptで書くLambdaをCDKでいい感じに管理する.pptxssuser8b389c
 
Implements OpenTelemetry Collector in DotNet
Implements OpenTelemetry Collector in DotNetImplements OpenTelemetry Collector in DotNet
Implements OpenTelemetry Collector in DotNetYoshifumi Kawai
 
JavaFX 2.0 - リッチクライアントのためのUI基盤
JavaFX 2.0 - リッチクライアントのためのUI基盤JavaFX 2.0 - リッチクライアントのためのUI基盤
JavaFX 2.0 - リッチクライアントのためのUI基盤Yuichi Sakuraba
 
Pro aspnetmvc3framework chap19
Pro aspnetmvc3framework chap19Pro aspnetmvc3framework chap19
Pro aspnetmvc3framework chap19Hideki Hashizume
 
Selenium webdriver使ってみようず
Selenium webdriver使ってみようずSelenium webdriver使ってみようず
Selenium webdriver使ってみようずOda Shinsuke
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.jsTanUkkii
 
Container Storage Interface のすべて
Container Storage Interface のすべてContainer Storage Interface のすべて
Container Storage Interface のすべて祐司 伊藤
 

Ähnlich wie Gwt1 (20)

Clrh 110716 wcfwf
Clrh 110716 wcfwfClrh 110716 wcfwf
Clrh 110716 wcfwf
 
How to Make Own Framework built on OWIN
How to Make Own Framework built on OWINHow to Make Own Framework built on OWIN
How to Make Own Framework built on OWIN
 
Ibm worklight デモ環境とサンプルコード
Ibm worklight デモ環境とサンプルコードIbm worklight デモ環境とサンプルコード
Ibm worklight デモ環境とサンプルコード
 
20090212
2009021220090212
20090212
 
Java EE8 Report
Java EE8 ReportJava EE8 Report
Java EE8 Report
 
Azure で Serverless 初心者向けタッチ&トライ
Azure で Serverless 初心者向けタッチ&トライAzure で Serverless 初心者向けタッチ&トライ
Azure で Serverless 初心者向けタッチ&トライ
 
Inside mobage platform
Inside mobage platformInside mobage platform
Inside mobage platform
 
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
Next2Dで始めるゲーム開発  - Game Development Starting with Next2DNext2Dで始めるゲーム開発  - Game Development Starting with Next2D
Next2Dで始めるゲーム開発 - Game Development Starting with Next2D
 
sveltekit-ja.pdf
sveltekit-ja.pdfsveltekit-ja.pdf
sveltekit-ja.pdf
 
Spring mvc
Spring mvcSpring mvc
Spring mvc
 
Let's build a simple app with .net 6 asp.net core web api, react, and elasti...
Let's build a simple app with  .net 6 asp.net core web api, react, and elasti...Let's build a simple app with  .net 6 asp.net core web api, react, and elasti...
Let's build a simple app with .net 6 asp.net core web api, react, and elasti...
 
Qlik TechFest C-5 Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装まで
Qlik TechFest C-5  Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装までQlik TechFest C-5  Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装まで
Qlik TechFest C-5 Qlikエンジンのサーバーサイド拡張(SSE)の 基礎から実装まで
 
TypeScriptで書くLambdaをCDKでいい感じに管理する.pptx
TypeScriptで書くLambdaをCDKでいい感じに管理する.pptxTypeScriptで書くLambdaをCDKでいい感じに管理する.pptx
TypeScriptで書くLambdaをCDKでいい感じに管理する.pptx
 
Implements OpenTelemetry Collector in DotNet
Implements OpenTelemetry Collector in DotNetImplements OpenTelemetry Collector in DotNet
Implements OpenTelemetry Collector in DotNet
 
JavaFX 2.0 - リッチクライアントのためのUI基盤
JavaFX 2.0 - リッチクライアントのためのUI基盤JavaFX 2.0 - リッチクライアントのためのUI基盤
JavaFX 2.0 - リッチクライアントのためのUI基盤
 
Pro aspnetmvc3framework chap19
Pro aspnetmvc3framework chap19Pro aspnetmvc3framework chap19
Pro aspnetmvc3framework chap19
 
Selenium webdriver使ってみようず
Selenium webdriver使ってみようずSelenium webdriver使ってみようず
Selenium webdriver使ってみようず
 
Isomorphic web development with scala and scala.js
Isomorphic web development  with scala and scala.jsIsomorphic web development  with scala and scala.js
Isomorphic web development with scala and scala.js
 
Container Storage Interface のすべて
Container Storage Interface のすべてContainer Storage Interface のすべて
Container Storage Interface のすべて
 
Sc2009autumn s2robot
Sc2009autumn s2robotSc2009autumn s2robot
Sc2009autumn s2robot
 

Gwt1

  • 1. GWT アプリケーション開発の基 本 その1  ~ DB からデータを読んで Grid に表示する ~ (株)ケーピーエス 伊東 成幸
  • 2. 目次  サンプルの紹介  開発環境  クライアント・サーバー間通信の概要  クライアント モジュールの実装  サーバー モジュールの実装  RPC 通信の実装  GWT の可能性 (GXT アプリケーション )
  • 3. 1.サンプルの紹介  GWT アプリケーション
  • 4. 2.開発環境  Java 5.0  Tomcat 5.5  GWT 1.6  postgres 8.2  Windows Vista Business  Eclipse 3.4
  • 5. 3.クライアント・サーバー間通信の 概要  通信の仕組み 1. GWT では、クライアント・サーバー間通信をメッセージ交換 ではなく   手続き呼び出し (Remote Procedure Call ・以下 RPC) を使 う。 2 .クライアント側ではサーバーのサービスメソッドを呼び出して、    その結果を戻り値として受け取る。 GWT で決められた手続きに従って 3 .サーバー側では、サービスメソッドが呼び出される事でクライア ント 作成したモジュールで通信を行いま す。    からの呼び出しと引数を受信する。 (Ajax と同じ XMLHttpRequest をラ 4 .通信は非同期で行われる。 ップ )
  • 6. 3.クライアント・サーバー間通信の 概要 Client Module Server Module GWT 側で提供 ServiceDefTarget RemoteService RemoteServiceServlet < interface > < interface > 開発者が作成 ServiceProxy Service ServiceImpl ( 注 1) < interface > extends ServiceAsync implements 注 1 GWT が自動生 < interface > 成
  • 7. 3.クライアント・サーバー間通信の 概要  ServiceProxy を生成するネーミングルール 1. Proxy インターフェース名は『サービスインタフェース名 + Async 』 2. Proxy のメソッド名はサービスインタフェースのメソッド名と 同じにする。 ⇒ 戻り値は『 void 』とする。 ⇒ 引数の最後にサービスの結果を受ける AsyncCallback 型   のオブジェクトを追加する
  • 8. 4.クライアント モジュールの実 装 Client Module Server Module GWT 側で提供 RemoteServiceServlet ServiceDefTarget RemoteService < interface > < interface > 開発者が作成 ① ③ ServiceProxy ShohinService ShohinServiceImpl ( 注 1) < interface > ② extends ShohinServiceAsync implements < interface > 注 1 GWT が自動生 成
  • 9. 4.クライアント モジュールの実 装 ■ Service ・ Proxy インターフェースの作成 ① ShohinServiceの作成 ② ShohinServiceAsync の作成
  • 10. 4.クライアント モジュールの実 装 ShohinService の作成 a )マーカーインターフェースである RemoteService を継承したサービ スの作成 b )サーバーが提供するサービスをメソッドとして宣言する。 public interface ShohinService extends RemoteService { public List shohin(String shohinMakerCode); }
  • 11. 4.クライアント モジュールの実 装 ② ShohinServiceAsync の作成 a )メソッドの戻り値を void とする b ) ShohinService のメソッドに AsyncCallback 型のオブジェクトを追加 する。 c )非同期での戻り値を AsyncCallback 型のオブジェクトで受け取る。 public interface ShohinServiceAsync { public void shohin(String shohinMakerCode,AsyncCallback callback); }
  • 12. 5.サーバー モジュールの実装 ■ サービスメソッドの作成とサーブレット登録 ① ShohinServiceImpl の作成 ② Servlet への登録
  • 13. 5.サーバー モジュールの実装  ShohinServiceImpl の作成 a ) HttpServlet を継承している RemoteServiceServlet を継承する。 b ) ShohinService を実装する。 c )サービスクラスは、サーブレットとして実行されるのでスレッドセー フにする。 public class ShohinServiceImpl extends RemoteServiceServlet implements ShohinService { public List shohin(String shohinMakerCode) { : return list; 内容は次ページに } }
  • 14. 5.サーバー モジュールの実装  ShohinServiceImpl の作成   a ) shohin メソッドの内容 Class.forName("org.postgresql.Driver"); Connection con =      DriverManager.getConnection("jdbc:postgresql://*****", "*****", "*****"); String sql = "select * from shohin where shohin_maker_cd = ?;"; PreparedStatement st = con.prepareStatement(sql.toString()); st.setString(1,shohinMakerCode); Shohin クラスは ResultSet rs = st.executeQuery(); while (rs.next()) { IsSerializable Shohin shohin = new Shohin(); を shohin.setShohinCd(rs.getString(1)); : 実装した list.add(shohin); JavaBean } return list;
  • 15. 5.サーバー モジュールの実装  JavaBean(Shohin) の内容   a )プロパティの定義とゲッター・セッターのみ public class Shohin implements IsSerializable { private String shohinCd; 他にも使用でき private String shohinName; る型の限定があ : ります public Shohin(){ (次ページへ) } public String getShohinCd() { return shohinCd; } public void setShohinCd(String shohinCd) { this.shohinCd = shohinCd; }             : }
  • 16. 5.サーバー モジュールの実装    RPC 通信で使用できる型   a )基本型・参照型・配列・クラス・ユーザ定義型があります 基本型 char 、 byte 、 short 、 int 、 long 、 boolean 、 float 、 double 参照型 String 、 Date 、 Char 、 Byte 、 Short 、 Integer 、 Long 、 Boolean 、 Float 、 Double 配列・クラス 配 列、 List 、 Map 、 Set 、 ArrayList 、 HashMap 、 HashSet 、 Stack 、 Vecto r、 AbstractList 、 AbstractCollection 、 AbstractMap 、 AbstractSet 、 Collectio n ユーザ定義型 IsSerializable インターフェースを実装したユーザ定義クラス
  • 17. 5.サーバー モジュールの実装 ② Servlet への登録 a )サービスクラスを Servlet として、『 web.xml 』に登録する。 <servlet> <servlet-name>shohin</servlet-name> <servlet-class> jp.co.kpscorp.SeminarGXT.gwt.server.ShohinServiceImpl </servlet-class> </servlet> <servlet-mapping> <servlet-name>shohin</servlet-name> <url-pattern>/SeminarGXT/shohin</url-pattern> </servlet-mapping>
  • 18. 6. RPC 通信の実装  Entry ポイントの作成 a )プロキシのインスタンスを取得する。 b )エントリーポイントにサービスへの接続点を設定する。 ShohinServiceAsync proxy =   (ShohinServiceAsync)GWT.create(ShohinService.class); ServiceDefTarget entrypoint = (ServiceDefTarget)proxy; String entryURL = GWT.getModuleBaseURL() + "shohin"; entrypoint.setServiceEntryPoint(entryURL); サーブレットの url- pattern
  • 19. 6. RPC 通信の実装 ② サービスの結果に対する処理を決める a ) AsyncCallback の作成時に「 onSuccess 」と「 onFailure 」を実装し ます。 b )結果により、 「 onSuccess 」 ( 成功 ) と「 onFailure 」 ( 失敗 ) で処 理を振り分ける。 AsyncCallback callback = new AsyncCallback(){ public void onFailure(Throwable caught) { Window.alert(caught.toString()); } public void onSuccess(Object result) { : } } 内容は次ページに
  • 20. 6. RPC 通信の実装 ② サービスの結果に対する処理を決める a ) onSuccess 時の処理 public void onSuccess(Object result) { List list = (List)result; Grid grid = new Grid(list.size(),5); grid.setStyleName("shohinGrid meisai"); ColumnFormatter cf = grid.getColumnFormatter(); for(int a=0; a<list.size(); a++){ Shohin shohin = (Shohin)list.get(a); grid.setText(a,0,shohin.getShohinCd()); grid.setText(a,1,shohin.getShohinName()); : cf.setStyleName(0,"ShohinCd"); cf.setStyleName(1,"ShohinName"); : } }
  • 21. 6. RPC 通信の実装 ③ サービスを呼び出す a )作成したプロキシーと AsyncCallback オブジェクトを使いサービスを 呼び出す。 b )通信は非同期で行われ、結果は onSuccess と onFailure に返る。 ShohinServiceAsync proxy =   (ShohinServiceAsync)GWT.create(ShohinService.class); AsyncCallback callback = new AsyncCallback(){ ・・ } String shohin_maker_cd; proxy.shohin(shohin_maker_cd,callback);
  • 22. 7. GWT の可能性 (GXT アプリケー ション )  GXT とは?   ExtGWT (以下、 GXT )は、 RIA 開発用の JavaScript フレームワー クで  有名な『 Ext JS 』の GWT 版であり、 Java のコードだけで   JavaScript の動的な動き (Ajax) を実現するフレームワークです。   GXT では様々な部品が用意され、サンプルソースも公開されていま す。   最後に、ここまで作成した GWT アプリケーションの GXT 版を紹介し ます。
  • 23. 7. GWT の可能性 (GXT アプリケー ション )  GXT アプリケーション
  • 24. 7. GWT の可能性 (GXT アプリケー ション )  KPS フレームワーク