jQuery_jquery에서 WebService 메서드 호출 요약

개인적으로는 두 가지가 더 편리하다고 생각합니다. 첫째, WebService에 ajax 요청을 할 때 요청된 url은 서비스 주소/호출된 메서드 이름으로 작성되므로 요청된 메서드에서 호출할 메서드가 결정됩니다. 이제 WebService 코드에서 ajax 요청에 의해 어떤 메소드가 호출되는지 판단할 필요가 없습니다. 둘째, 메소드는 ajax 요청이 반환된 후 객체, 일반 컬렉션 등과 같은 더 많은 데이터 유형을 반환할 수 있으며 이러한 유형은 자동으로 json 객체로 변환됩니다. ashx를 사용하는 경우 이러한 유형을 반환하기 전에 json 형식 데이터로 변환해야 합니다.
jQuery를 사용하여 WebService 메서드를 호출하는 경우 게시 요청만 보낼 수 있습니다. 데이터를 json 형식으로 반환하려면 contentType을 application/json으로 설정해야 합니다. 반환된 데이터는 문자 d를 키로 사용합니다. 값 json 객체.
1. 반환 문자열 유형

코드 복사 코드는 다음과 같습니다.

[WebMethod]
공개 문자열 HelloWorld()
{
return "Hello World";
}

$.ajax({
유형: " 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 user = new User() { Id = 1, UserName = "zhang san", Password = "123qwe" };
사용자 반환
}
$.ajax({
type: "post",
contentType: "application/json",
url: "UserService.asmx/ GetUser",
데이터: "{}",
dataType: "json",
성공: 함수(결과) {
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({
유형: "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,"UserName":"wang wu","Password":"rqwe"}]}. 이때 result.d는 배열을 얻어오고, 배열에 포함된 각 항목의 속성값은 Each 메소드를 통해 순회됩니다.
4. 매개변수를 전달합니다. 매개변수를 전달할 때 ajax 요청 매개변수의 이름은 WebService의 메소드 이름과 일치해야 합니다. 그렇지 않으면 호출이 성공하지 못합니다.

코드 복사

코드는 다음과 같습니다.

[WebMethod]
공개 문자열 Hello(문자열 이름)
{
return "Hello " 이름;
}
$.ajax({
유형: "post",
contentType: "application/json",
url: "UserService.asmx/Hello",
data: "{이름:'admin'}",
dataType: "json",
성공: 함수(결과) {
alert(result.d)
}
});