Jquery+JSON+WebService 사용 소결
9161 단어 JqueryJSONWebService
의 인터페이스 가 AJAX 의 기능 을 실현 하 는 것 도 비교적 보편적 인 기술 수단 이 되 었 다.WebService 인터페이스의 실현 은 보통 OOP 언어 로 이 루어 진다.그래서.
WebService 의 인터페이스 함수 에 서 는 간단 한 데이터 형식 을 제외 한 복잡 한 데이터 형식 을 만 날 수 있 습 니 다.복잡 한 데이터 형식 기 는
웹 서비스 인터페이스의 매개 변 수 는 웹 서비스의 반환 값 일 수도 있 습 니 다.본문 에서 서술 한 요점 은 다음 과 같다.
1.WebService 인터페이스의 복잡 한 유형의 매개 변수 에 대해 JQ 호출 시 들 어 오 는 JSON 데 이 터 는 어떻게 표시 해 야 합 니까?
2.JQ 가 WebService 호출 에 대해 JSON 데이터 형식 을 가 져 옵 니 다.
3.JQ 호출 시 웹 서비스 가 되 돌아 오 는 복잡 한 데이터 형식 에 대해 어떤 요구 가 있 습 니까?
환경:JQ 버 전:1.4.2,VS 2008 SP1.
테스트 1:WebService 의 간단 한 매개 변수 유형:
WebService ：
[WebMethod(Description = " ")]
public string ProcessPersonalInfo(Person person)
{
return person.Name + person.Tel;
}
JQ ：
$.ajax({
type: "POST",
url: "WebService1.asmx/GetString",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: "{'name':'zhangsan'}",
success: function(json) { alert(json.d) },
error: function(error) {
alert(" " + error.responseText);
}
});
구분 하기 가 쉽 지 않 습 니 다.사실 문자열 은 C\#에서''로 인 한 것 과 유사 합 니 다.JSON 대상 은{}에 직접 적 혀 있 습 니 다.간단 한 테스트 방법 은 alert 함 수 를 통 해 직접 팝 업 하 는 것 입 니 다.[object:object]를 표시 하면
JSON 대상 입 니 다.그렇지 않 으 면 문자열 입 니 다.
결 과 는 다음 그림 과 같다.
테스트 2:WebService 의 복잡 한 매개 변수 유형:
WebService ：
[WebMethod(Description = " ")]
public string ProcessPersonalInfo(Person person)
{
return person.Name + person.Tel;
}
Person ：
public class Person
{
public string Name { get; set; }
public int Age { get; set; }
public string Address { get; set; }
public string Tel { get; set; }
}
JQ ：
$.ajax({
type: "POST",
url: "WebService1.asmx/ProcessPersonalInfo",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: "{'person':{'Name':'zhangsan','Age':28,'Address':'beijing',Tel:'01082658866'}}"，
success: function(json) { alert(json.d) },
error: function(error) {
alert(" " + error.responseText);
}
});
호출 과정 은 간단 한 매개 변수 형식 과 유사 합 니 다.JS 에서 Person 을 표시 하 는 person 대상 의 문자열 을 사용 하여 클 라 이언 트 에 보 내 면 WebService 에서 person 대상 의 문자열 을 자동 으로 보 냅 니 다.
Person 실체 대상 으로 전환 합 니 다.
테스트 3:웹 서비스 에 대한 복잡 한 반환 유형
WebService ：
[WebMethod(Description = " ")]
public List<Person> GetPersonalList()
{
List<Person> persons = new List<Person>
{
new Person {Address = "beijing", Age = 25, Name = "zhangshan", Tel = "01082678866"}
};
return persons;
}<BR> JQ ：
$.ajax({
type: "POST",
url: "WebService1.asmx/GetPersonalList",
dataType: "json",
contentType: "application/json; charset=utf-8",
success: function(json) { $(json.d).each(function() { alert(this.Name + "-" + this.Age + "-" + this.Address + "-" + this.Tel) }) },
error: function(error) {
alert(" " + error.responseText);
}
});
복잡 한 반환 유형 에 대해 서도 처리 방식 이 간단 한 유형 은 기본적으로 같다 는 것 이다.
Jq 호출 시 WebSevice 가 JSON 을 데이터 인 터 랙 션 형식 으로 사용 할 때 데이터 형식 을 되 돌려 주 는 것 은 반드시 직렬 화 될 수 있다 는 관념 을 들 은 적 이 있다.정말 그런 가?
.Net 의 기본 데이터 형식 은 확실히 직렬 화 될 수 있다 는 점 은 의문 이 없다.그럼 List
그 럴 줄 알았어.
[DebuggerTypeProxy(typeof (Mscorlib_CollectionDebugView
[DebuggerDisplay("Count = {Count}")]
[Serializable]
public class List
{
/**/
}
위의 주장 이 성립 된다 면,이런 상황 에서 호출 성공 도 크게 나 무 랄 것 이 없다.그런데 문 제 는 정말 이 렇 습 니까?다음은 계속 테스트 해 보 겠 습 니 다.
테스트 4:웹 서비스 에 대한 복잡 한 반환 유형
[WebMethod(Description = " ")]
public Person GetPerson()
{
Person person = new Person {<BR> Address = "beijing", Age = 27, <BR> Name = "zhangshan", Tel = "01082678866" <BR> };
return person;
}
JQ ：
$.ajax({
type: "POST",
url: "WebService1.asmx/GetPerson",
dataType: "json",
contentType: "application/json; charset=utf-8",
//data: "{'person':{'Name':'zhangsan','Age':28,'Address':'beijing',Tel:'01082658866'}}",
success: function(json) { $(json.d).each(function() { alert(this.Name + "-" + this.Age + "-" + this.Address + "-" + this.Tel) }) },
error: function(error) {
alert(" " + error.responseText);
}
});
그러나 테스트 4 에서 GetPerson()방법 은 Person 데이터 형식 을 되 돌려 줍 니 다.Person 실체의 정 의 를 살 펴 보면 질문 을 직렬 화 할 수 있 는 태그 가 전혀 없습니다.
결 과 를 통 해 알 수 있 듯 이 JQ 는 웹 서 비 스 를 호출 합 니 다.복잡 한 유형의 데 이 터 를 반드시 직렬 화 할 필요 가 있 는 것 은 아 닙 니 다.
다음은 재 미 있 는 테스트 를 해 보 겠 습 니 다.웹 서비스의 반환 유형 은 Hashtable 형식 이 될 수 없다 는 것 을 잘 알 고 있 습 니 다.IDictionary 인 터 페 이 스 를 실현 하기 때문이다.
테스트 5:웹 서비스의 복잡 한 반환 유형 에 대해
[WebMethod(Description = " ")]
public Hashtable GetPersonalHashtable()
{
Hashtable hashtable = new Hashtable();
Person person = new Person { Address = "beijing", Age = 25, Name = "zhangshan", Tel = "01082678866" };
hashtable.Add(1, person);
return hashtable;
}
JQ ：
$.ajax({
type: "POST",
url: "WebService1.asmx/GetPersonalHashtable",
dataType: "json",
contentType: "application/json; charset=utf-8",
data: data,
success: function(json) { $(json.d).each(function() { alert(this["one"].Name) }) },
error: function(error) {
alert(" " + error.responseText);
}
});
이렇게 Jq 가 호출 에 성공 하 다 니.그 건 좀 생각 지도 못 한 일이 야.
요약:
1.Jq 와 WebService 간 에 JSON 을 데이터 교환 형식 으로 할 때 contentType:"application/json;charset=utf-8"은 반드시 지정 해 야 합 니 다.
그렇지 않 으 면 웹 서 비 스 는 어떤 데이터 로 전환 되 는 지 모른다.
2.Jq 에서 WebService 를 호출 하여 복잡 한 데이터 형식 을 되 돌려 주 는 데 반드시 형식 이 직렬 화 되 어야 하 는 것 은 아 닙 니 다.
3.WebService 에서 돌아 온 JSON 데 이 터 는"d"를 통 해 위 테스트 의 alert(json.d)와 같은 데 이 터 를 가 져 옵 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Jquery에서 동일한 NAME 또는 id 행 삭제 작업 가져오기//Jquery 같은 수를 가져오고 줄 수와 인자를 삭제합니다. //ID'''또는this를 통해 본 줄의 두 번째 tdeq를 획득(1) 0부터 $("#"+id+"").parents("tr").find("td:eq(1...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
