jQuery_jquery での WebService メソッドの呼び出しの概要

個人的に便利だと感じている点は以下の2点です。 まず、WebServiceにajaxリクエストをする際、リクエストするURLはサービスアドレス/呼び出されるメソッド名という形で記述されるので、リクエストされた内容で呼び出されるメソッドが決まります。これで、WebService コード内の ajax リクエストによってどのメソッドが呼び出されるかを判断する必要がなくなりました。 2 番目に、メソッドはオブジェクト、汎用コレクションなどのより多くのデータ型を返すことができ、ajax リクエストが返された後、これらの型は自動的に json オブジェクトに変換されます。 ashx を使用する場合、これらの型を返す前に json 形式のデータに変換する必要があります。
jQuery を使用して WebService メソッドを呼び出す場合、送信リクエストのみを送信できます。データを json 形式で返したい場合は、contentType を application/json に設定する必要があります。返されるデータは文字 d をキーとして使用します。値のjsonオブジェクト。
1. 返される文字列の型

コードをコピーします コードは次のとおりです:

[WebMethod]
public string HelloWorld()
{
return "Hello World";

$.ajax({
type: " post" 、
contentType: "application/json"、
url: "UserService.asmx/HelloWorld"、
data: "{}"、
dataType: "json"、
成功: 関数 (結果) {
alert(result.d)
}
});

上記のデータの取得方法: result.d に注意してください。これは、返される json データ形式がキー値として d を持つ json オブジェクトであるためです。 IE 9 の開発者ツールを使用し、F12 を押してネットワークを選択し、「キャプチャ開始」ボタンをクリックしてページを更新すると、以下に示すようにすべてのリクエスト リストが表示されます。

いずれかを選択し、クリックすると詳細ビューに移動します。以下に示すように、送信されたリクエストと応答の内容が表示されます。

この対応するテキストの内容に基づいて、返された内容を取得するために result.d が使用される理由がわかります。

2. オブジェクトの型を返します

コードをコピーします

コードは次のとおりです。 🎜> [WebMethod] public User GetUser() { ユーザー user = new User() { Id = 1、ユーザー名 = "zhang san"、パスワード = "123qwe" }; ユーザーを返す;

}

$.ajax({
type: "post",
contentType: "application/json",
url: "UserService.asmx/ GetUser",
data: "{}",
dataType: "json",
success: function (result) {
alert(result.d.Id " " result.d.UserName) ;
}
});



3. 汎用コレクション型を返します

コードは次のとおりです:

[WebMethod] public List GetUserList() { List = 新しいリスト<ユーザー> () {

新しいユーザー{Id=1,UserName="zhang san",Password="asfasdf"},

新しいユーザー{Id=2,UserName="li si",Password=" 3rwer"},
新しいユーザー{Id=3,UserName="wang wu",Password="rqwe"}
};
戻りリスト;
}
$.ajax({
type: "post",
contentType: "application/json",
url: "UserService.asmx/GetUserList",
data: "{}",
dataType: "json ",
success: function (result) {
$.each(result.d, function (index, data) {
alert(data.Id " " data.UserName) ;
}) ;
}
});


対応するテキストは次のとおりです: {"d":[{"__type":"WebServiceDemo.User] ","Id ":1,"UserName":"zhang san","Password":"asfasdf"},{"__type":"WebServiceDemo.User","Id":2,"UserName":"li si ","パスワード ":"3rwer"},{"__type":"WebServiceDemo.User","Id":3,"ユーザー名":"wang wu","パスワード":"rqwe"}]}。このとき、result.d は配列を取得し、配列内の各項目の属性値が each メソッドを介して走査されます。
4. パラメータを渡します。パラメータを渡すときは、ajax リクエスト パラメータの名前が WebService のメソッドの名前と一致している必要があることに注意してください。そうでない場合、呼び出しは成功しません。

コードをコピー


コードは次のとおりです:

[WebMethod]
public string Hello(string name)
{
return "Hello " name;
}
$.ajax({
type: "post",
contentType: "application/json",
url: "UserService.asmx/Hello",
data: "{name:'admin'}",
dataType: "json",
success: function (result) {
alert(result.d)
}
});