로그인한 사용자 정보가져오기

GY·2021년 10월 21일
1

[React] FIrebase + React

목록 보기
7/8

지난 포스팅을 이어서 firebase에서 제공하는 API로 사용자 정보를 유지하고 가져오려 한다.
사용할 수 있는 API는 크게 두 가지가 있어서, 차이점을 먼저 살펴보았다.

firebase 공식문서 살펴보기

현재 로그인한 사용자 가져오기

현재 사용자를 가져올 때 권장하는 방법은 다음과 같이 Auth 객체에 관찰자를 설정하는 것입니다.

웹 버전 8

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    var uid = user.uid;
    // ...
  } else {
    // User is signed out
    // ...
  }
});

관찰자를 사용하면 현재 사용자를 가져올 때 Auth 객체가 중간 단계(초기화 등)에 있지 않도록 할 수 있습니다. signInWithRedirect를 사용하면 onAuthStateChanged 관찰자는 getRedirectResult가 해결될 때까지 기다린 후에 트리거됩니다.

currentUser 속성을 사용하여 현재 로그인한 사용자를 가져올 수도 있습니다. 사용자가 로그인 상태가 아니라면 currentUser 값이 null입니다.

웹 버전 8

const user = firebase.auth().currentUser;

if (user) {
  // User is signed in, see docs for a list of available properties
  // https://firebase.google.com/docs/reference/js/firebase.User
  // ...
} else {
  // No user is signed in.
}

참고: Auth 객체의 초기화가 완료되지 않아 currentUser가 null일 수도 있습니다. 관찰자를 사용해 사용자의 로그인 상태를 추적하면 이런 상황을 처리할 필요가 없습니다.


정리하면, onAuthStateChanged를 사용하는 것이 더 나은 방법으로 보인다.

  • currentUser의 경우 Auth 객체의 초기화가 완료되지 않았을 때는 null로 값을 표시할 수 있다.

  • 하지만 onAuthStateChanged는 옵저버observer를 사용해 로그인 상태를 계속해서 추적하므로 이러한 부분을 보완할 수 있다.
    따라서 firebase에서도 권장하는 방법이다.

profile
Why?에서 시작해 How를 찾는 과정을 좋아합니다. 그 고민과 성장의 과정을 꾸준히 기록하고자 합니다.

0개의 댓글