seong
3. Flutter Web 프로젝트 Firebase + Google OAuth 연결하기 3단계 본문
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에 함수 호출
결과
로그인까지 테스트 해보면 아래 처럼 로그에 정상적으로 보이게 된다.
'Flutter > Flutter' 카테고리의 다른 글
Flutter - 페이지 이동 PageRouteBuilder과 Hero 효과 주기 (1) (2) | 2023.08.19 |
---|---|
Flutter - Bottomsheet 키보드 영역 만큼 올리는 법 (0) | 2023.08.14 |
2. Flutter Web 프로젝트 Firebase + Google OAuth 연결하기 2단계 (0) | 2023.07.19 |
1. Flutter Web 프로젝트 Firebase + Google OAuth 연결하기 1단계 (0) | 2023.07.19 |
Flutter: "RenderFlex children have non-zero flex but incoming height constraints are unbounded" 에러 (0) | 2023.07.05 |