JavaScript から ASP.NET Webservice のメソッドを呼び出す。

ASP.NET AJAX Extension で構成された Web Service は
Microsoft AJAX Library を使用した Javascript から簡単に呼び出すことが出来ます。

WebService の作成
1.ASP.NET AJAX-Enabled Web Site を作成する。
画像


2.プロジェクトにWebServiceを追加する。
画像


3.ScriptService 属性を付加する。
<Script.Services.ScriptService()> _
<WebService(Namespace:="http://comuplus.net/")> _
<WebServiceBinding(ConformsTo:=WsiProfiles.BasicProfile1_1)> _
<Global.Microsoft.VisualBasic.CompilerServices.DesignerGenerated()> _
Public Class WebService
   Inherits System.Web.Services.WebService

   <WebMethod()> _
   Public Function HelloWorld() As String
       Return "Hello World"
   End Function

End Class

HTML の作成
1.HTML に Microsoft AJAX Library をリンクする。
 <script type="text/javascript" src="js/MicrosoftAjax.js" ></script>
 <script type="text/javascript" src="js/MicrosoftAjaxTimer.debug.js" ></script>
 <script type="text/javascript" src="js/MicrosoftAjaxWebForms.js" ></script>


2.作成した WebService の Proxy オブジェクトをリンクする。
 <script type="text/javascript" src="http://localhost/AjaxEnabledWebSite/WebService1.asmx/js" ></script>

3.Proxy を通して WebService を呼び出す。
function OnComplete(value) {
 alert(value);
}
function OnTimeOut(value) {
 alert("タイムアウト");
}
function OnError(value) {
 alert("エラー");
}
WebService.HelloWorld(OnComplete, OnTimeOut, OnError)


WebServiceと違うディレクトリにHTMLを置く場合は次のように
WebServiceへのフルパスを指定する必要があります。
(クロスドメイン不可、ただしIEでローカルファイルとして開いたり、ブラウザの設定でクロスドメインを許せば可能)
WebService.set_path("http://localhost/AjaxEnabledWebSite/WebService.asmx");


参考
すてきな ASP.NET(MSDN)

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 2

面白い 面白い

この記事へのコメント

この記事へのトラックバック