[flutter] 플러터(Flutter)에서 로그인 기능 구현하기

18 Dec 2023

flutter

플러터(Flutter) 앱을 개발할 때 로그인 기능은 핵심적인 기능 중 하나입니다. 사용자가 로그인하여 서비스를 이용할 수 있도록 구현하는 것은 매우 중요합니다. 이번 포스트에서는 플러터를 사용하여 간단한 로그인 기능을 구현하는 방법에 대해 알아보겠습니다.

1. Firebase를 이용한 로그인 구현

Firebase는 구글에서 제공하는 개발 플랫폼으로, 인증, 데이터베이스, 스토리지 등 다양한 기능을 제공합니다. 이를 이용하여 간단하게 로그인 기능을 구현할 수 있습니다.

먼저, pubspec.yaml 파일에 Firebase 관련 라이브러리를 추가합니다.

dependencies:
  flutter:
    sdk: flutter
  firebase_core: <현재 버전>
  firebase_auth: <현재 버전>

Firebase를 초기화하고 사용자의 이메일과 비밀번호로 로그인하는 간단한 예제 코드는 다음과 같습니다.

import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_auth/firebase_auth.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

Future<UserCredential> signInWithEmail(String email, String password) async {
  UserCredential userCredential = await FirebaseAuth.instance.signInWithEmailAndPassword(
    email: email,
    password: password,
  );
  return userCredential;
}

2. 소셜 미디어를 이용한 로그인 구현

페이스북, 구글, 트위터 등의 소셜 미디어 로그인 기능을 구현할 수도 있습니다. 각 소셜 미디어 제공 업체가 제공하는 SDK를 사용하여 구현할 수 있습니다. 예를 들어, Google Sign-In을 이용한 간단한 로그인 구현 코드는 다음과 같습니다.

import 'package:google_sign_in/google_sign_in.dart';

GoogleSignIn _googleSignIn = GoogleSignIn(
  scopes: [
    'email',
    // 'profile',
  ],
);

Future<UserCredential> signInWithGoogle() async {
  final GoogleSignInAccount googleSignInAccount = await _googleSignIn.signIn();
  final GoogleSignInAuthentication googleSignInAuthentication = await googleSignInAccount.authentication;

  final AuthCredential credential = GoogleAuthProvider.credential(
    accessToken: googleSignInAuthentication.accessToken,
    idToken: googleSignInAuthentication.idToken,
  );

  UserCredential userCredential = await FirebaseAuth.instance.signInWithCredential(credential);
  return userCredential;
}

결론

이제 플러터 앱에서 로그인 기능을 구현하는 방법에 대해 간략하게 알아보았습니다. Firebase를 이용한 이메일/비밀번호 로그인 구현과 Google Sign-In을 이용한 소셜 로그인 구현을 예시로 살펴보았습니다. 앱의 특성에 맞게 적절한 로그인 방식을 선택하여 구현할 수 있을 것입니다.

참고문헌

FlutterFire: https://firebase.flutter.dev/
FlutterFire GitHub: https://github.com/FirebaseExtended/flutterfire