Flutter/Flutter
3. Flutter Web 프로젝트 Firebase + Google OAuth 연결하기 3단계
hyeonseong
2023. 7. 20. 17:18
Button을 만들고 로그인 까지 테스트 해보기
1. 먼저 버튼을 만들어준다.
ElevatedButton.icon(
onPressed: () {
},
icon: FaIcon(FontAwesomeIcons.google),
label: Text("Google login"),
)
2. google_sign_provider 작성
final googleSignProvider = Provider<GoogleSignProvider>((ref) {
return GoogleSignProvider(ref);
});
class GoogleSignProvider {
final Ref _ref;
GoogleSignProvider(this._ref);
final googleSignIn = GoogleSignIn();
// 로그인한 사용자를 저장할 변수
User? _user;
User get user => _user!;
Future<void> googleLogin() async {
try {
// 구글 로그인시도
final GoogleSignInAccount? googleUser = await googleSignIn.signIn();
if (googleUser == null) {
// 사용자가 로그인을 취소한 경우
return;
}
// Firebase Authentication에 사용자 정보 추가
final GoogleSignInAuthentication googleAuth =
await googleUser.authentication;
final googleAuthCredential = GoogleAuthProvider.credential(
accessToken: googleAuth.accessToken,
idToken: googleAuth.idToken,
);
final userCredential = await FirebaseAuth.instance
.signInWithCredential(googleAuthCredential);
//로그인한 사용자 정보 저장
_user = userCredential.user;
} catch (error) {
Logger().d('Google 로그인 에러: $error');
}
}
}
3. Login Page에서 Provider 함수 호출
build 아래 부분에 Provider를 선언해준다.
Button의 onPressed에 함수 호출
결과
로그인까지 테스트 해보면 아래 처럼 로그에 정상적으로 보이게 된다.