Java Servlet과 jQuery를 이용한 환율정보(from 네이버) 가져오기



요런걸 해도 되는진 모르긋지만 재미삼아서 한번 만들어 보았다.


환율정보를 가져오는 OpenAPI 를 한번 디벼 보았지만 별로 신통한게 없어서 네이버 메인 훌래쉬에서 땡겨다 쓰는 환율정보 XML 을 써보기로 했다.



네이버 메인화면 오른쪽에 보면 여러가지 정보를 제공하는 위젯 훌래쉬가 보인다.




위젯 훌래쉬 메뉴 중에 고맙게도 "환율" 이라는 메뉴가 있어서 한번 클릭해 보았다. 우리나라 통화를 기준으로 다른 여러나라들의 환율정보를 보여준다.


대부분의 훌래쉬는 데이터를 외부 url 에 있는 xml 파일같은걸로 땡겨오는데


네이버 메인 훌래쉬를 한번 분석해 보니깐 환율정보는 http://www.naver.com/include/timesquare/widget/exchange.xml 요기에서 땡겨오고 있었다.


넘어오는 xml 구조를 보기 위해서 죠 주소를 브라우져 주소창에 입력해 보았다. 하지만 찾을 수 없는 페이지라고만 딸랑 뜬다.



왜 그럴까 하고 고민하다 그냥 구글에게 물어보기로 하고 뽓 물어보니 HTTP 요청할때 헤더값중 이전에 머물렀던 URL 을 뜻하는 Referer 의 값이 naver.com 도메인에 속한 URL 이어야 한다는 것이였다.


역시 분명히 될것 같은데 안될때는 뻘짖하지 말고 구글에 물어보는게 제일 빠른것 같다.


그렇다면 요런식으로 Referer 헤더를 살 바꿔서 호출해야 한다. 인터넷에 있는 예제는 PHP 용 밖에 없는것 같다.

Java 로 할려면 요런 코드를 쓰면 된다.

URLConnection conn = new URL("http://www.naver.com/include/timesquare/widget/exchange.xml").openConnection();
conn.addRequestProperty("Referer", "http://www.naver.com");



Java 어플리케이션에서만 쓸려면 그냥 저렇게 xml 을 가져와서 xml 파싱후 원하는 데이터만 뽑아내서 쓰면 된다.


하지만 여기서 한걸음 더 나가 웹어플리케이션에서 데이터를 가져와서 html 로 보여주고 싶다. 


xml 가져와서 xml 문서를 리턴해주는 부분은 Java Servlet 으로 맹글고, jQuery ajax 요청으로 고 서블릿을 호출해서 데이터를 가져온 후 화면에 살 뿌려보자.



먼저 서블릿 소스

자기의 스타일에 맞게 바꿔 쓰면 된다. 말리진 않음.

package com.tistory.stove99;

import java.io.BufferedReader;
import java.io.BufferedWriter;
import java.io.IOException;
import java.io.InputStreamReader;
import java.net.URL;
import java.net.URLConnection;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class CurrencyXmlServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

    public CurrencyXmlServlet() {
        super();
    }

	protected void doGet(HttpServletRequest request, HttpServletResponse response) 
			throws ServletException, IOException {
		generateXML(request, response);
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) 
			throws ServletException, IOException {
		generateXML(request, response);
	}
	
	private void generateXML(HttpServletRequest request, HttpServletResponse response){
		response.setContentType("text/xml");
		
		URLConnection conn = null;
		BufferedWriter bw = null;
		BufferedReader br = null;
		
		try{
			conn = new URL("http://www.naver.com/include/timesquare/widget/exchange.xml").openConnection();
			conn.addRequestProperty("Referer", "http://www.naver.com");
			
			br = new BufferedReader(new InputStreamReader(conn.getInputStream(), "UTF-8"));
			bw = new BufferedWriter(response.getWriter());
			
			String line = null;
			while( (line=br.readLine())!=null ){
				bw.write(line);
			}
		}catch(Exception ex){
			
		}finally{
			try {bw.close();} catch (IOException e) {e.printStackTrace();}
		}
	}
}

web.xml 에 서블릿 맵핑

<servlet>
	<servlet-name>currencyServlet</servlet-name>
	<servlet-class>com.tistory.stove99.CurrencyXmlServlet</servlet-class>
</servlet>
<servlet-mapping>
	<servlet-name>currencyServlet</servlet-name>
	<url-pattern>/currency/xml</url-pattern>
</servlet-mapping>


만약 스프링 @MVC 로 하는 후로젝트라면 구찮게 저렇게 할 필요없이 딸랑 요런 메소드 하나면 위와 완전 똑같다.

@RequestMapping("/currency/xml")
@ResponseBody
public void currency(HttpServletResponse response) throws Exception{
	response.setContentType("text/xml");
	
	URLConnection conn;
	BufferedWriter bw;
	BufferedReader br;
	
	conn = new URL("http://www.naver.com/include/timesquare/widget/exchange.xml").openConnection();
	conn.addRequestProperty("Referer", "http://www.naver.com");
	
	br = new BufferedReader(new InputStreamReader(conn.getInputStream(), "UTF-8"));
	bw = new BufferedWriter(response.getWriter());
	
	String line = null;
	while( (line=br.readLine())!=null ){
		bw.write(line);
	}
	
	bw.close();
}



이제 Servlet 을 다 했으니 쪽바로 땡겨오나 테스트를 해보자. 서버를 띄우고 주소창에 http://127.0.0.1:8080/currency/xml 을 뿍 입력해 보면


정상적으로 xml이 잘 뜬다. xml 태그들이 뜻하는거는 네이버 환율정보 화면을 비교해 보며 대충 때려 맞추길 바란다.






jQuery 를 이용한 데이터 파싱및 화면에 뿌리기 소스

<html>
<head>
	<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
	
	<script>
		$(document).ready(function(){
			$.ajax({
				url : "/currency/xml",
				success : function(xml){
					xml = $(xml);
					
					xml.find("currency").each(function(){
						var tr = $("<tr><td/><td/><td/><td/></tr>");
						tr.find("td:eq(0)").text($(this).find("hname").text());
						tr.find("td:eq(1)").text($(this).find("standard").text());
						tr.find("td:eq(2)").text($(this).find("buy").text());
						tr.find("td:eq(3)").text($(this).find("sell").text());
						
						$("#currencyResult tbody").append(tr);
					});
				}
			});
		});
	</script>
</head>

<body>
	<table id="currencyResult" border="1">
		<colgroup>
			<col width="25%"/>
			<col width="25%"/>
			<col width="25%"/>
			<col width="25%"/>
		</colgroup>
		<thead>
			<tr>
				<th></th>
				<th>매매기준</th>
				<th>현찰살때</th>
				<th>현찰팔때</th>
			</tr>
		</thead>
		<tbody></tbody>
	</table>
</body>
</html>



출력 결과