[Rest Api] 카카오톡 로그인 api 구현 (6) - vue.js 최종 코드
·
프로젝트/Plan + tiful (플랜티플)
카카오톡 로그인 메서드 구현 kakaoLogin() { const redirect_uri = 'http://localhost:8182/kakaojoin'; const clientId = '자신의 키'; const Auth_url = `https://kauth.kakao.com/oauth/authorize?response_type=code&client_id=${clientId}&redirect_uri=${redirect_uri}`; window.location.href = Auth_url; } created 함수 적용 카카오디벨로퍼스에 미리 정해 놓은 클라이언트 측 redirect_uri 페이지를 component로 작성한다. 그 뒤 해당 페이지가 로딩되자마자 인자로 받았던 인가코드를 빼내어 카카오톡에게 ..
[Rest Api] vue와 Spring boot를 이용한 카카오톡 로그인 api 구현 (2)
·
프로젝트/Plan + tiful (플랜티플)
[동의 항목 설정] 카카오톡 로그인 서비스를 ON으로 돌리면 흔히 보는 동의 설정이 가능한 목록들이 나온다. 여기서 필요한 정보만 상태를 설정해서 가져오면 된다. 근데 우선 나는 TEST 버전이라 설정할 수 있는 내용이 딱히 많지 않았다. 그중 필요한 정보만 동의받는 걸로 설정을 해주었다. 선택한 동의 항목들이 이렇게 로그인 후 해당 웹사이트에 가입 할 때 나타난다. [인가 코드 받기] 이제 기본적인 설정은 끝이 났다! 본격적인 코드를 짜보러 가보자! 첫 번째로 인가코드 받기이다. 일단 인가코드 받는 건 너무너무 쉽다. 카카오톡 디벨로퍼스 -> 문서 -> 카카오 로그인 -> REST API에 들어가서 오른쪽 리스트 중 인가코드 받기 하기와 같은 페이지를 만날 수 있다. 여기서 필요한 건 카카오에서 친절하..
[Rest Api] vue와 Spring boot를 이용한 카카오톡 로그인 api 구현 (1)
·
프로젝트/Plan + tiful (플랜티플)
파이널 프로젝트에 들어가면서 제일 해보고 싶었던 게 연동 로그인 구현이었다. 카카오 공화국 답게 요즘 카카오톡 연동 서비스 없는 웹사이트 어디에도 없다고요ㅠ 유행에 뒤처지고 싶지 않은 나, 일단 구현하는 것에 도전해 보기로 한다. Java를 사용하여 REST API로 개발하고 백엔드에서는 Spring Boot와 JPA를 사용했으며, 프론트엔드에서는 Vue.js를 사용하였다. 카카오톡 api를 구현할 때 제일 어려웠던 부분이 다른 분들이 사용한 언어와 방식이 모두 달라서 정작 나에게 맞는 방식을 찾을 수가 없다는 것이었다. 유튜브도 없고, 진짜 머리 좀 엄청 싸맸는데 혹시 나와 같은 개발도구를 사용하는 분들이 보고 꼭꼭 도움이 되었으면 좋겠꾸여? 일단 각각의 큰 틀부터 말하자면 로그인 카카오 디벨로퍼스 가..
해니01_15
'카카오톡로그인api' 태그의 글 목록