본문 바로가기
비전공자의 코딩 일지/학원 수업 정리

코딩 학원 60일차(다음 우편번호 서비스 api)

by Hoder2 2022. 8. 30.

보통 웹사이트에서 주소 입력할 때 나오는 주소검색 창 기능을 구현해보자.

 

우리가 자주 보던 그 주소검색창은 api를 이용해야한다. 아래의 사이트를 접속 해보면

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

 

Daum 우편번호 서비스

우편번호 검색과 도로명 주소 입력 기능을 너무 간단하게 적용할 수 있는 방법. Daum 우편번호 서비스를 이용해보세요. 어느 사이트에서나 무료로 제약없이 사용 가능하답니다.

postcode.map.daum.net

 

놀랍게도 상업적 이용도 무료다. 키 발급 또한 필요가 없다..!

 

아래에 나와있는 카카오에서 만들어놓은 script를 가져와서 복붙 해준다.

그런데 앞에 보면 src의 주소가 //로 시작하는데 사용하는 사이트에 맞춰서 알아서 작업을 해줘서 상관 없단다.

 

그리고 그냥 이 상태로 쓰면 시작하자마자 저 스크립트가 나올 것이니

 

이렇게 주소 인풋에 아이디를 준 뒤 그 인풋을 클릭할 때 실행되게 해준다.

 

그러면 저 인풋 클릭시 우리가 자주 보던 익숙한 팝업창이 나올텐데 저기서 무엇인가를 선택했을 때 나오는 값들 중 우리가 원하는 값을 골라서 인풋 값에 넣어주면 되겠다.

 

친절하게도 사용법이 잘 나와있다. 원하는 값을 골라준 뒤

 

이런식으로 값을 넣어주면 되겠다.

 

이렇게 잘 값이 찍혀나온다.