본문 바로가기
카카오 REST API & SDK/카카오 로그인

카카오 비즈보드, 애드뷰 "톡에서 회원가입" 링크 구성

by kakao-TAM 2022. 5. 4.

디벨로퍼스, 카카오 비즈보드 활용하기 가이드

카카오비즈보드 바로가기

카카오비즈보드 제작가이드

 

카카오톡내 광고, 비즈보드에서 띄운 애드뷰에는 서비스 회원가입을 바로 할 수 있는 "톡에서 회원가입" 버튼을 설정할 수 있습니다. 

 

1. REST-API 방식 인가요청 주소 설정

현재 서비스하고 있는 사이트에서 JavaScript SDK authorize방식 카카오 로그인이나 REST-API방식 카카오 로그인을 사용하는 경우 이 방식으로 버튼 URL을 생성 가능합니다. 

 

카카오 로그인 인가요청 주소

https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=${REST_API_KEY}&redirect_uri=${REDIRECT_URI}

 

주소에 포함될 ${REST_API_KEY}는 디벨로퍼스의 앱키를 사용하면 되고 ${REDIRECT_URI}는 사이트에 개발된 리다이렉트 URI를 설정하면 됩니다. 유의할 점은 모바일에서 광고를 표시하므로 모바일 주소를 기재해야합니다.

 

리다이렉트 URI를 모른다면 서비스 사이트에서 직접 카카오 로그인 하고 동의창 주소를 복사해서 사용하면됩니다. 

동의창 주소를 복사하면 로그인 방식에 따라 조금 다를 수 있지만, 위 가이드에 표시된 항목들은 모두 존재하며 해당 항목을 제외하고 모두 삭제 해주시면됩니다. 


https://kauth.kakao.com/oauth/authorize?client_id=abcdefghijklmnopqrstuvwxyz&redirect_uri=https%3A%2F%2Fdevelopers.kakao.com%2Ftool%2Fdemo%2Foauth&response_type=code&auth_tran_id=asdfhgfjkl495l2rl1208&ka=sdk%2F1.41.5%20os%2Fjavascript%20sdk_type%2Fjavascript%20lang%2Fko%20device%2FMacIntel%20origin%2Fhttps%253A%252F%252Fdevelopers.kakao.com&is_popup=false


불필요 부분을 제거하면 주소는 아래와 같은 형태가 됩니다.


https://kauth.kakao.com/oauth/authorize?client_id=abcdefghijklmnopqrstuvwxyz&redirect_uri=https%3A%2F%2Fdevelopers.kakao.com%2Ftool%2Fdemo%2Foauth&response_type=code


해당 주소를 브라우저에서 접속하고 동의창 동의 후, 서비스 웹사이트의 회원 가입 완료 페이지로 잘 이동하는지 확인 후, 버튼링크로 사용하시면됩니다.

 

동의창 동의후, 서비스 웹사이트에서 에러 발생한다면 state파라메터를 검증 하고 있지 않은지 확인하시고 개발자와 상의 하셔서 우회 할 수 있는 방안을 마련하거나 동의창 링크가 아닌 회원가입 버튼이 있는 페이지를 링크 해주셔야합니다.

 

2. JavaScript SDK popup방식 카카오 로그인

JavaScript SDK popup방식 카카오 로그인은 리다이렉트 주소가 없으므로 "톡에서 회원가입" 버튼 링크로 인가요청 주소를 사용할 수 없습니다. 이 경우는 state파라메터를 사용할때와 동일하게 동의창 링크가 아닌 회원가입 버튼이 있는 페이지를 링크 해주셔야합니다.

인가요청 주소에 redirect_uri=kakaojs 값이 있으면 JavaScript SDK popup방식입니다.


https://kauth.kakao.com/oauth/authorize?client_id=abcdefghijklmnopqrstuvwxyz&redirect_uri=kakaojs&response_type=code&state=tpn090vujkivem5r2reib&proxy=easyXDM_Kakao_m6sldkokghf_provider&ka=sdk%2F1.41.5%20os%2Fjavascript%20sdk_type%2Fjavascript%20lang%2Fko%20device%2FMacIntel%20origin%2Fhttps%253A%252F%252Fdevelopers.kakao.com&origin=https%3A%2F%2Fdevelopers.kakao.com


서비스 사이트에서 state파라메터를 검증 하거나 JavaScript SDK popup방식을 사용하여 인가요청 주소를 사용할 수 없는 경우 

페이지에 진입하자마자 카카오 로그인하는 별도 페이지를 만들고 해당 주소를 "톡에서 회원가입" 버튼 링크 주소로 사용하셔도 좋습니다. 

 

 

댓글