다음(카카오) 주소 검색(우편번호 검색) api 오류 해결

안녕하세요. 오랜만에 글로 찾아왔네요..!! ㅎㅎ

최근 다음 주소검색 API를 사용하면서 며칠이나 고생한 이슈에 대해서 공유하려고 찾아왔습니다 !

 

이번 이슈는 php 또는 html을 호스팅한 웹 서버에 올린 뒤 주소검색 API를 사용하는 과정에서 발생하였습니다..!!

시간관계상 웹 서버에 파일을 추가하는 과정은 생략하도록 하겠습니다.(이미 많은 게시물에서 나와있기 때문에 !)

 

문제는 http 통신 환경에서 웹서버에 등록한 파일이 또 다른 js파일을 참조하고 있기 때문이었는데요..

다음 주소검색 api의 경우 http통신과 https통신을 모두 제공하고 있기 때문에 여러분이 참조하고 있는 js파일이 어떤 주소인지를 먼저 확인해야합니다.

//t1.daumcdn.net/mapjsapi/bundle/postcode/prod/postcode.v2.js

//dmaps.daum.net/map_js_init/postcode.v2.js

주소검색 api는 위의 두가지 api를 제공하고 있습니다(저의 경우에는 위의 api를 사용하였습니다).

여기서 위의 두 api는 모두 postcode.map.daum.net 이라는 경로상의 또다른 api를 참조하고 있습니다.

 

제가 직면한 문제는 안드로이드 9(Pie) 이후에 추가된 http 프로토콜 접속제한 때문이었는데요 ! 이를 위해 cleartextTrafficPermitted를 설정해 줘야했습니다.

 

이때 제가 선택한 http통신 예외처리는 다음과 같았습니다(검색해보시면 여러가지 방법이 존재합니다. 제가 선택한 방법에서만 이런 오류가 발생하는 것으로 보입니다..ㅎㅎ).

 

첫번째로 manifests의 application 태그 안에
android:networkSecurityConfig="@xml/network_security_config" 설정을 추가합니다.

 

그런 뒤 xml resource 파일을 생성하고 다음과 같이 파일을 등록해줍니다.

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">your web server url</domain>
        <domain includeSubdomains="true">postcode.map.daum.net</domain>
        <domain includeSubdomains="true">t1.daumcdn.net</domain>
    </domain-config>
</network-security-config>

<network_security_config.xml>

 

여기서 여러분의 웹서버와 t1.daumcdn.net(api url) 뿐만 아니라 postcode.map.daum.net 또한 http통신을 하겠다고 등록해야지만 주소검색 api에서 사용하는 모든 js를 참조할 수 있었습니다.

 

이렇게 http통신을 사용하는데 예외처리가 안되어있다면 daum is not defined 또는 $ is not defined 와 같이 재참조 js파일에서 정의한 변수를 참조하지 못해 앱에서 주소검색 api가 추가가 안되거나, css효과가 먹통이 되고 또는 웹뷰에서

웹뷰 http 예외 미설정 화면

이러한 화면을 만나게 되실 것입니다..!!

 

아무쪼록 많은 분들께서 조금이라도 더 빠르게 연동을 성공하시기를 바라면서(저는 5일을 사용했습니다...) 저는 이만 물러가보도록 하겠습니다 !! ㅎㅎㅎㅎㅎ