반응형
.Net은 자체적으로 Ajax를 지원 하지만 아주 가끔 asp 나 php 형태의 Xmlhttp 를 사용해야할 경우가 있다
이때 참조 할 유용한 url
http://netmenos.tistory.com/category/Std/Javascript?page=2
xml.aspx ( javascript 부분 )
xml.aspx ( body 부분 )
xmldata.aspx.cs ( 데이터 부분 )
이때 참조 할 유용한 url
http://netmenos.tistory.com/category/Std/Javascript?page=2
xml.aspx ( javascript 부분 )
001 |
<script language= "javascript" type= "text/javascript" > |
002 |
// 참고 사이트 : http://www.ibm.com/developerworks/kr/library/wa-ajaxintro2/ |
003 |
|
004 |
var request = false ; |
005 |
|
006 |
try { |
007 |
request = new XMLHttpRequest(); |
008 |
} |
009 |
catch (trymicrosoft) { |
010 |
try |
011 |
{ |
012 |
request = new ActiveXObject( "Msxml2.XMLHTTP" ); |
013 |
} |
014 |
catch (othermicrosoft) |
015 |
{ |
016 |
try |
017 |
{ |
018 |
request = new ActiveXObject( "Microsoft.XMLHTTP" ); |
019 |
} |
020 |
catch (failed) |
021 |
{ |
022 |
request = false ; |
023 |
} |
024 |
} |
025 |
} |
026 |
|
027 |
if (!request) |
028 |
alert( "Error initializing XMLHttpRequest!" ); |
029 |
|
030 |
// if (request.overrideMimeType) { |
031 |
// request.overrideMimeType("text/xml"); |
032 |
// //alert("Type Setting"); |
033 |
// } |
034 |
|
035 |
|
036 |
function getCustomerInfo() { |
037 |
|
038 |
var url = "/javascript/ex/xmldata.aspx" ; |
039 |
|
040 |
/* |
041 |
해더에 대한 요청 ( GET / POST ) |
042 |
*/ |
043 |
request.open( "GET" , url, true ); |
044 |
request.onreadystatechange = updatePage; |
045 |
request.send( null ); |
046 |
} |
047 |
|
048 |
function updatePage() { |
049 |
|
050 |
/* |
051 |
readyState 속성 |
052 |
readyState == 0 |
053 |
(open()을 호출하기 전에는) 요청이 초기화 되지 않는다. |
054 |
readyState == 1 |
055 |
(send()를 호출하기 전에는) 요청은 설정은 되지만 보내지지 않는다. |
056 |
readyState == 2 |
057 |
요청이 보내지고 처리 중에 있다. (이 시점에서 응답에서 콘텐트 헤더를 얻을 수 있다.) |
058 |
readyState == 3 |
059 |
요청이 처리 중에 있다. 부분적인 데이터를 응답에서 사용할 수 있지만 서버는 이 응답으로는 종료되지 않는다. |
060 |
readyState == 4 |
061 |
응답이 완료된다. 서버의 응답을 받고 이를 사용한다. |
062 |
|
063 |
요청에 준비 대한 상태는 브라우저 마다 서로 다른 상태를 나타낸다. |
064 |
ex) |
065 |
firefox : 1, 2, 3, 4 |
066 |
익스플로러 : 1, 2, 3, 4 |
067 |
사파리 : 2, 3, 4 |
068 |
오페라 : 3, 4 |
069 |
*/ |
070 |
if (request.readyState == 4) { |
071 |
|
072 |
/* |
073 |
응답이 온 해더 보기 |
074 |
이렇게 응답헤더 정보를 통해 추가정보나 기능을 제공할 수 있다. |
075 |
request.getResponseHeader("Content-Length"); 콘텐츠 길이 |
076 |
request.getResponseHeader("Content-Type"); 콘텐츠 타입 |
077 |
*/ |
078 |
//alert(request.getAllResponseHeaders()); |
079 |
|
080 |
/* |
081 |
status 속성 |
082 |
401: Unauthorized |
083 |
403: Forbidden |
084 |
404: Not Found |
085 |
200: Everything is OK |
086 |
301: Moved permanently |
087 |
302: Found (요청이 또 다른 URL/URI로 리다이렉션 된다.) |
088 |
305: Use Proxy (요청은 프록시를 사용하여 요청 받은 리소스에 액세스 해야 한다.) |
089 |
|
090 |
*/ |
091 |
if (request.status == 200) { |
092 |
//var response = request.responseText; |
093 |
|
094 |
var alias = document.getElementById( "alias" ); |
095 |
var str = "" ; |
096 |
|
097 |
// XML을 XML로 취급하기 |
098 |
/* |
099 |
* XML 문서를 처리하기 위한 DOM 요소의 속성 |
100 |
- childNodes : 현재 요소의 자식을 배열로 표현한다. |
101 |
- firstChild : 현재 요소의 첫번째 자식이다. |
102 |
- lastChild : 현재 요소의 마지막 자식이다. |
103 |
- nextSibling : 현재 요소의 바로 다음의 요소를 의미한다. |
104 |
- nodeValue : 해당 요소의 값을 읽고 쓸 수 있는 속성을 정의한다. |
105 |
- parentNode : 해당 요소의 부모노드이다. |
106 |
- previousSibling : 현재 요소와 바로 이전의 요소를 의미한다. |
107 |
|
108 |
* XML 도큐먼트를 다루는 유용한 DOM 요소의 메소드 |
109 |
- getElementById(id) : 도큐먼트에서 특정한 id 속성값을 가지고 있는 요소를 반환한다. |
110 |
- getElementsByTagName(name) : 특정한 태그 이름을 가지고 있는 자식 요소를 구성된 배열을 리턴한다. |
111 |
- hasChildNodes() : 해당 요소가 자식 요소를 포함하고있는지를 나타내는 boolean 값을 리턴한다. |
112 |
- getAttribute(name) : 특정한 name 에 해당하는 요소의 속성값을 리턴한다. |
113 |
*/ |
114 |
var xmlDoc = request.responseXML; |
115 |
var showElements = xmlDoc.getElementsByTagName( "show" ); |
116 |
//alert(showElements.length); |
117 |
|
118 |
for ( var x = 0; x < showElements.length; x++) { |
119 |
// We know that the first child of show is title, and the second is rating |
120 |
//alert(showElements[x].childNodes.length); |
121 |
var title = showElements[x].childNodes[0].firstChild.nodeValue; |
122 |
var rating = showElements[x].childNodes[1].firstChild.nodeValue; |
123 |
|
124 |
str = str + title + " : " + rating + "<br />" ; |
125 |
} |
126 |
|
127 |
alias.innerHTML = str; |
128 |
|
129 |
} else |
130 |
alert( "status : " + request.status); |
131 |
} |
132 |
} |
133 |
</script> |
xml.aspx ( body 부분 )
1 |
< div id = "alias" ></ div > |
2 |
< p >< input type = "button" value = "전송" id = "but" onclick = "getCustomerInfo();" /></ p > |
xmldata.aspx.cs ( 데이터 부분 )
01 |
protected void Page_Load( object sender, EventArgs e) |
02 |
{ |
03 |
Response.Expires = -1; |
04 |
Response.ContentType = "text/xml" ; |
05 |
string str = string .Empty; |
06 |
StringBuilder sb = new StringBuilder(); |
07 |
sb.Append( "<?xml version=\"1.0\" encoding=\"utf-8\" ?><ratings>" ); |
08 |
|
09 |
sb.Append( "<show>" ); |
10 |
sb.Append( "<title>Alias</title>" ); |
11 |
sb.Append( "<rating>6.5</rating>" ); |
12 |
sb.Append( "</show>" ); |
13 |
sb.Append( "<show>" ); |
14 |
sb.Append( "<title>Lost</title>" ); |
15 |
sb.Append( "<rating>14.2</rating>" ); |
16 |
sb.Append( "</show>" ); |
17 |
sb.Append( "<show>" ); |
18 |
sb.Append( "<title>Six Degrees</title>" ); |
19 |
sb.Append( "<rating>9.1</rating>" ); |
20 |
sb.Append( "</show>" ); |
21 |
sb.Append( "</ratings>" ); |
22 |
Response.Write(sb.ToString()); |
23 |
Response.End(); |
24 |
} |
반응형
'IT 관련 이야기 > .NET' 카테고리의 다른 글
silverlight4예제 (0) | 2010.10.02 |
---|---|
Linq 관련 샘플 (0) | 2010.10.02 |
web.config 관련 (0) | 2010.09.27 |
LDAP 관련 C# 프로그래밍 참조 (0) | 2010.04.14 |
AD Handle C# Code Sample (0) | 2008.06.17 |