다음 우편번호 API 사용하기

회원가입을 할 때, 물건을 구입할 때 주소를 거의

필수적으로 쓰게 된다. 이때 우편번호 찾기에서

자기 주소와 우편번호 등을 작성하는데 이번포스팅에서

이것을 직접 구현해보자.

먼저 우편번호 찾기를 구현할때 쓰는 API는 여러가지가

있는데, 그 중, 나는 다음 우편번호 API를 쓸 것이다.

다음 우편번호 API를 선택한 이유는 다른 우편번호 API들 보다

사용하기 쉽고 활용도가 좀 더 좋다는 생각이 들어서 이다.

또한 현재 운영하는 티스토리 블로그가 "다음" 것이기 때문이다...

먼저 다음 우편번호 API를 제공하는 사이트를 들어가보자.

http://postcode.map.daum.net/guide

사이트는 위 처럼 생겼다.

이 사이트에서는 우편번호 찾기 API를 쉽게 사용할수 있도록

보기 좋게 설명되어있다.

처음 기본사용법, 예제, 속성 이 3가지의 탭만 보면

금방 사용할 수 있다.

이제 테스트를 위해 이클립스나 전자정부프레임워크 에서

프로젝트를 하나 생성하거나 기존에 쓰던 프로젝트에서

jsp 하나만 생성해주자.

먼저 기본 사용법 부분을 보면 

다음 우편번호 서비스를 이용하기 위한 설명글이 

짧게 쓰여져 있다. 저 부분중 빨간 밑줄이 있는 스크립트가 중요하다.

이제 기본사용법 밑에 있는 예제 부분을 보자

꼭 읽어 주세요!! 부분을 보면 5가지의 예제가 있는데

이해를 돕기 위해 제작된 것이니 실 사용시 적절하게 수정해서

사용하라고 한다.

예제 코드보기를 누르면 소스를 확인 할 수 있다.

나는 테스트를 위해 두 번째의 사용자가 선택한 값 이용하기

부분에서 예제 코드 보기를 누른후 소스를 긁어 사용했다.

그냥 통째로 긁어와 붙여넣기 했다 바꾼 부분은 스크립트단을

위로 올렸을 뿐이다.(개인적으로 스크립트단을 위에 넣고 사용하기 때문입니다)

이제 프로젝트를 실행해 우편번호 기능을 넣은 화면을 보면

위 처럼 정상적으로 우편번호 찾기가 나온것을 확인 할 수있다.

이제 우편번호 찾기 버튼을 누르면 아래처럼 주소를 검색할 수 있다.

이제 원하는 주소를 찾아 누르면 우편번호와 주소 부분이

채워지고 상세주소에 정확한 동, 호수 를 써줄수 있도록 되어있다.

이제 우편번호 활용을 위한 속성 부분을 보자.

속성은 여러가지가 존재한다.

그 중 테스트를 위한 postcode 부분을 사용해보자. 이것은

(구)우편번호 속성이다. 

다시 jsp로 돌아가 소스 두 줄만 추가해 테스트를 해보자.

data 안의 (구)우편번호 속성값인 postcode 를 test 라는 변수에

저장하고 얼럿을 찍어보자.

이제 우편번호 찾기를 직접 실행해보면 

아래와 같이 입력한 주소의 우편번호가 얼럿창으로 뜨는 것을

확인 할 수 있다.

그 외, 다른 속성들로 도/시 이름, 시/군/구 이름, 사용자가 입력한 검색어

등의 많은 속성들이 있으니 마음대로 활용 할 수 있다.