본문 바로가기

Flutter

[Flutter] Firebase 연동

SMALL

Firebase 설정 (android studio 외부에서 진행)

 

해당 게시물은 다음 플러터 버전에서 작성되었다

 

 

cmd(관리자 권한으로 실행)에서 firebase login을 입력했을 때,

아래 이미지와 같이 로그인이 되었다고 나와야 한다

 

 

로그인 하는 방법과 flutterfire 관련한 문제점은 이 게시물을 확인해보자

https://jpointofviewntoe.tistory.com/178

 

[Flutter] 우당탕탕 Firebase 설정 및 에러 해결기

1. 프로젝트 루트에 아래 명령어를 입력하여 플러그인 설치 flutter pub add firebase_core 2. Firebase 서비스를 사용하려면 FlutterFire를 초기화해야하고 FlutterFile는 Firebase CLI에 의존한다고 한다. Firebase CLI

jpointofviewntoe.tistory.com

 

 

 

firebase console에서 새로운 프로젝트를 생성한다

 

 

firebase init을 입력한 뒤, Y를 눌러 계속 진행한다

이 때, 프로젝트에 어떤 서비스를 추가할 것인지를 선택한다

[Authentication은 Extensions를 선택한다]

 

 

Use an existing project를 선택하고 사용할 프로젝트 id를 선택한다

 

설정이 완료되면 다음과 같은 메시지가 출력된다

 

 

firebase console의 `내 앱`을 추가하기 위해 아래의 명령을 실행한다

flutterfire configure --project=프로젝트ID

 

프로젝트 명을 알지 못하는 경우 cmd에서 아래 명령을 실행하여 확인할 수도 있다

firebase projects:list

두 번째 칸 (Project ID)를 입력하면 된다

 

 

 

Can't load Kernel binary: Invalid kernel binary format version.
flutterfire_cli as globally activated doesn't support Dart 2.19.3, try: dart pub global activate flutterfire_cli

만약 이런 메시지가 발생한다면 아래의 명령을 실행하라

dart pub global activate flutterfire_cli

 

 

flutterfire configure를 실행한 뒤에는 어떤 플랫폼을 지원할 것인지를 선택한다

 

 

완료가 되면 아래의 메시지가 나오며, firebase console 내 앱에서 다음과 같이 추가된 것을 확인할 수 있다

 

 

 


Android Studio 내부에서 진행

 

pubspec.yaml에서 firebase_core와 firebase_auth를 추가한다

dependencies:
  flutter:
    sdk: flutter

  cupertino_icons: ^1.0.2
  firebase_core: ^2.24.2
  firebase_auth: ^4.3.0

 

만약 firebase_core와 firebase_auth가 추가되지 않는다면

pubspec.yaml의 가장 상단의 name 부분을 확인해 보자

 

name이 firebase_core나 firebase_auth로 되어있다면 pub get을 할 때, 이미 추가되었다고 하며 오류가 발생할 것이다

작성자가 겪었던 문제

 

 

그리고 main 함수 처음에 다음과 같이 작성하여 firebase를 초기화한다

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(const MyApp());
}

 

 

로그인 상태를 확인하기 위해, 클래스를 작성하고 실행시킨다

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

import 'firebase_options.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(const Auth());
}

class Auth extends StatefulWidget {
  const Auth({super.key});

  @override
  State<StatefulWidget> createState() {
    return _AuthState();
  }
}

class _AuthState extends State<Auth> {
  String authState = "";

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text(authState,
                style: const TextStyle(fontSize: 24, color: Colors.black),
              ),
              ElevatedButton(
                onPressed: () {
                  FirebaseAuth.instance
                      .authStateChanges()
                      .listen((User? user) {
                    if (user == null) {
                      setState(() {
                        authState = 'User is currently signed out!';
                      });
                    } else {
                      setState(() {
                        authState = 'User is signed in!';
                      });
                    }
                  });
                }, child: const Text("auth State")
              ),
            ],
          ),
        ),
      ),
    );
  }
}

 

 

실행 결과는 아래와 같다

 

LIST

'Flutter' 카테고리의 다른 글

[Flutter] 음원 스트리밍 재생  (0) 2025.02.02
[Flutter] 다양한 setState()  (0) 2024.07.19
[Flutter] 다양한 방식의 DropdownButton  (1) 2024.06.19
[Flutter] 다국어 지원  (0) 2024.06.09