AtlasでのWebサービスの呼び出し

今日はASP.NET "Atlas" で Gadget を作成するの続き的な内容です。
その時は単純にボタンが押されたときに値を表示していましたが、もう少し役立つ例としてWebサービスの呼び出しコードを書いておきます。

まず、呼び出すWebサービスはこんな感じです。

    [WebMethod]
    public string HelloWorld(string strName) {
        return "Hello World " + strName;
    }
# asmxファイルを追加したときに書かれてるメソッドに引数をつけただけです(^_^;)

このWebサービスを呼び出す場合にはJavaScriptでこのような書き方をします。

    WebService.HelloWorld($('Text1').value, OnComplete);

簡単です。
1つめの引数はWebサービスに渡す値ですね。
2つめの引数はなんでしょう？
Webサービスの呼び出しはXMLHttpオブジェクトを使って非同期で呼び出します。
このレスポンスが戻ってきたときの処理を記述するためのメソッドになります。
ですので、レスポンスを受け取ったときにその結果を表示するなどの処理を行う場合は下記のようなコードも記述する必要があります。

function OnComplete(result)
{
    $('Div1').innerText = result;
}

こちらも簡単ですね。
といった形でAtlasのコントロールを使わない場合でもAtlasは非常に便利です。

ちなみに同じ事をAtlasなしで書くとこんな感じで非常にめんどくさいです。
ご参考までに下記に載せておきますね。

// JScript ファイル

function Button1_OnClick() {
  var xmlhttp = createXmlHttp();
  if (xmlhttp == null) {
    window.alert("XMLHttp 未対応");
  }

  xmlhttp.onreadystatechange = handleHttpEvent;

  function handleHttpEvent() {
    if (xmlhttp.readyState == 4) {
      if (xmlhttp.status == 200) {
        var objDOM = xmlhttp.responseXML;
        var strData;

        if (objDOM.documentElement) {
          strData = objDOM.getElementsByTagName('HelloWorldResult').item(0).text;
          if (strData == null) strData = '1';
        } else {
            strData = '2';
        }

        document.getElementById("Div1").innerText = strData;
      }
      else {
        window.alert("通信エラー");
      }
    }
  }

  var xmlDoc = createXmlDom();
  xmlDoc.async = false;
  var strXML = "<?xml version=\"1.0\" encoding=\"utf-8\"?><soap:Envelope xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" xmlns:xsd=\"http://www.w3.org/2001/XMLSchema\" xmlns:soap=\"http://schemas.xmlsoap.org/soap/envelope/\"><soap:Body><HelloWorld xmlns=\"http://tempuri.org/\"><strName>" + document.getElementById("Text1").value + "</strName></HelloWorld></soap:Body></soap:Envelope>";
  xmlDoc.loadXML(strXML);

  xmlhttp.open("POST", "./WebService.asmx");
  xmlhttp.setRequestHeader("SOAPAction", "\"http://tempuri.org/HelloWorld\"");
  xmlhttp.send(xmlDoc);
}

function createXmlDom() {
  if (document.implementation.createDocument) {
    return document.implementation.createDocument("", "", null);
  }
  else if (window.ActiveXObject) {
    return new ActiveXObject("Microsoft.XMLDOM");
  }
  else {
    return null;
  }
}

function createXmlHttp() {
  if (window.XMLHttpRequest) {
    return new XMLHttpRequest();
  }
  else if (window.ActiveXObject) {
    try {
      return new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch(e) {
      return new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
  else {
    return null;
  }
}

function Button1_OnClickAtlas()
{
    WebService.HelloWorld($('Text1').value, OnComplete);
    return false;
}

function OnComplete(result)
{
    $('Div1').innerText = result;
}