1.  네이버에 회원가입 후  https://developer.naver.com/openapi/register.nhn 에서 아래와 같이 키를 생성 합니다.

 

 

 

 

 

주의! 네이버 로그인 연동하려면 실제 홈페이지 주소와 위 사이트 URL과 동일해야만 정상 작동 됩니다.

애니빌드 솔루션에서는 http://id.anybuild.co.kr 해도 접속 되고  도메인을 설치한 경우 http://www.mydomain.com 등  메인을 추가 설치 할수 있습니다.

예를들어 위 키발급시 사이트URL에 http://www.mydomain.com 으로 발급하는경우, http://www.mydomain.com 에서만 네이버 로그인 연동이 가능하지만  http://id.anybuild.co.kr  에서는 로그인 되지 않습니다.

CallBackURL은 http://자신의도메인/API/naver/login_exec.php  을 입력하시면 됩니다.

 

 

모든정보를 입력하고 [확인] 클릭시 아래와 같이 정상적으로 키 발급되었다는 페이지가 출력됩니다.

 

 

 

 

 

2. https://developer.naver.com/openapi/register.nhn 으로 가셔서 정상적으로 키발급되었는지 확인해보세요.

상세보기를 클릭하면 세부 정보를 볼수 있습니다.

 

여기서  ClientID, ClientSecret 을 메모해두시기 바랍니다.

 

 

3. 애니빌드 솔루션 관리자 모드에서 "외부 API 연동" 모듈을 설치 합니다.

설치 방법은 [프로그램 SHOP > 프로그램 추가설치] 에서 찾아보시면 아래와 같이 설치 할수 있습니다.  (자세한 설치방법은 애니빌드 본사로 별도 문의 바랍니다.)

 

 

4. 설치 후 [프로그램 SHOP > 프로그램 환경설정 > 외부 API 연동]으로 이동 후 위에서 복사해두었던 ClientID, ClientSecret 정보를 붙여 넣습니다. (Ctrl + V)

 

여기까지 작업 했다면 연동 작업은 모두 마무리 되었습니다.

실제 로그인 페이지를 만들어 보겠습니다.

 

 

5. [디자인관리 > 고급 디자인 관리 > 세부 화면 디자인] 으로 이동하고 아래와 같이 "로그인" 페이지를 선택 합니다.

 

소스 수정 모드에서 아래와 같이 네이버 로그인 버튼을 추가 합니다.

이때 임의로 로그인 버튼디자인을 수정하게 되면 네이버 규정상 승인 거절이 될 수 있으므로, 반드시 네이버 BI 디자인 그대로 사용할 것을 권장합니다.

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_g_a_login.PNG' width=120 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_g_a_logout.PNG' width=120 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_g_b_login.PNG' width=70 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_g_c_login.PNG' width=200 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_w_a_login.PNG' width=120 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_w_a_logout.PNG' width=120 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_w_b_login.PNG' width=70 border=0></a>

<a href="javascript:naver_login_form()"><img src='/API/naver/img/naver_w_c_login.PNG' width=200 border=0></a>

 

 

 

이렇게 해서 네이버 로그인 연동 작업이 마무리 되었습니다.

 

사이트에서 테스트해보시기 바랍니다.

 

만약 아래와 같이 접근이 안되는경우 아래 사항을 점검 바랍니다.

 

1. 등록된 도메인 주소와 실제운영중인 도메인주소가 다른경우 
   예를들어 네이버에 등록된 주소가 http://abcd.anybuild.co.kr 이고 실제 운영되는 사이트 주소가 http://www.mydomain.com 이라면 안됩니다. 그리고 띄어쓰기 및 대문자가 들어가면 되므로, 신경써서 입력하시기 바랍니다.

 

2. 이미지 첨부시 사이즈가 140px * 140px , 용량 500k 이하로 첨부해야 합니다. 그렇지 않은경우 위와 같이 이용 제한 페이지가 출력 됩니다.

 

3. 휴대폰 인증을 하지 않은경우

 

그래도 안된다면, 해당 애플리케이션을 삭제 후 다시 처음부터 시도해보시기 바랍니다.

 

 

수고하셨습니다.