Vue3, Firebase 프로젝트 - 채팅앱 VSignal

12. Firebase Authentication란?

그랜파 개발자 2025. 4. 20. 02:48

Firebase Authentication

Firebase Authentication(파이어베이스 인증)은 웹 및 모바일 앱에서
사용자 인증을 쉽게 구현할 수 있도록 도와주는 서비스입니다.
서버 없이도 이메일 로그인, 소셜 로그인(Google, Facebook 등), 익명 로그인 등 다양한 인증 방법을 제공해요.

 

🔐 Firebase Authentication이 뭔데?

👉 사용자 인증(로그인/회원가입 등)을 쉽게 구현할 수 있게 해주는 서비스

Firebase가 모든 인증 로직을 알아서 처리해주고,
우리는 간단한 코드만 작성하면 끝!

✅ 주요 기능

기능설명

이메일/비밀번호 로그인 가장 기본적인 로그인 방식
소셜 로그인 Google, Facebook, GitHub, Apple 등
전화번호 로그인 SMS 인증 기반
익명 로그인 비회원 상태에서 앱 체험 가능
JWT 토큰 제공 다른 서비스와 연동 가능
사용자 관리 Firebase 콘솔에서 직접 사용자 확인/관리

 

🧑‍💻 예시: 이메일 회원가입 + 로그인 (Vue 3 + Firebase)

import { auth } from "@/firebase";
import {
  createUserWithEmailAndPassword,
  signInWithEmailAndPassword,
} from "firebase/auth";

// 회원가입
const register = async (email: string, password: string) => {
  const userCredential = await createUserWithEmailAndPassword(auth, email, password);
  console.log("회원가입 성공:", userCredential.user);
};

// 로그인
const login = async (email: string, password: string) => {
  const userCredential = await signInWithEmailAndPassword(auth, email, password);
  console.log("로그인 성공:", userCredential.user);
};

🔐 로그인 후 상태 확인 (onAuthStateChanged)

import { onAuthStateChanged } from "firebase/auth";
onAuthStateChanged(auth, (user) => {
  if (user) {
    console.log("로그인됨:", user.email);
  } else {
    console.log("로그아웃됨");
  }
});

🛡️ 보안도 자동으로?

✔ Firebase Authentication은 보안도 Google Cloud 수준으로 처리해줘요
✔ JWT 토큰 기반 인증으로 안전하게 사용자 상태 관리 가능

💡 요약하면?

장점설명

빠른 구현 몇 줄의 코드로 인증 구현
다양한 로그인 지원 이메일, 소셜, 전화번호 등
보안 강력한 Google 보안 시스템 기반
상태 관리 쉬움 로그인 상태 자동 감지 (onAuthStateChanged)