« ◆CANVASを用いたHTMLスライダー | トップページ | シンプル・イズ・ベスト »

GET/POST/open/submit/Ajaxとservlet：多局面メモ

ごった煮メモ

 GET,POST,AJAX,画面書き換え,新規画面,要素の変更などひとまとめ

サーバと機能を分担するWEBアプリのアプリとのやり取りの種々の手法を述べます。

この他 を説明します。

htmlは全部まとめて一つにしてあります。なおhtmlからは"disp"の名でサーブレットを呼んでいます。

ソースのダウンロード:ライブラリやcss,imageなどビルドに必要なものが入っています

.warファイルのダウンロード:webappに置けば動きます

 単純な<FORM>タグを使ったGETによる画面置換

最も単純なGETです。<FORM>タグのインスタンスのsubmitを呼ぶことにより FORM内に置かれた<INPUT>要素の値がサーバに送られ、 サーバからの画面情報で画面が書き換えられます。
<FORM>内のmethodでGETかPOSTかが決まります。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function doGet(){ 
   $E("form1").submit();
   }
</script>
<form method="get" action="disp" id="form1">
<input id="T1" name="T1" class="text" style="width:13em" value="t1-value"> 
<input id="T2" name="T2" class="text" style="width:13em" value="t2-value"> 
<input class="B"  type="button" value="GET(form)"  onClick="doGet()" style="width:120px">
</form><

 単純な<FORM>タグを使ったPOSTによる画面置換

最も単純なPOSTです。<FORM>タグのインスタンスのsubmitを呼ぶことにより FORM内に置かれた<INPUT>要素の値がサーバに送られ、 サーバからの画面情報で画面が書き換えられます。
<FORM>内のmethodでGETかPOSTかが決まります。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function doPost(){ 
   $E("form2").submit();
   }
</script>
<form method="post" action="disp" id="form2">
<input id="T3" name="T3" class="text" style="width:13em" value="t3-value"> 
<input id="T4" name="T4" class="text" style="width:13em" value="t4-value"> 
<input class="B2" type="button" value="POST(form)" onClick="doPost()" style="width:120px">
</form>

 <FORM>タグを使わないDOM操作でのGETによるsubmit

HTML記述での<FORM>によらず、DOM操作でパラメタを作成し、一時的なfrom インスタンスでGETが送出され、サーバからの画面情報で画面が書き換えられます。
GETかPOSTかは関数引数としています。2つの関数はgetと共有です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;} 
function addValue(form,name,value){
   var input=document.createElement("input");
   input.setAttribute("type","hidden");
   input.setAttribute("name",name);
   input.setAttribute("value",value);
   form.appendChild(input);
   }
function post_get(method,url,params,target){
   var form= document.createElement("form");
   document.body.appendChild(form);
   if( target!==undefined ){
      form.target = target;
      }
   form.action = url;
   form.method = method;
   for (key in params) {
      addValue(form,key,params[key]);
      }
   form.submit();
   //document.body.removeChild(form);
   }
function doGet2(){
   var params={T1_g:$V("T1"),T2_g:$V("T2"),T3_g:$V("T3"),T4_g:$V("T4")};
   post_get("get","disp",params);
   return false;
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B"  type="button" value="GET"  onClick="doGet2()" style="width:160px">

 <FORM>タグを使わないDOM操作でのPOSTによるsubmit(おすすめ)

HTML記述での<FORM>によらず、DOM操作でパラメタを作成し、一時的なfrom インスタンスでPOSTが送出され、サーバからの画面情報で画面が書き換えられます。
GETかPOSTかは関数引数としています。
post_get()関数は<FORM>タグを使わないDOM操作でのGETによる画面置換 と共通です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;} 
function addValue(form,name,value){
   var input=document.createElement("input");
   input.setAttribute("type","hidden");
   input.setAttribute("name",name);
   input.setAttribute("value",value);
   form.appendChild(input);
   }
function post_get(method,url,params,target){
   var form= document.createElement("form");
   document.body.appendChild(form);
   if( target!==undefined ){
      form.target = target;
      }
   form.action = url;
   form.method = method;
   for (key in params) {
      addValue(form,key,params[key]);
      }
   form.submit();
   //document.body.removeChild(form);
   }
function doPost2(){
   var params={T1_p:$V("T1"),T2_p:$V("T2"),T3_p:$V("T3"),T4_p:$V("T4")};
   post_get("post","disp",params);
   return false;
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B2" type="button" value="POST"  onClick="doPost2()" style="width:160px">

 <FORM>window.openで別窓を開く(GET)

URL文字列にGETのクエリー文字列を追加し、window.open()を呼びます。window.open()は GETを出し、サーバーからのHTML文で新たな窓を開きます。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;} 
function gen_url(url,params){
   var url_param=url;
   var dlmt="?";
   for (key in params) {
      url_param+= dlmt+key+"="+encodeURIComponent(params[key]).replace( /%20/g, '+' );
      dlmt="&";
      }
   return url_param;
   }
function doGet3(){
   var params={T1_ug:$V("T1"),T2_ug:$V("T2"),T3_ug:$V("T3"),T4_ug:$V("T4")};
   window.open(gen_url("disp",params));
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B"  type="button" value="GET(open)"  onClick="doGet3()" style="width:160px">

 <FORM>window.openで別窓を開く(POST)

window.open()で空の窓を開いた後、その窓をターゲットとしてPOSTを出します。
post_get()関数は<FORM>タグを使わないDOM操作でのGETによる画面置換 と共通です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function doPost3(){
   var params={T1_up:$V("T1"),T2_up:$V("T2"),T3_up:$V("T3"),T4_up:$V("T4")};
   window.open("","newWin") ;
   post_get("post","disp",params,"newWin");
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B2" type="button" value="POST(open)" onClick="doPost3()" style="width:160px">

 Ajax(GET)戻り値で画面全体置き換え(onloadが動かない可能性がある)

Ajax用のクラスXMLHttpRequestを使いGETを送り、非同期で受信したサーバーからの応答で 画面を置き換えます。
ここでは応用を考えアクセス用のクラスhiHttpRequestを作成して、利用しています。
緑部がhiHttpRequestの定義です。hiHttpRequestはsend関数にパラメタと受信成功時の コールバック関数を指定するようになっています。コールバック関数の引数は先頭が サーバからの応答文字列です。この例ではredraw()がコールバック関数です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function hiHttpRequest(){}
hiHttpRequest.encode_param=function(params,dlmt){
   var param="";
   for (key in params) {
      param+= dlmt+key+"="+encodeURIComponent(params[key]).replace( /%20/g, '+' );
      dlmt="&";
      }
   return param;
   }
hiHttpRequest.prototype.send=function(method,url,params,callback_){
   param="";
   if( method=="GET" ){
      url= url+hiHttpRequest.encode_param(params,"?");
      }
   else{
      param= hiHttpRequest.encode_param(params,"");
      }
   this.callback   = callback_;
   this.httpRequest= hiHttpRequest.createXMLHttpRequest();
   var _this       = this;
   this.httpRequest.onreadystatechange = function(){_this.stateChange();}
   this.httpRequest.open( method, url );
   this.httpRequest.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
   this.httpRequest.send(param);
   }
hiHttpRequest.prototype.stateChange=function(){
   if( this.httpRequest.readyState == 4 && 
       this.httpRequest.status == 200){
      if( this.callback!=null ) this.callback(this.httpRequest.responseText,this);
      }
   }
hiHttpRequest.createXMLHttpRequest=function(){
   if(window.XMLHttpRequest){return new XMLHttpRequest()}
   if(window.ActiveXObject){
      try{return new ActiveXObject("Msxml2.XMLHTTP.6.0")}catch(e){}
      try{return new ActiveXObject("Msxml2.XMLHTTP.3.0")}catch(e){}
      try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e){}
      }
   return false;
   };
function doGet4(){
   var params={T1_ag:$V("T1"),T2_ag:$V("T2"),T3_ag:$V("T3"),T4_ag:$V("T4")};
   httpRequest=new hiHttpRequest();
   httpRequest.send("GET","disp",params,redraw);
   }
function redraw(text,request){
   window.document.write(text);
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B"  type="button" value="GET(ajax)"  onClick="doGet4()" style="width:160px">

 Ajax(POST)戻り値で画面全体置き換え(onloadが動かない可能性がある)

Ajax用のクラスXMLHttpRequestを使いPOSTを送り、非同期で受信したサーバーからの応答で 画面を置き換えます。
ここでは応用を考えアクセス用のクラスhiHttpRequestを利用しています。
hiHttpRequestの定義はAjax(GET)戻り値で画面全体置き換え と共通です。hiHttpRequestはsend関数にパラメタと受信成功時の コールバック関数を指定するようになっています。コールバック関数の引数は先頭が サーバからの応答文字列です。この例ではredraw()がコールバック関数です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function doPost4(){
   var params={T1_ap:$V("T1"),T2_ap:$V("T2"),T3_ap:$V("T3"),T4_ap:$V("T4")};
   httpRequest=new hiHttpRequest();
   httpRequest.send("POST","disp",params,redraw);
   }
function redraw(text,request){
   window.document.write(text);
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B2" type="button" value="POST(ajax)" onClick="doPost4()" style="width:160px">

 Ajax(GET)戻り値で別窓を開く

Ajax用のクラスXMLHttpRequestを使いGETを送り、非同期で受信したサーバーからの応答で 別画面を開きます。別画面の開き方は一旦からの画面を開いてから、中身を書き換えます。
ここでは応用を考えアクセス用のクラスhiHttpRequestを利用しています。
hiHttpRequestの定義はAjax(GET)戻り値で画面全体置き換え と共通です。hiHttpRequestはsend関数にパラメタと受信成功時の コールバック関数を指定するようになっています。コールバック関数の引数は先頭が サーバからの応答文字列です。この例ではnewWin()がコールバック関数です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function doGet5(){
   var params={T1_oag:$V("T1"),T2_oag:$V("T2"),T3_oag:$V("T3"),T4_oaf:$V("T4")};
   httpRequest=new hiHttpRequest();
   httpRequest.send("GET","disp",params,newWin);
   }
function newWin(text,request){
   var win=window.open("","newWin2") ;
   win.document.write(text);
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B"  type="button" value="GET(ajax/open)"  onClick="doGet5()" style="width:160px">

 Ajax(POST)戻り値で別窓を開く

Ajax用のクラスXMLHttpRequestを使いPOSTを送り、非同期で受信したサーバーからの応答で 別画面を開きます。別画面の開き方は一旦からの画面を開いてから、中身を書き換えます。
ここでは応用を考えアクセス用のクラスhiHttpRequestを利用しています。
hiHttpRequestの定義はAjax(GET)戻り値で画面全体置き換え と共通です。hiHttpRequestはsend関数にパラメタと受信成功時の コールバック関数を指定するようになっています。コールバック関数の引数は先頭が サーバからの応答文字列です。この例ではnewWin()がコールバック関数です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function doPost5(){
   var params={T1_oap:$V("T1"),T2_oap:$V("T2"),T3_oap:$V("T3"),T4_oap:$V("T4")};
   httpRequest=new hiHttpRequest();
   httpRequest.send("POST","disp",params,newWin);
   }
function newWin(text,request){
   var win=window.open("","newWin2") ;
   win.document.write(text);
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B2" type="button" value="POST(ajax/open)" onClick="doPost5()" style="width:160px">

 Ajax(GET)戻り値で現窓の要素変更

Ajax用のクラスXMLHttpRequestを使いGETを送り、非同期で受信したサーバーからの応答で 画面要素を書き換えます。通常はこの応答にXMLあるいはajaxによる構造データを使い javascriptでそれを解析して、画面制御に使います。
ここでは応用を考えアクセス用のクラスhiHttpRequestを利用しています。
hiHttpRequestの定義はAjax(GET)戻り値で画面全体置き換え と共通です。hiHttpRequestはsend関数にパラメタと受信成功時の コールバック関数を指定するようになっています。コールバック関数の引数は先頭が サーバからの応答文字列です。この例ではinner()がコールバック関数です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function doGet6(){
   var params={T1_rag:$V("T1"),T2_rag:$V("T2"),T3_rag:$V("T3"),T4_rag:$V("T4")};
   httpRequest=new hiHttpRequest();
   httpRequest.send("GET","disp",params,inner);
   }
function inner(text,request){
   $E("div01").innerHTML =text;
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B"  type="button" value="GET(ajax/inner)"  onClick="doGet6()" style="width:160px">

 Ajax(POST)戻り値で現窓の要素変更

Ajax用のクラスXMLHttpRequestを使いPOSTを送り、非同期で受信したサーバーからの応答で 画面要素を書き換えます。通常はこの応答にXMLあるいはajaxによる構造データを使い javascriptでそれを解析して、画面制御に使います。
ここでは応用を考えアクセス用のクラスhiHttpRequestを利用しています。
hiHttpRequestの定義はAjax(GET)戻り値で画面全体置き換え と共通です。hiHttpRequestはsend関数にパラメタと受信成功時の コールバック関数を指定するようになっています。コールバック関数の引数は先頭が サーバからの応答文字列です。この例ではinner()がコールバック関数です。 

<script type="text/javascript">
function $E(id){return document.getElementById(id);}
function $V(id){return $E(id).value;}
function doGet6(){
   var params={T1_rag:$V("T1"),T2_rag:$V("T2"),T3_rag:$V("T3"),T4_rag:$V("T4")};
   httpRequest=new hiHttpRequest();
   httpRequest.send("GET","disp",params,inner);
   }
function inner(text,request){
   $E("div01").innerHTML =text;
   }
</script>
<!-- input-textは単純GET/POSTのform1,form2を使う -->
<input class="B"  type="button" value="GET(ajax/inner)"  onClick="doGet6()" style="width:160px">

 Ajaxアクセス(XMLHttpRequestアクセス）を単純化したクラス

XMLHttpRequestを使えばサーバと非同期なアクセスができます。サーバから画面全体の書き換えデータ を送らず、一部のデータだけを送り、それをクライアントで解析して、クライアントで自らの窓の 一部を書き換えるのがAjaxの基本です。
データには通常XMLまたはjsonを用います。単純な=によるキーと値の関連付けをカンマ区切りで並べた文字列 などでも構いません。

このXMLHttpRequestのアクセスを簡素化したクラスhiHttpRequestを作りました。
使い方はこのようになります。 

<script type="text/javascript" src="json2.js"></script>
<script type="text/javascript">
//...
function someFunc(){
   //...
   var httpRequest= new hiHttpRequest(); // インスタンス生成
   httpRequest.send("POST"               // POSTで送信、"GET"も可
                   ,"http://localhost:8080/test" // URL
                   ,{A:1,B:"X",C:"Y"}    // パラメタ
                   ,my_callback_func     // コールバック関数　
                    );
　 //...
   }
function my_callback_func(responseText  // 応答文
                         ,httpRequest   // この応答を受けたhiHttpRequest
                         ){
   var data= JSON.parse(responseText); // json形式だとしてデータを得る
   //...
   }
//...
</script>
send関数の第１引数でPOSTかGETかを示します。第２引数がURL、第３引数が 構造化されたパラメタ、第４引数がコールパック関数です。

この例ではjsonのデコードにJSON.parseを用いています。これはjson2.jsに 入っています。
json2.jsは次のサイトからダウンロードできます。

クラスは次のようになっています。 

function hiHttpRequest(){}
hiHttpRequest.encode_param=function(params,dlmt){
   var param="";
   for (key in params) {
      param+= dlmt+key+"="+encodeURIComponent(params[key]).replace( /%20/g, '+' );
      dlmt="&";
      }
   return param;
   }
hiHttpRequest.prototype.send=function(method,url,params,callback_){
   param="";
   if( method=="GET" ){
      url= url+hiHttpRequest.encode_param(params,"?");
      }
   else{
      param= hiHttpRequest.encode_param(params,"");
      }
   this.callback   = callback_;
   this.httpRequest= hiHttpRequest.createXMLHttpRequest();
   var _this       = this;
   this.httpRequest.onreadystatechange = function(){_this.stateChange();}
   this.httpRequest.open( method, url );
   this.httpRequest.setRequestHeader( 'Content-Type', 'application/x-www-form-urlencoded' );
   this.httpRequest.send(param);
   }
hiHttpRequest.prototype.stateChange=function(){
   if( this.httpRequest.readyState == 4 && 
       this.httpRequest.status == 200){
      if( this.callback!=null ) this.callback(this.httpRequest.responseText,this);
      }
   }
hiHttpRequest.createXMLHttpRequest=function(){
   if(window.XMLHttpRequest){return new XMLHttpRequest()}
   if(window.ActiveXObject){
      try{return new ActiveXObject("Msxml2.XMLHTTP.6.0")}catch(e){}
      try{return new ActiveXObject("Msxml2.XMLHTTP.3.0")}catch(e){}
      try{return new ActiveXObject("Microsoft.XMLHTTP")}catch(e){}
      }
   return false;
   };

 GET/POSTの値を画面に出す単純サーブレットアプリ

GET/POSTのパラメタをテーブルにして返すサーブレットの例を示します。

POSTメソッドでは リクエストのgetParameterMap()でパラメタ並びを得ます。
注意が必要なのは一つのキーに複数の値が並んでいることです。

残念ながらtomcat5,6ではgetParameterMapはGETメソッドの処理で日本語対応できておらず、 setCharacterEncoding()によるコード設定が無効で、文字化けを起こしてしまいます。
server.xmlの設定で対処可能という話もありますが、残念ながら確認できませんでした。
tomcat7では日本語対応したようです。
異なる環境で安定した動作を得るため自作します。
decodeQuery()が自作関数です。

HTMLのテーブルセルに値をセットするので文字によってはHTMLのエスケープが必要となります。 ここではotsuライブラリのhiNote.hiTextEditの機能を用いています。 otsuライブラリは次のサイトからダウンロードできます。 

// Hello_Srvlet.java
import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;
import java.util.*;
import java.sql.*;
import java.net.*;
import otsu.hiNote.*;
@SuppressWarnings("unchecked")
public class Hello_Srvlt extends HttpServlet {
   final static String charSet="UTF-8";
   void paramDump(String               get_post_
                 ,Map<String,String[]> params_
                 ,HttpServletResponse  response_
                  )throws IOException,ServletException{
      response_.setCharacterEncoding("UTF-8");
      response_.setContentType("text/html; charset=UTF-8");
      StringBuilder _sb=new StringBuilder();
      _sb.append("<html><head><meta http-equiv='Content-Type' Content='text/html;charset=UTF-8'></head><body>\n");
      _sb.append("<table style='width=100%,border:1px solid black ; border-collapse:collapse'>\n");
      _sb.append("<caption>"+get_post_+"パラメーター</caption>");
      _sb.append("<tr><td style='border:1px solid black'>パラメタ名</td>");
      _sb.append("<td style='border:1px solid black'>値</td></tr>\n");
      for(Map.Entry<String,String[]> _param:params_.entrySet()){
         String   _paramName= _param.getKey();
         String[] _paramVals= _param.getValue();
         if( _paramVals==null || _paramVals.length==0 ){
            _sb.append("<tr><td style='border:1px solid black'>"+hiTextEdit.xmlEscape(_paramName)+"</td>");
            _sb.append("<td style='border:1px solid black'></td></tr>\n");
            }
         else {
            for(String _paramVal:_paramVals){
               _sb.append("<tr><td style='border:1px solid black'>"+hiTextEdit.xmlEscape(_paramName)+"</td>");
               _sb.append("<td style='border:1px solid black'>"+hiTextEdit.xmlEscape(_paramVal)+"</td></tr>\n");
               _paramName="";
               }
            }
         }
      _sb.append("</body></html>");
      PrintWriter _out = response_.getWriter();
      _out.println(_sb.toString());
      _out.close();
      }
   // tomcat5,6を日本語対応させる
   static HashMap<String,String[]> decodeQuery(String queryStr_){
      HashMap<String,String[]> _ret=new HashMap<String,String[]>();
      if( !hiU.isNull(queryStr_) ){
         String _qsets[]=queryStr_.split("&");
         for(String _qset:_qsets){
            String _keyNval[]= _qset.split("=");
            if( _keyNval.length!=2 ) continue;
            String[] _params;
            String[] _old_params= _ret.get(_keyNval[0]);
            if( _old_params!=null ){
               _params= new String[_old_params.length+1];
               for(int _n=0;_n<_old_params.length;++_n){
                  _params[_n]= _old_params[_n];
                  }
               }
            else{
               _params   = new String[1];
               }
            try{
               _params[_params.length-1]= URLDecoder.decode(_keyNval[1],charSet);
               }
            catch(Exception _e){
               _params[_params.length-1]= _keyNval[1];
               }
            _ret.put(_keyNval[0],_params);
            }
         }
      return _ret;
      }
   public void doGet(HttpServletRequest  request_,
                     HttpServletResponse response_)
                     throws IOException,
                            ServletException{
      request_.setCharacterEncoding(charSet);// 念のため
      HashMap<String,String[]> _params   = decodeQuery(request_.getQueryString());
      paramDump("GET",_params,response_);
      }
   public void doPost(HttpServletRequest  request_,
                     HttpServletResponse response_)
                     throws IOException,
                            ServletException{
      request_.setCharacterEncoding(charSet);
      Map<String,String[]> _params= request_.getParameterMap();
      paramDump("POST",_params,response_);
      }
   }

 tomcatのアプリ定義(web.xml)

サーブレットクラスとurlの結びつけはweb.xmlで行います。

ここではHello_Srvlt.classをurl:"/disp"で呼び出すことを指定しています。 Hello_Servletはつなぎの名前であまり意味はありません。 

<?xml version="1.0" encoding="ISO-8859-1"?>
<web-app xmlns="http://java.sun.com/xml/ns/javaee"
   xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
   xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
   version="2.5">
    <servlet>
        <servlet-name>Hello_Servlet</servlet-name>
        <servlet-class>Hello_Srvlt</servlet-class>
    </servlet>

    <servlet-mapping>
        <url-pattern>/disp</url-pattern>
        <servlet-name>Hello_Servlet</servlet-name>
    </servlet-mapping>
</web-app>

今回はindex.htmlも置くので、ベースのURL(例えばhttp://localhost:8080/paramDump/)で GET/POST試験アプリにアクセスします。index.htmlからは"disp"を呼んで、 パラメタの確認窓を出しています。
直接http://localhost:8080/paramDump/dispを呼べば、サーブレットが直接動きます。

 warファイルを作ってインストールするANT記述(build.xml)

Tomcatのアプリケーションは通常次の形のディレクトリに置かれます。 

   $CATALINA
   |
   +-- webapps
       |
       +-- アプリ-1
       |   | (index.html)
       |   +-- WEB-INF
       |       | web.xml
       |       +-- lib
       |           | XXX.jar
       |
       +-- アプリ-2
           | (index.html)
           +-- WEB-INF
               | web.xml
               +-- lib
                   | XXX.jar

webappsの下のアプリディレクトリをjar形式にまとめ、.warと名付けて ディレクトリの代わりにwebapps置くことでも動作させることができます。

.warにすれば１個のファイルとしてリリースできます。

次のbuild.xmlでは一旦アプリ形式のディレクトリを作成した上で、 jarコマンドで.warにまとめています。

ant buildで.warファイル"paramDump.war"が作成されます。
これをTomcatのwebappフォルダに置くと
 /paramDump で試験アプリが、
 /paramDump/dispでパラメタ表示サーブレットが
動きます。 

<?xml version="1.0" encoding="UTF-8"?>
<!-- build.xml -->
<project default="main">
   <property name="TomcatDir"
      value="C:/Program Files/Apache Software Foundation/Tomcat 6.0/" />
   <property name="webappsDir"  value="${TomcatDir}/webapps" />
   <property name="classpath"  value="${TomcatDir}/lib/servlet-api.jar;
                                     ./hiNote.jar"/>

   <property name="project"    value="paramDump" />
   <property name="baseDir"    value="./${project}" />
   <property name="installDir" value="./${project}/WEB-INF" />

   <property name="MAIN"       value="Hello_Srvlt" />

   <target name="main" depends="clean,build,install">
      <echo>=== CLEAN BUILD and INSTALL done ===</echo>
   </target>
   <target name="build" depends="compile">
      <jar destfile="${MAIN}.jar" 
           basedir="." 
           includes="**/*.class" >
         <manifest>
            <attribute name="Main-Class" value="${MAIN}"/>
         </manifest>
      </jar>
      <copy file="hi_style.css" todir="${baseDir}/"        overwrite="yes"/>
      <copy file="index.html"   todir="${baseDir}/"        overwrite="yes"/>
      <copy todir="${baseDir}/images" overwrite="yes">
          <fileset dir="images" />
      </copy>
      <copy file="${MAIN}.jar"  todir="${installDir}/lib/" overwrite="yes"/>
      <copy file="hiNote.jar"   todir="${installDir}/lib/" overwrite="yes"/>
      <copy file="web.xml"      todir="${installDir}/"     overwrite="yes"/>
      <jar destfile="${project}.war" 
           basedir="${baseDir}"/>
   </target>
   <target name="compile">
      <javac srcdir           ="."
             includes         ="*.java"
             includeAntRuntime="false"
             encoding         ="UTF-8"
             debug="yes" optimize="no"
             classpath=".;${classpath}" />
   </target>
   <target name="install" depends="build">
      <copy file="${project}.war" todir="${webappsDir}"/>
      <delete dir="${TomcatDir}/webapps/${project}"/>
   </target>
   <target name="clean">
      <delete dir="${baseDir}"/>
      <delete dir="." includes="*.class,${MAIN}.jar,*.BAK,*.war"/>
   </target>
</project>

 JBOSSでサーブレットを動かす

超重量、重た～いアプリケーションサーバとしてJBOSSも使われています。

JBOSSはtomcatを含んでおり、tomcat用に作られたwarをそのまま 動かすことができます。

JBOSSはダウンロードした.zipファイルを適当な場所に展開すれば使用できます。 

次のフォルダにJBOSSが展開されたとして、
　　C:\jboss-as-7.1.1.Final
warファイルを置く場所(tomcatのwebapps相当）は
    C:\jboss-as-7.1.1.Final\standalone\deployments
JBOSS起動は
　　C:\jboss-as-7.1.1.Final\bin\standalone.bat -b 0.0.0.0
確認はブラウザで
　　http://localhost:8080/
    -> Welcome To AS 7 窓が出る
終了
　　起動で開いたDOM窓を閉じる
standaloneの他にdomainもあります。ここでは説明しません。
なお、-b 0.0.0.0が無いとlocalhostでしか動作しません。通常はこの指定が必要です。 Windowsでショートカットで起動している場合[プロパティ][リンク先]に例えば
 C:\jboss-as-7.1.1.Final\bin\standalone.bat -b 0.0.0.0
といった形でオプション指定を付加することができます。

なお、JBOSSの解説書では「JBOSSはTomcatではない」などと書いてある こともありますが、違います。JBOSSは厚化粧のTomcatです。化粧が 濃すぎるだけです。大丈夫です、すっぴんにすることもできます。 安心して使ってください。

 注意事項

アプリを置き換えても、Tomcatを起動しなおさなければ反映されません。

なお、 .warを起動するとディレクトリが展開されます。そのまま.warを変更しても ディレクトリが作り変えられず、変更が反映されないことがあるようです。
.warを配置するときに対応ディレクトリの削除をする必要がありそうです。

完全に置き換えられても、ブラウザがキャッシュしているため反映されない 場合もあります。

 まとめるの結構大変でした。

ここにまとめた全部が一気に必要となる場面はまずないので、メモは あちらこちらに散らばっていました。

2013年7月22日 (月) パソコン・インターネット |

« ◆CANVASを用いたHTMLスライダー | トップページ | シンプル・イズ・ベスト »

トラックバック


この記事へのトラックバック一覧です： GET/POST/open/submit/Ajaxとservlet：多局面メモ:

« ◆CANVASを用いたHTMLスライダー | トップページ | シンプル・イズ・ベスト »