2012年12月3日月曜日

ものぐさな院生のDWR入門

どうも,立ち位置が微妙な院生の矢ヶ崎です.
3日目は僕が使ってるDWRというものについて書いていきます.

DWRって?

JavaScriptから直接Javaのメソッドを叩けるよく分からない技術です.
研究室で数年前流行ってました(今は多分僕しか使ってません).


なんで使ってるの?

クライアント,サーバ間で通信する為の記述が面倒臭いから使ってます.
AjaxだのPostだのでリクエスト飛ばしてgetAttributeでどーのこーのして
処理が終わったらレスポンスにイソイソ値を入れてとか・・・

いちいち書くのが面倒くせぇ!!ので使ってます.
因みにセキュリティ的にどうのとか書き方的にどうのとか全く気にしてないので知りません.
あとこれしか書けることがn・・・ゲフン
そこ,「またDWRかよ…」とか言わない;


何が良いの?

  • サーブレットを書く必要が無い.
  • だからrequestやらresponseやらに値を出し入れする事もない.
  • Javaさえ書ければ簡単にサーバー側を書ける!(多分).

DWRについてもちっと詳く

JavaScriptからJavaのメソッドが直接叩けます.
例えばControllerクラスのloginCheck(String,String)みたいなメソッドがあれば
JavaScript側でController.loginCheck("admin","areare");で呼び出せます.

準備

1:DWRからdwr.jarを落とす.
2:web.xmlのweb-app以下に下記を追加する.

 Direct Web Remoter Servlet
 DWR Servlet
 dwr-invoker
 uk.ltd.getahead.dwr.DWRServlet
 
  debug
  true
 


 dwr-invoker
 /dwr/*

3:WEB-INF以下にdwr.xmlを作成する.


 
  
 


例:testパッケージ内のCalculatorクラスをcalcという名前で
アプリケーションが終了するまでインスタンスを生存させる場合.



これでおしまい.

scopeについて

DWRで生成されるJavaインスタンスの生存期間が指定できます.
何も書かないとメソッドを叩く度に生成されます.

  • application アプリケーション全体で一つのインスタンスを生成. 
  • session セッション単位. 
  • request リクエスト毎.
  • page ページ毎.
  • script ページを表示している間.

確認の仕方

アプリケーションを実行しアドレスの末尾に「/dwr」とつけてアクセスするとデバッグページが表示されます.(http://localhost:8080/application/dwrみたいな感じ)


使える引数

JavaとJS間では以下のように値を受け渡しできます.
Java ⇔ JavaScript
boolean  論理型
Byte,Short,Integer,Long,Float,Double  数値型
Character,String  文字列型
JavaBeansとJavaオブジェクトも受け渡し可能です.

使い方(JS側)

HTMLに以下を記述する.(Helloクラスの場合)




これでHelloクラスのメソッドを叩くことができます.
例えば下記のようなメソッドがある場合
public String helloName(String name){
 return "Hello "+name;
}
js側でこんな風に呼び出します.(コンソールに「Hello Yaga」って出ます)
Hello.helloName("Yaga",callbackFunc);
function callbackFunc(returnData){
 console.log(returnData);
}
引数が1つ多いと思いますが,DWRでJavaメソッドを呼び出すと
最後の引数+1にメソッドの戻り値が返ってきます.
上記の場合helloNameメソッドの結果をcallbackFunk関数で受け取ってます.
(引数のreturnDataに戻り値が入ってます)

引数にJavaBeansやJavaオブジェクトを使う方法

dwr.xmlのallow以下に以下のように書きます.
JavaBeans以外のJavaオブジェクトを利用する場合は
converterをobjectにします.

後はreturnData.propertyのようにアクセスできます.
var name;
var id;
var age;
School.getStudentData("studentName",function(returnData){
 name = returnData.name;
 id = returnData.id;
 age = returnData.age;
 console.log("学籍番号:"+id+" 氏名:"+name+" 年齢:"+age);
});
var addStudentData = {name:"Meso",id:"C123456",age:10};
School.setStudentData(addStudentData);
10~11行目はBeanDataをサーバー側に送る記述を書いてます.

ちょっと便利なutil関数

JS側に書いてインポートしてるutil.jsを使って色々できます.
ここにはその一部を紹介します.

dwr.util.getValue(id)

引数で指定したid属性を取ってきます,まとめて取ってくるgetValuesってのもあります.

dwr.util.setValue(id,value)

引数で指定したid属性の値を変更します.

dwr.util.addOptions(id,OptionData)

idで指定したセレクトボックスのOptionを追加します.
サーバーからオプションの一覧をStringの配列で返して第2引数に突っ込むだけでOKです.

他にも色々あるので興味のある人は見てみて下さいutil.js


以上になります
特別,必要な技術って訳じゃないですが
やってみると意外と便利だったりするので興味のある人は是非試してみてください.

そんなわけで4日目は前回node.jsについて書いてくれた高木君にバトンタッチします.

それではまた ノシ

3 件のコメント:

  1. Thanks for sharing, nice post! Post really provice useful information!

    Giaonhan247 chuyên dịch vụ mua hộ hàng mỹ với các mặt hàng từ pandora úc hay từ web ebay việt nam cùng với bảng giá gửi hàng đi mỹ uy tín, giá rẻ.

    返信削除
  2. คาสิโนออนไลน์ที่น่าเชื่อถือและมีความเป็นมืออาชีพที่สุดในตอนนี้
    โปรโมชั่นGclub ของทางทีมงานตอนนี้แจกฟรีโบนัส 50%
    เพียงแค่คุณสมัคร สล็อตออนไลน์ กับทางทีมงานของเราเพียงเท่านั้น
    ร่วมมาเป็นส่วนหนึ่งกับเว็บไซต์คาสิโนออนไลน์ของเราได้เลยค่ะ
    สมัครสล็อตออนไลน์ >>> Goldenslot
    สนใจร่วมสนุกกับ คาสิโนออนไลน์ คลิ๊กได้เลย
    มีทั้งคาสิโนออนไลน์ หวยออนไลน์ ฟุตบอลออนไลน์ สล็อตออนไลน์ และอื่นๆอีกมากมาย

    返信削除
  3. If you are looking for the online assignment help service provider then you should definitely go for AllAssignmentHelp.com. We offer all types of subjects assignment helps at the best price.

    返信削除