(株)タックテック TACKTECH,INC.


top > labo > Ajaxその１


Ajaxその１　リモートコントロールソフトの作成 (2)


とりあえず出来ました
とりあえず完成しました。
システムの名称を、WebMonitor（ウェブモニタ）とします。

「とりあえず」というのはイマイチレスポンスが良くないという気持ちの表現です。
但し、コントロールの必要が無い用途ではそれほどレスポンスが要求される事は無いと思いますのでこの程度でも使えるのではないかと
公開する事にしました。

サーバ側はWindows専用です。
尚、サーブレット版はTomcat5.5で動作確認を行いました。
クライアント側はある程度クロスブラウザを意識しましたが、動作確認はWindows上の次のブラウザのみです。

・IE6
・Netscape7
・FireFox1


動作中のイメージです。

Ajaxによるリモートコントロールソフト 　　２つのサーバをサムネイルのように縮小表示しています。
　　※上のスクリーンは自分自身を表示しています。

　　静止画なので伝えられませんがマウスカーソルの移動やクリック、主なキーボード入力が
　　そのままサーバで実行されます。




　　Windows実行形式のサーバでは次のようにサーバの接続ポート、イメージのタイルサイズ、
　　コントロール有効／無効などのオプションも設定できます。

　　環境設定ダイアログ


ダウンロードと実行
■ ダウンロード
　　 Windows 実行形式
　　 サーブレット版

■ 実行
　　・サーブレット版
　　　WebMonitor.warをサーブレットコンテナに配置してください。
　　　Tomcatの場合は%CATALINA_HOME%¥webappsにWebMonitor.warをコピーしてTomcatを再起動します。
　　　次にWebMonJNI.dllをWindowsのシステムフォルダにコピーします。

　　　サーブレット版の場合は次の例のようにブラウザからアクセスすると、そのサーバのモニタリングが開始されます。

　　　　例）http://192.168.1.1/WebMonitor

　　・Windows実行形式
　　　WebMonServer.exeを実行してください。

■ WebMonitorの使い方とサンプルHTML

Windows実行版のサーバを使った最も簡単な例を以下に示します。
LAN接続された192.168.1.1のスクリーンモニタを表示するだけのHTMLです。

  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <meta http-equiv="Content-Type" content="text/html; charset=Shift_Jis">
    <head>
    <title>WebMonitor</title>

      <script src="http://192.168.1.1/WebMonitor?init=guest" type="text/javascript"></script>     ← (1) 

    </head>
    <body>

      <div id="view" style="overflow:scroll; width: 500px; height: 400px; border: 1px solid #000000;"></div>     ← (2) 


      <script type="text/javascript">         ← (3) 
      //<![CDATA[
          var WebMon = new WebMonitor();
          WebMon.init('http://192.168.1.1/', 'view', 1);
      //]]>
      </script>

    </body>
  </html>

(1) JavaScriptをサーバよりロードします。
　　srcの書き方は次の通りです。
　　
　　・Windows実行版サーバの場合の指定
　　　サーバアドレス/WebMonitor?init=パスワード
　　・サーブレット版サーバの場合の指定
　　　サーバアドレス/WebMonitor/WebMonitor?init=パスワード
　　　※サーバアドレスの次にアプリケーション名(WebMonitor)が必要です。
　　
　　現状、パスワードは無視されますのでguestを指定してください。

(2) スクリーンイメージを表示する領域（スクリーンビュー）を用意します。
　　上の例では500×400のサイズで縦横スクロールバーを表示する領域を用意しています。
　　idは表示領域を特定するために必要となりますので必ず指定します。

(3) スクリーンビューを初期化してモニタリングを開始します。
　　WebMonitorのinitメソッドは次のように使います。 　　
　　init(サーバアドレス, スクリーンビューのid, 表示方法);
　　
　　・サーバアドレス
　　　サーバのアドレスを指定します。
　　　サーバがサーブレット版の場合はアプリケーション名(WebMonitor)が必要です。
　　
　　・スクリーンビューのid
　　　(2)で指定したスクリーンビューのidを指定します。
　　
　　・表示方法
　　　0:スクリーンビューのサイズに合わせて縮小表示します。
　　　1:原寸表示します。
　　　2以上：縮小率となります。2の場合は1/2に3の場合は1/3に縮小して表示されます。



次の例はLAN接続された2つのPCを縮小してモニタリングする例です。
1つはWindows実行版のサーバ、もう1つはサーブレット版のサーバを使った例になっています。

  <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <meta http-equiv="Content-Type" content="text/html; charset=Shift_Jis" />
    <head>
    <title>WebMonitor</title>
      <script src="http://192.168.1.1/WebMonitor?init=guest" type="text/javascript"></script>
    </head>
    
    <body>
      <div id="view1" style="width: 500px; height: 400px; border: 1px solid #000000;"></div>
      <script type="text/javascript">
      //<![CDATA[
          var WebMon1 = new WebMonitor();
           WebMon1.init('http://192.168.1.1', 'view1', 0);
      //]]>
      </script>
      <p/>
      
      <div id="view2" style="width: 500px; height: 400px; border: 1px solid #000000;"></div>
      <script type="text/javascript">
      //<![CDATA[
          var WebMon2 = new WebMonitor();
           WebMon2.init('http://192.168.0.2:8080/WebMonitor/', 'view2', 0);
      //]]>
      </script>
      
    </body>
  </html>

同じページ内で複数のサーバをモニタリングする場合は、上の例のように異なるidでスクリーンビューを複数用意します。
その上で複数用意したスクリーンビュー毎にWebMonitorを生成してビューを初期化します。
尚、JavaScriptのロードはどちらのサーバを指定してもOKです。

前のページ   次のページ

 

©2006 TackTech,Inc.