firebase - O auth(version9)

기존에 글은 O auth 글은 javascript version8이었고, 지금 쓰고 있는 글은 version9 이다. version9이 되면서 import로 메소드들을 쉽게 받아오게 되면서 모듈들을 사용하기 편해졌다.

 

기존 셋팅 방법부터 조금 달라졌다. 이전에는 단지 import 'firebase/auth' 형태로 사용했지만, version 9 부터는 getAuth 라는 메소드를 호출해서 사용할 수 있다.

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";

export const firebaseConfig = {
  apiKey: process.env.REACT_APP_API_KEY,
  authDomain: process.env.REACT_APP_AUTH_DOMAIN,
  projectId: process.env.REACT_APP_PROJECT_ID,
  storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_MESSAGING_SENDER_ID,
  appId: process.env.REACT_APP_ID,
};

const fbase = initializeApp(firebaseConfig);

export const firebaseInstance = fbase.firebase_;

// version 8
// export const auth = fbase.auth();

// version 9
export const auth = getAuth();

그리고 O auth 메소들도 import로 쉽게 호출하여 사용이 가능하다.

  * signInWithPopup(getAuth인자, 프로바이더) 형태 (version 9)

  * 기존은 auth.signInWithPopup(프로바이더) 형태 (version 8)

import { GoogleAuthProvider, signInWithPopup } from "firebase/auth";
import { auth } from "../firebase";

let provider = null;
provider = new GoogleAuthProvider();
signInWithPopup(auth, provider);

 

이렇게 하고 나서 firebase console에서 로그인한 유저를 확인할 수 있다.