[Flutter] kakao login 추가(2)

saewoohan·2023년 8월 15일
0

Flutter

목록 보기
7/12
post-thumbnail

🙊 목표

  • 카카오 로그인을 flutter앱에 추가 해보자!

🔑 카카오 로그인 추가

kakao_flutter_sdk

  • 해당 패키지를 다운 받는다
flutter pub add kakao_flutter_sdk_user
dependencies:
  kakao_flutter_sdk_user: ^1.2.1

 📦 추가 순서

1. main.dart 수정

void main() {
  KakaoSdk.init(nativeAppKey: '네이티브 앱 키');
  ...
}
  • main 함수에 해당 코드를 추가한다.

2. 로그인 코드 추가

카카오 로그인 추가 예제

// 카카오 로그인 구현 예제

// 카카오톡 실행 가능 여부 확인
// 카카오톡 실행이 가능하면 카카오톡으로 로그인, 아니면 카카오계정으로 로그인
if (await isKakaoTalkInstalled()) {
  try {
      await UserApi.instance.loginWithKakaoTalk();
      print('카카오톡으로 로그인 성공');
  } catch (error) {
    print('카카오톡으로 로그인 실패 $error');

    // 사용자가 카카오톡 설치 후 디바이스 권한 요청 화면에서 로그인을 취소한 경우,
    // 의도적인 로그인 취소로 보고 카카오계정으로 로그인 시도 없이 로그인 취소로 처리 (예: 뒤로 가기)
    if (error is PlatformException && error.code == 'CANCELED') {
        return;
    }
    // 카카오톡에 연결된 카카오계정이 없는 경우, 카카오계정으로 로그인
    try {
        await UserApi.instance.loginWithKakaoAccount();
        print('카카오계정으로 로그인 성공');
    } catch (error) {
        print('카카오계정으로 로그인 실패 $error');
    }
  }
} else {
  try {
    await UserApi.instance.loginWithKakaoAccount();
    print('카카오계정으로 로그인 성공');
  } catch (error) {
    print('카카오계정으로 로그인 실패 $error');
  }
}
  • 위의 코드는 기본적인 카카오 로그인 구현 예제이다.
  • 해당 코드가 실행되는 flow는 카카오톡으로 로그인을 시도 한 후, 카카오톡이 설치되어 있지 않는 사용자면 웹으로 리다이렉트 해서 카카오 계정으로 로그인을 시도한다.

3. 유저 정보 받아오기

try {
  User user = await UserApi.instance.me();
  print('사용자 정보 요청 성공'
        '\n회원번호: ${user.id}'
        '\n닉네임: ${user.kakaoAccount?.profile?.nickname}'
        '\n이메일: ${user.kakaoAccount?.email}');
} catch (error) {
  print('사용자 정보 요청 실패 $error');
}
  • 해당 코드로 카카오 로그인 시에 동의한 유저의 항목들을 가져올 수 있다.

4. Logout

try {
  await UserApi.instance.logout();
  print('로그아웃 성공, SDK에서 토큰 삭제');
} catch (error) {
  print('로그아웃 실패, SDK에서 토큰 삭제 $error');
}
  • 로그아웃은 상당히 간단하게 위의 코드로 해결 가능하다.

0개의 댓글