Seasar DI Container with AOP

Teeda Ajax

【最新情報】 Seasar2.4の新機能SmartDeployを利用した場合の使い方

Teeda Ajaxとは、主に以下のような機能を提供します。

  • AjaxによりS2Containerに登録されているPOJOとの連携
  • AjaxにおけるパラメータのPOJOへの自動インジェクション
  • Ajaxを簡単に利用する為の、JavaScriptライブラリ

Teeda Ajaxの利用方法について解説します。 Ajaxを利用する為に必要なファイルは以下の通りです。

  • teeda-ajax-xx.jar
  • ajax.js

それでは、利用方法を見ていきましょう。

使用するアプリケーションのWEB-INF/lib配下にteeda-ajax-xx.jarを含めて下さい。

  • web.xmlの設定
  • web.xmlに上記AjaxServeltの設定を追加します。

    <servlet>
        <servlet-name>AjaxServlet</servlet-name>
        <servlet-class>org.seasar.teeda.ajax.AjaxServlet</servlet-class>
        <load-on-startup>3</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>AjaxServlet</servlet-name>
        <url-pattern>*.ajax</url-pattern>
    </servlet-mapping>
    

    load-on-startupは任意に設定して下さい。

  • ajax.jsの使い方
  • ajax.jsを配置し、利用したいHTML側でajax.jsをincludeして下さい。

    <script language="JavaScript" src="/js/ajax.js"></script>
    

    Kumu.Ajax.executeTeedaAjaxという関数を呼びAjaxを実行します。この関数に指定するのは以下の通りです。

    • callback関数
    • パラメータ

    callback関数は、以下の規約によって指定することにより自動で呼び出すコンポーネントとメソッド名を解決します。

    // 呼び出したいコンポーネント名 + "_" + 呼び出したいメソッド名
    function hoge_foo(response){
        // responseにはAjaxによるレスポンスが格納されています
        alert(response);
    }
    Kumu.Ajax.executeTeedaAjax(hoge_foo, {"パラメータ名" : "パラメータ値"});
    

    上記の場合diconに定義されたhogeコンポーネントのfooメソッドが呼ばれます。

    hogeコンポーネントのfooメソッドの呼び方としては以下の方法も可能です

    // callback関数を任意の名前で定義
    function test(response){
    }
    Kumu.Ajax.executeTeedaAjax(test, { "component" : "hoge", "action" : "foo" });
    

    規約を使用しない場合は、パラメータにcomponent、actionを指定します。これによりhogeコンポーネントのfooメソッドが指定出来ます。

  • パラメータ
  • パラメータは連想配列で指定します

    // 下記のようなHTMLでteeda, kumuというパラメータ名でパラメータを指定したい場合
    <form name="x">
    <input type="text" name="teeda" />
    <input type="text" name="kumu" />
    </form>
    Kumu.Ajax.executeTeedaAjax(hoge_foo,
        {"teeda" : document.x.teeda.value, "kumu" : document.x.kumu.value});
    

    それではサーバ側の処理を実装しましょう。 上記hogeはどこで定義されているのでしょうか。hogeは、任意のdiconの中で、次のように定義されています。

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE components PUBLIC "-//SEASAR//DTD S2Container 2.4//EN"
    	"http://www.seasar.org/dtd/components24.dtd">
    
    <components>
      <include path="examples/teeda/dicon/zip.dicon"/>
      <component name="hoge" class="examples.ajax.HogeBean" instance="request">
        <meta name="teeda-ajax"/>
      </component>
    </components>
    

    teeda-extensionのAjaxではdiconで定義された任意のPOJOを利用する事が出来ます。

    ※注意 この際、meta情報をteeda-ajaxとして指定して下さい。meta情報が無いコンポーネントは呼び出せません。

    HogeBeanの中身を見てみましょう

    package examples.ajax;
    
    public class HogeBean {
    
        private String teeda;
        private String kumu;
    
        public void setTeeda(String teeda) {
            this.teeda = teeda;
        }
        public void setKumu(String kumu) {
            this.kumu = kumu;
        }
    
        public String foo() {
            return "{ teeda :'" + this.teeda + "', kumu : '" + this.kumu + "' }";
        }
    }
    

    Kumu.Ajax.executeTeedaAjaxで指定されたパラメータ名と同名のセッターにパラメータを自動でDIします。 先ほどのサンプルでは、teeda, kumuというパラメータ名を設定したので、それぞれのセッターにパラメータの値が設定されます。 呼び出すメソッドは、戻り値が文字列で引数が無いメソッドです。 fooメソッドでは、JavaScriptに返したい文字列を作成するだけです。

    戻り値の基本フォーマットは、JSONですが任意の形でも指定可能です

    • JSON
    • XML
    • HTML
    • TEXT

    任意フォーマットの受渡しについては、teeda-ajax-demoのexample.htmlとExampleBean.javaを参考にして下さい。JSONについてはこちらを参考にして下さい。

  • 日本語パラメータについて
  • Tomcat5.x系で日本語パラメータを使用する場合には、Tomcatの設定ファイル server.xmlのConnector要素のuseBodyEncodingForURI属性を以下のように"true"を設定して下さい。

    <Connector
    port="8080" maxThreads="150" minSpareThreads="25" maxSpareThreads="75"
    enableLookups="false" acceptCount="100"
    debug="0" connectionTimeout="20000"
    disableUploadTimeout="true" useBodyEncodingForURI="true"/>
    

    詳しくはteeda-ajax-demoをEclipse上でプロジェクトとして取り込みTomcatを起動後http://localhost:8080/teeda-ajax-demo/にアクセスしてサンプルの動作確認を行って下さい。


    Seasar2.4の新機能SmartDeployを利用した場合の使い方

  • 推奨パターン
  • Pageクラスにajaxで呼び出すメソッドを追加します

    • 呼び出し対象のコンポーネント登録するには?
    • 呼び出す際のコンポーネント名は?

    呼び出したい対象のコンポーネントをdiconファイルに登録する必要はありません。
     Pageクラスにajaxから始まるメソッド名を定義する事によりdiconファイルへ登録する際に必要だったmetaタグの登録が不要になります。
     【Pageクラス例】
     package examples.teeda.web.ajaxにあるAjaxPageクラスに以下のようにメソッドを定義します。
     ※convention.diconで指定されているrootパッケージはexamples.teedaとします

    package examples.teeda.web.ajax;
    
    public class AjaxPage {
        // メソッド名はajaxから始める
        public String ajaxStartAjax() {
            return "Start Ajax";
        }
    }
    

    このコンポーネントをJavaScriptから呼び出すには、コンポーネント名が必要になります。
     SmartDeployを使用した場合にはPageクラスはサブアプリケーション名 + "_" + Pageクラス名(先頭小文字)という名前でS2に自動登録されます。
     上記の例の場合、サブアプリケーション名が"ajax"でPageクラス名がAjaxPageなので先頭を小文字にした"ajaxPage"となりますので
     以下のようにJavaScriptから呼び出す事が出来ます。

      // サブアプリケーション"ajax" + "_" + Pageクラス名の先頭小文字"ajaxPage" + "_" + 呼び出したいメソッド名
      function ajax_ajaxPage_ajaxStartAjax(res){
        alert(res);
      }
      Kumu.Ajax.executeTeedaAjax(ajax_ajaxPage_ajaxStartAjax, [], Kumu.Ajax.RESPONSE_TYPE_TEXT);
    

    Kumu.Ajaxの詳細な使い方はこちらも参考にして下さい。