Flutter supabase Apple login 구현

 

 

문제 해결 목적

 

 

supabase Apple 로그인 구현하기 

 

문제 해결 과정

 

 

1. 애플 개발자 계정 등록하기 

 

- 애플 개발자 계정을 등록 후 로그인 토큰을 받기 위해 개발자 설정을 진행합니다.

 

 

- 해당 프로젝트  xcode로 들어가서 sigin with Apple 등록합니다.

 

https://nuridal-class.tistory.com/entry/Flutter-Apple-%EA%B0%9C%EB%B0%9C%EC%9E%90-%EC%84%A4%EC%A0%95%ED%95%98%EA%B8%B0

[Flutter] Apple 개발자 설정하기

 

 

 

2. Supabase 인증 - Providers 로 가서 Apple 로그인 을 활성화 시켜줍니다.

- 저기에 앱 번들 ID를 입력한다. (com.example.project)  애플 Oauth 키는 6개월에 한 번씩 바꿔주라는 안내도 있네요

 

 

 

3. 코드 구현하기 

 

 

로그인 

  Future<AuthResponse> signInWithApple() async {
    final rawNonce = supabase.auth.generateRawNonce();
    final hashedNonce = sha256.convert(utf8.encode(rawNonce)).toString();

    final credential = await SignInWithApple.getAppleIDCredential(
      scopes: [
        AppleIDAuthorizationScopes.email,
        AppleIDAuthorizationScopes.fullName,
      ],
      nonce: hashedNonce,
    );

    final idToken = credential.identityToken;
    if (idToken == null) {
      throw const AuthException(
          'Could not find ID Token from generated credential.');
    }

    return supabase.auth.signInWithIdToken(
      provider: OAuthProvider.apple,
      idToken: idToken,
      nonce: rawNonce,
    );
  }

 

로그인 상태 학인 후 페이지 이동

  Future<void> handleLogin() async {
    try {
    
      final session = supabase.auth.currentSession;

      // 세션 정보가 존재하는지 확인
      if (session != null) {
        // 세션 정보가 있으면 다음 페이지로 이동
        Get.offNamed('/BackupLoginPage'); // 다음 페이지로 이동
      } else {
        // 세션 정보가 없으면 로그인 실패
        print('로그인 실패: 세션 정보를 가져올 수 없음');
      }
    } catch (e) {
      // 로그인에 실패한 경우 에러 메시지 출력
      print('로그인 실패: $e');
    }
  }

 

 

예상치 못한 문제들 

 

 

1. 시뮬레이터로 애플로그인을 실행할 때 시뮬레이터 IOS 버전은 16이상으로 진행해야 합니다. 그 이하버전은 로그인 무한 로딩 버그가 있습니다.

 

2. 만약 새로운 애플 ID로 로그인을 진행한다면 Icloud 를 먼저 로그인 후 시뮬레이터에서 로그인을 해야 합니다. icloud 약관 동의가 있어야 로그인과 icloud 가 동시에 잘 이루어집니다. 

 

3. 애플 개발자 계정 설정하는게 꽤 까다로웠습니다....... 뭐든 처음하는게...어렵..

 

 

 

 

 

후 오늘 작업 끝.. 내일은 좀 더 쉬운 구글 로그인 진행해보겠습니다.