Flutter 카카오 로그인 구현하기

 

flutter 에서 카카오 로그인을 구현하려면 플러그인을 사용해야한다.

플러그인은

flutter_kakao_login , Kakao_flutter_sdk

두가지 플러그인이있다.

Kakao_flutter_sdk는 카카오 공식 플러그인이고 로그인 뿐만 아니라 다른 카카오의 api 를사용할수있는반면

flutter_kakao_login 는 써드파티 플러그인이며 로그인 기능만을 구현할수있다.

 

당연히 공식 플러그인을 사용하는게 좋지만

현재 최신버전인 Kakao_flutter_sdk 0.4.2 버전에서 로그인을 구현시 

iOS 빌드가 안되는 에러가 자꾸 발생한다. 그래서 어쩔수 없이 flutter_kakao_login을 사용중이다.

 

     final kakaoSignIn = FlutterKakaoLogin();
     final result = await kakaoSignIn.logIn();

kakaoSignIn.logIn();

을 실행시키면 아래 사진과 같이 로그인 화면을 웹뷰로 띄워준다.

만약 카카오톡이 설치된 경우에는 카카오톡을 실행시켜

첫실행시 동의여부 및 로그인 혹은 동의한 이후로부터는 자동 로그인을 시킨다.

 

그러면 result 에는 status/account/errorMessage 세개의 정보가 들어간다.

로그인 성공여부에관한 status(loggedIn/loggedOut/error) 를 통해 

로그인 혹은 회원가입 로직 ,혹은 실패 로직을 구현하면 된다.

 

switch (result.status) {
	case KakaoLoginStatus.loggedIn:
         //로그인성공시 구현코드
    break;
    case KakaoLoginStatus.loggedOut:
    	//로그아웃시 구현할코드 
    break;
    case KakaoLoginStatus.error:      
    	//로그인을 하지않고 끈경우 동의하지 않은경우 등등...
    break;
}

 

성공한 경우 kakaoSignIn.getUserMe() 메소드를 호출해

유저의 정보들을 받아올수있다.

그리고 accessToken 도 받아올수있다.

final userResult = await kakaoSignIn.getUserMe();
final accessToken = await kakaoSignIn.currentAccessToken;

 userResult 를 통해 받을수있는 카카오 정보는 다음과같다.

 

이후 유저의 이메일과 이름 , 그리고 token 을 가지고와서

Login 혹은 signUp에 관련한 api 통신을 하면된다.  

 //서버와 통신하는 함수
 login( result.account.userEmail, accessToken.token, userResult.account.userNickname);                 
 

 

 

로그아웃또한 간단히 가능하다.

 

final kakaoSignIn = FlutterKakaoLogin();
final result = await kakaoSignIn.logOut();

 

이후 result 의 status (로그인상태) 를 확인한후에 

KakaoLoginStatus.loggedOut 인경우 로그아웃 로직을 구현하면된다.

if(result.status == KakaoLoginStatus.loggedOut){
	//Do Something for logout
}else{
	print('log out err');
}

개발자 이직 비법 보러가기