ASP - 날씨 비동기 호출

how to weather xml in classic asp / how to weather api in classic asp / how to weather in asp / how to weather api in javascript / how to 비동기 날씨가져오기 in classic asp / how to weather ap in jquery

 

어디 넣어야할지 몰라서 우선 개발을  classic ASP 로 했으니 ㅎㅎ 여기 넣어야겠다

 

사용 설명 : 날씨의 지역을 선택하면 하단의 3일간의 날씨가 비동기로 변경된다.

 

※ 아래 소스는 PC버전을 이용하셔야 보입니다.

 

 

날짜를 선택한다.   ▶▶ 선택시 ▶▶      해당 지역의 날짜(3일간)을 표현한다.

 

1. 보여줄 페이지 (weather.asp)

 참고 : jquery1.10을 사용했습니다.

javascript

function callPage() { var weatherKey = $( "#search_area").val(); var url = './weather_rss.asp'; var divWeather = $(".left_weatherWrap"); var tdiv = ""; $.ajax({ type: "POST", url: url, data:{weatherKey:weatherKey}, success: function(response){ $(".weather_txt").remove(); for (var i in response.weatherData) { tdiv = "<div class='weather_txt'><img src='"+response.weatherData[i].imgWeather+"' alt='"+response.weatherData[i].wfKor+"' /><div class='weather_tw'><span class='txt01'>" + response.weatherData[i].time +"</span><span class='txt02'><span class='txt'>"+ response.weatherData[i].wfKor +"</span><strong>" + response.weatherData[i].temp + " C</strong>("+response.weatherData[i].tmx +"/"+response.weatherData[i].tmn +")</span></div></div>"; divWeather.append(tdiv) } }, dataType: "json" }); }

HTML

<!--//날씨정보 시작--> <div class="left_weatherWrap"> <h4>날씨정보</h4> <select name="sido" id="search_area" class="region" onchange="callPage();"> <option value="4200000000" <%If strKey = "4200000000" Then%>selected="selected" <%End if%>>강원</option> <option value="4100000000" <%If strKey = "4100000000" Then%>selected="selected" <%End if%>>경기</option> <option value="4800000000" <%If strKey = "4800000000" Then%>selected="selected" <%End if%>>경남</option> <option value="4700000000" <%If strKey = "4700000000" Then%>selected="selected" <%End if%>>경북</option> <option value="2900000000" <%If strKey = "2900000000" Then%>selected="selected" <%End if%>>광주</option> <option value="2700000000" <%If strKey = "2700000000" Then%>selected="selected" <%End if%>>대구</option> <option value="3000000000" <%If strKey = "3000000000" Then%>selected="selected" <%End if%>>대전</option> <option value="2600000000" <%If strKey = "2600000000" Then%>selected="selected" <%End if%>>부산</option> <option value="1100000000" <%If strKey = "1100000000" Then%>selected="selected" <%End if%>>서울</option> <option value="3600000000" <%If strKey = "3600000000" Then%>selected="selected" <%End if%>>세종</option> <option value="3100000000" <%If strKey = "3100000000" Then%>selected="selected" <%End if%>>울산</option> <option value="2800000000" <%If strKey = "2800000000" Then%>selected="selected" <%End if%>>인천</option> <option value="4600000000" <%If strKey = "4600000000" Then%>selected="selected" <%End if%>>전남</option> <option value="4500000000" <%If strKey = "4500000000" Then%>selected="selected" <%End if%>>전북</option> <option value="5000000000" <%If strKey = "5000000000" Then%>selected="selected" <%End if%>>제주</option> <option value="4400000000" <%If strKey = "4400000000" Then%>selected="selected" <%End if%>>충남</option> <option value="4300000000" <%If strKey = "4300000000" Then%>selected="selected" <%End if%>>충북</option> </select> <div ID="WeatherDiv"> </div> </div> <!--//날씨정보-->

 

how to weather xml in classic asp / how to weather api in classic asp / how to weather in asp / how to weather api in javascript / how to 비동기 날씨가져오기 in classic asp / how to weather ap in jquery

2. 비동기 데이터 호출 페이지 (weather_rss.asp)

참고: aspJSON1파일(ASP문 JSON 변환)은 다운로드 받으세요.  출처 : http://www.aspjson.com/

 

<!--#include virtual="/include/aspJSON1.13.asp" --> Set oJSON = New aspJSON strKey = request("weatherKey") 'strKey = request("sido") If strKey = "" Then strKey = "1100000000" End If 'RSS사이트의 주소입니다. RSSUrl = "http://www.kma.go.kr/wid/queryDFSRSS.jsp?zone="& strKey 'RSS주소에서 text를추출합니다. 아래 Function참고하세요. RSSData = GetXmlHttp(RSSUrl) 'DOM을 생성합니다. Set xmlDoc = Server.CreateObject("MSXML2.DOMDOCUMENT.4.0") xmlDoc.async = false xmlDoc.loadXml RSSData '위에서 받은 text를 로드합니다. '전체뉴스중 랜덤으로 추출하기 위해서 item노드의 갯수를 구한다. newsLength = xmlDoc.selectNodes("//data").length Set SelectNodes = xmlDoc.SelectNodes("//data") '전체 뉴스의 리스트 Dim strTemp Dim strWeather ' oJSON.data("weatherData") = strKey Set oJSON.data("weatherData") = oJSON.Collection() For x = 0 To newsLength-1 If SelectNodes(x).selectSingleNode("day").Text > 0 then If SelectNodes(x).selectSingleNode("hour").Text = 12 Then Set newitem = oJSON.AddToCollection(oJSON.data("weatherData")) newitem.add "hour", SelectNodes(x).selectSingleNode("hour").Text newitem.add "day", SelectNodes(x).selectSingleNode("day").Text newitem.add "temp", fn_Weather_Cal(SelectNodes(x).selectSingleNode("temp").Text) newitem.add "tmx", fn_Weather_Cal(SelectNodes(x).selectSingleNode("tmx").Text) newitem.add "tmn", fn_Weather_Cal(SelectNodes(x).selectSingleNode("tmn").Text) newitem.add "sky", SelectNodes(x).selectSingleNode("sky").Text newitem.add "pty", SelectNodes(x).selectSingleNode("pty").Text newitem.add "wfKor", SelectNodes(x).selectSingleNode("wfKor").Text newitem.add "wfEn", SelectNodes(x).selectSingleNode("wfEn").Text newitem.add "pop", SelectNodes(x).selectSingleNode("pop").Text newitem.add "time", FormatDateTime(DateAdd("d",SelectNodes(x).selectSingleNode("day").text,now()),1) & " " &SelectNodes(x).selectSingleNode("hour").Text & "시" newitem.add "imgWeather", fn_Weather_img(SelectNodes(x).selectSingleNode("wfKor").text, SelectNodes(x).selectSingleNode("wfEn").text) ' CreateNewsLink(SelectNodes(x)) End if Else If strTemp = "chk" Then Else Set newitem = oJSON.AddToCollection(oJSON.data("weatherData")) newitem.add "hour", SelectNodes(x).selectSingleNode("hour").Text newitem.add "day", SelectNodes(x).selectSingleNode("day").Text newitem.add "temp", fn_Weather_Cal(SelectNodes(x).selectSingleNode("temp").Text) newitem.add "tmx", fn_Weather_Cal(SelectNodes(x).selectSingleNode("tmx").Text) newitem.add "tmn", fn_Weather_Cal(SelectNodes(x).selectSingleNode("tmn").Text) newitem.add "sky", SelectNodes(x).selectSingleNode("sky").Text newitem.add "pty", SelectNodes(x).selectSingleNode("pty").Text newitem.add "wfKor", SelectNodes(x).selectSingleNode("wfKor").Text newitem.add "wfEn", SelectNodes(x).selectSingleNode("wfEn").Text newitem.add "pop", SelectNodes(x).selectSingleNode("pop").Text newitem.add "time", FormatDateTime(DateAdd("d",SelectNodes(x).selectSingleNode("day").text,now()),1) & " " &SelectNodes(x).selectSingleNode("hour").Text & "시" newitem.add "imgWeather", fn_Weather_img(SelectNodes(x).selectSingleNode("wfKor").text, SelectNodes(x).selectSingleNode("wfEn").text) ' CreateNewsLink(SelectNodes(x)) strTemp = "chk" End if End If Next '객체를 소멸시킨다 Set SelectNodes = Nothing 'DOM을 소멸시킨다. Set xmlDoc = Nothing 'XMLHTTP로 원격지 서버의 정보를 긁어오기 Function GetXmlHttp(XMLURL) Set xmlHttp = Server.CreateObject("MSXML2.ServerXMLHTTP") xmlHttp.Open "POST", XMLURL, False xmlHttp.Send GetXmlHttp = xmlHttp.responseText Set xmlHttp = Nothing End Function Function fn_Weather_Cal(strTemp) Dim strCal strCal = "-" select case strTemp case "-999.0" strCal = "-" Case Else strCal = strTemp End Select fn_Weather_Cal = strCal End Function Function fn_Weather_img(strKor, strEn) select case strEn case "Clear" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB01.png" case "Partly Cloudy" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB02.png" case "Mostly Cloudy" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB03.png" case "Cloudy" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB04.png" case "Rain" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB08.png" case "Snow" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB11.png" case "Snow/Rain" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB12.png" case "Rain/Snow" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB13.png" case "구름많고 비" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB20.png" case "구름많고 눈" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB21.png" case "구름많고 눈/비" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB22.png" case "구름많고 비/눈" fn_Weather_img = "http://www.kma.go.kr/images/icon/NW/NB23.png" case "" fn_Weather_img = "NoImage" case else fn_Weather_img = "NoImage" end select End Function 'Return the object Response.ContentType = "application/json" Response.Write oJSON.JSONoutput()