Firebase - Authentication

Firebase에서 제공하는 인증(Authentication) 기능을 사용하기 위해 필요한 모듈

 

 

1) 인증 방법 설정하기 )

 

빌드- Authentication 메뉴 -> sign-in-method -> 인증 방법 설정하기 -> status enable로 설정 

 

(여기에서는 구글 로그인을 방법으로 택함) 

 

 

 

2) 사용법

-> 로그인 버튼 클릭시 팝업창이 떠서 로그인 할수 있도록 구현 할 것임 

 

1) 로그인 버튼 확인

(<Login onClick={handleAuth}>Login</Login>) :

 

 

로그인 버튼 클릭 시 handleAuth 함수 호출 

 

2) 모듈 사용

import { getAuth, GoogleAuthProvider,signInWithPopup } from 'firebase/auth';

 

{  } : 특정 모듈에서 원하는 요소만 가져오도록 함 

 

• getAuth는 Firebase 인증(Authentication)을 위한 인증 객체(Auth object)를 가져오는 함수입니다. 이 객체를 사용하여 사용자 인증과 관련된 다양한 기능을 수행할 수 있습니다.
• GoogleAuthProvider는 Firebase에서 제공하는 Google 인증 공급자(Google Authentication Provider) 객체입니다. 이 객체를 사용하여 Google 로그인 기능을 구현할 수 있습니다.
• signInWithPopup은 팝업 창을 통해 인증을 수행하는 함수입니다. 이 함수를 사용하여 팝업 창을 열고, 사용자가 로그인할 수 있도록 인증을 처리할 수 있습니다.

 

3) handleAuth 호출하여 팝업창 뜨도록 

 

 

const auth = getAuth();

const provider = new GoogleAuthProvider();

 

const handleAuth = () => {

signInWithPopup(auth.provider)

.then((result) => {})

.catch((error) => {

console.log(error);

})

}