[Flutter] firebase로 구글 로그인 하기

이번에 플러터를 다루게 되면서 해당 어플에 구글 로그인 기능을 집어 넣어야 합니다. 그래서 어떻게 진행 해야 하는지 알아 보도록 하겠습니다.

 

우선 Firebase 사이트에 들어갑니다.

여기서 왼쪽 상단의 Authentication에 들어갑니다. Sign-in method 에 들어가서 구글을 추가 해줍니다.

이렇게 허용이 된 상태로 설정을 해준다음

Future<UserCredential> signInWithGoogle() async {

    // 구글 로그인 흐름 시작
    final GoogleSignInAccount? googleUser = await GoogleSignIn().signIn();

    // 인증 세부 정보 가져오기
    final GoogleSignInAuthentication? googleAuth =
        await googleUser?.authentication;
    // 새 자격 증명 만들기
    final credential = GoogleAuthProvider.credential(
      accessToken: googleAuth?.accessToken,
      idToken: googleAuth?.idToken,
    );

    // 로그인 후 UserCredential 반환
    return await FirebaseAuth.instance.signInWithCredential(credential);
  }

이 코드를 넣고 버튼을 만들어 클릭시 signInWithGoogle()이 실행 하게 만듭니다.

이때 다른 블로그들을 보면서 진행을 했었는데 

Lost connection to device.

버튼을 클릭시 구글 로그인이 진행이 안되고 위에 처럼 디바이스와 연결이 안된다고 계속 튕겼는데 

https://www.dbestech.com/tutorials/flutter-google-sign-in-firebase-auth-login

Flutter Google Sign In | Firebase Auth Login

이 영상 보니깐 바로 문제가 해결이 됐습니다. 

Runner 파일 안에 GoogleService-info.plist와 info.plist에 작업을 진행 해줘야 합니다.

일단 info.plist에

<key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleTypeRole</key>
            <string>Editor</string>
            <key>CFBundleURLSchemes</key>
            <array>
                <!-- TODO Replace this value: -->
                <!-- Copied from GoogleService-Info.plist key REVERSED_CLIENT_ID -->
                <string>com.googleusercontent.apps.826440745262-jc2e51jn4sfu7648uh66ina8ec6161ut</string>
            </array>
        </dict>
 </array>

넣어주고 

<string>com.googleusercontent.apps..... 이 부분에 GoogleService-info.plist의 사용자의 content로 변경하면 구글 로그인이 잘 작동 합니다.

Lost connetion Device 문제를 해결하는데 있어서는 이 영상을 참고 했다.

https://www.youtube.com/watch?v=x5TaSb4lZkU