Firebase에서 사용자 관리

사용자 만들기

createUserWithEmailAndPassword 메서드를 호출하거나 Google Sign-In 또는 Facebook 로그인 과 같은 연합 ID 공급자를 사용하여 처음으로 사용자를 로그인하여 Firebase 프로젝트에서 새 사용자를 만듭니다.

Firebase 콘솔 의 인증 섹션, 사용자 페이지 또는 Admin SDK 를 사용하여 비밀번호로 인증된 새 사용자를 생성할 수도 있습니다.

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

현재 사용자를 얻는 데 권장되는 방법은 Auth 개체에 관찰자를 설정하는 것입니다.

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, onAuthStateChanged } from "firebase/auth";

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

Web version 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
    // ...
  }
});
index.js

관찰자를 사용하여 현재 사용자를 가져올 때 Auth 개체가 초기화와 같은 중간 상태에 있지 않은지 확인합니다. signInWithRedirect 를 사용하면 onAuthStateChanged 관찰자는 트리거하기 전에 getRedirectResult 해결될 때까지 기다립니다.

currentUser 속성을 사용하여 현재 로그인한 사용자를 가져올 수도 있습니다. 사용자가 로그인하지 않은 경우 currentUser 는 null입니다.

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth } from "firebase/auth";

const auth = getAuth();
const user = 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_current_user.js

Web version 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.
}
index.js

참고: auth 개체가 초기화를 완료하지 않았기 때문에 currentUser 도 null일 수 있습니다. 관찰자를 사용하여 사용자의 로그인 상태를 추적하는 경우 이 경우를 처리할 필요가 없습니다.

사용자 프로필 가져오기

사용자의 프로필 정보를 얻으려면 User 인스턴스의 속성을 사용하십시오. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth } from "firebase/auth";

const auth = getAuth();
const user = auth.currentUser;
if (user !== null) {
  // The user object has basic properties such as display name, email, etc.
  const displayName = user.displayName;
  const email = user.email;
  const photoURL = user.photoURL;
  const emailVerified = user.emailVerified;

  // The user's ID, unique to the Firebase project. Do NOT use
  // this value to authenticate with your backend server, if
  // you have one. Use User.getToken() instead.
  const uid = user.uid;
}
auth_get_user_profile.js

Web version 8

const user = firebase.auth().currentUser;
if (user !== null) {
  // The user object has basic properties such as display name, email, etc.
  const displayName = user.displayName;
  const email = user.email;
  const photoURL = user.photoURL;
  const emailVerified = user.emailVerified;

  // The user's ID, unique to the Firebase project. Do NOT use
  // this value to authenticate with your backend server, if
  // you have one. Use User.getIdToken() instead.
  const uid = user.uid;
}
manage.js

중요: displayName 및 photoURL 과 같이 잠재적으로 사용자에게 표시되는 UI 값을 설정하고 나중에 표시할 때는 주의하십시오. API는 잠재적인 XSS 유형 공격을 방지하기 위해 값을 필터링하지 않습니다.

사용자의 공급자별 프로필 정보 가져오기

사용자에 연결된 로그인 공급자로부터 프로필 정보를 검색하려면 providerData 속성을 사용합니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth } from "firebase/auth";

const auth = getAuth();
const user = auth.currentUser;

if (user !== null) {
  user.providerData.forEach((profile) => {
    console.log("Sign-in provider: " + profile.providerId);
    console.log("  Provider-specific UID: " + profile.uid);
    console.log("  Name: " + profile.displayName);
    console.log("  Email: " + profile.email);
    console.log("  Photo URL: " + profile.photoURL);
  });
}
auth_get_user_profile_provider.js

Web version 8

const user = firebase.auth().currentUser;

if (user !== null) {
  user.providerData.forEach((profile) => {
    console.log("Sign-in provider: " + profile.providerId);
    console.log("  Provider-specific UID: " + profile.uid);
    console.log("  Name: " + profile.displayName);
    console.log("  Email: " + profile.email);
    console.log("  Photo URL: " + profile.photoURL);
  });
}
manage.js

사용자 프로필 업데이트

updateProfile 메소드를 사용하여 사용자의 기본 프로필 정보(사용자의 표시 이름 및 프로필 사진 URL)를 업데이트할 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, updateProfile } from "firebase/auth";
const auth = getAuth();
updateProfile(auth.currentUser, {
  displayName: "Jane Q. User", photoURL: "https://example.com/jane-q-user/profile.jpg"
}).then(() => {
  // Profile updated!
  // ...
}).catch((error) => {
  // An error occurred
  // ...
});
auth_update_user_profile.js

Web version 8

const user = firebase.auth().currentUser;

user.updateProfile({
  displayName: "Jane Q. User",
  photoURL: "https://example.com/jane-q-user/profile.jpg"
}).then(() => {
  // Update successful
  // ...
}).catch((error) => {
  // An error occurred
  // ...
});  
manage.js

사용자의 이메일 주소 설정

updateEmail 메소드를 사용하여 사용자의 이메일 주소를 설정할 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, updateEmail } from "firebase/auth";
const auth = getAuth();
updateEmail(auth.currentUser, "[e-mail]").then(() => {
  // Email updated!
  // ...
}).catch((error) => {
  // An error occurred
  // ...
});
auth_update_user_email.js

Web version 8

const user = firebase.auth().currentUser;

user.updateEmail("[e-mail]").then(() => {
  // Update successful
  // ...
}).catch((error) => {
  // An error occurred
  // ...
});
manage.js

중요: 사용자의 이메일 주소를 설정하려면 사용자가 최근에 로그인해야 합니다. 사용자 재인증 을 참조하십시오.

사용자에게 확인 이메일 보내기

sendEmailVerification 메소드를 사용하여 사용자에게 주소 확인 이메일을 보낼 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, sendEmailVerification } from "firebase/auth";

const auth = getAuth();
sendEmailVerification(auth.currentUser)
  .then(() => {
    // Email verification sent!
    // ...
  });
auth_send_email_verification.js

Web version 8

firebase.auth().currentUser.sendEmailVerification()
  .then(() => {
    // Email verification sent!
    // ...
  });
email.js

이메일 템플릿 페이지에서 Firebase 콘솔 의 인증 섹션에서 사용되는 이메일 템플릿을 맞춤설정할 수 있습니다. Firebase 도움말 센터에서 이메일 템플릿 을 참조하세요.

확인 이메일을 보낼 때 앱으로 다시 리디렉션하기 위해 계속 URL 을 통해 상태를 전달할 수도 있습니다.

또한 이메일을 보내기 전에 인증 인스턴스의 언어 코드를 업데이트하여 확인 이메일을 현지화할 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth } from "firebase/auth";

const auth = getAuth();
auth.languageCode = 'it';
// To apply the default browser preference instead of explicitly setting it.
// firebase.auth().useDeviceLanguage();
auth_set_language_code.js

Web version 8

firebase.auth().languageCode = 'it';
// To apply the default browser preference instead of explicitly setting it.
// firebase.auth().useDeviceLanguage();
index.js

사용자 비밀번호 설정

updatePassword 메소드를 사용하여 사용자의 비밀번호를 설정할 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, updatePassword } from "firebase/auth";

const auth = getAuth();

const user = auth.currentUser;
const newPassword = getASecureRandomPassword();

updatePassword(user, newPassword).then(() => {
  // Update successful.
}).catch((error) => {
  // An error ocurred
  // ...
});
auth_update_password.js

Web version 8

const user = firebase.auth().currentUser;
const newPassword = getASecureRandomPassword();

user.updatePassword(newPassword).then(() => {
  // Update successful.
}).catch((error) => {
  // An error ocurred
  // ...
});
manage.js

중요: 사용자의 비밀번호를 설정하려면 사용자가 최근에 로그인해야 합니다. 사용자 재인증 을 참조하십시오.

비밀번호 재설정 이메일 보내기

sendPasswordResetEmail 메소드를 사용하여 사용자에게 비밀번호 재설정 이메일을 보낼 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, sendPasswordResetEmail } from "firebase/auth";

const auth = getAuth();
sendPasswordResetEmail(auth, email)
  .then(() => {
    // Password reset email sent!
    // ..
  })
  .catch((error) => {
    const errorCode = error.code;
    const errorMessage = error.message;
    // ..
  });
auth_send_password_reset.js

Web version 8

firebase.auth().sendPasswordResetEmail(email)
  .then(() => {
    // Password reset email sent!
    // ..
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });
email.js

이메일 템플릿 페이지에서 Firebase 콘솔 의 인증 섹션에서 사용되는 이메일 템플릿을 맞춤설정할 수 있습니다. Firebase 도움말 센터에서 이메일 템플릿 을 참조하세요.

비밀번호 재설정 이메일을 보낼 때 앱으로 다시 리디렉션하기 위해 계속 URL 을 통해 상태를 전달할 수도 있습니다.

또한 이메일을 보내기 전에 인증 인스턴스의 언어 코드를 업데이트하여 비밀번호 재설정 이메일을 현지화할 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth } from "firebase/auth";

const auth = getAuth();
auth.languageCode = 'it';
// To apply the default browser preference instead of explicitly setting it.
// firebase.auth().useDeviceLanguage();
auth_set_language_code.js

Web version 8

firebase.auth().languageCode = 'it';
// To apply the default browser preference instead of explicitly setting it.
// firebase.auth().useDeviceLanguage();
index.js

Firebase 콘솔에서 비밀번호 재설정 이메일을 보낼 수도 있습니다.

사용자 삭제

delete 방법으로 사용자 계정을 삭제할 수 있습니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, deleteUser } from "firebase/auth";

const auth = getAuth();
const user = auth.currentUser;

deleteUser(user).then(() => {
  // User deleted.
}).catch((error) => {
  // An error ocurred
  // ...
});
auth_delete_user.js

Web version 8

const user = firebase.auth().currentUser;

user.delete().then(() => {
  // User deleted.
}).catch((error) => {
  // An error ocurred
  // ...
});
manage.js

중요: 사용자를 삭제하려면 사용자가 최근에 로그인해야 합니다. 사용자 재인증 을 참조하십시오.

사용자 페이지에 있는 Firebase 콘솔 의 인증 섹션에서 사용자를 삭제할 수도 있습니다.

사용자 재인증

계정 삭제 , 기본 이메일 주소 설정 및 암호 변경 과 같은 일부 보안에 민감한 작업을 수행하려면 사용자가 최근에 로그인해야 합니다. 이러한 작업 중 하나를 수행하고 사용자가 너무 오래 전에 로그인한 경우 작업이 오류와 함께 실패합니다. 이 경우 사용자로부터 새 로그인 자격 증명을 받고 자격 증명을 reauthenticateWithCredential 에 전달하여 사용자를 다시 인증합니다. 예를 들어:

Web version 9

tree-shakeable Web v9 모듈식 SDK에 대해 자세히 알아보고 버전 8에서 업그레이드 하십시오.

import { getAuth, reauthenticateWithCredential } from "firebase/auth";

const auth = getAuth();
const user = auth.currentUser;

// TODO(you): prompt the user to re-provide their sign-in credentials
const credential = promptForCredentials();

reauthenticateWithCredential(user, credential).then(() => {
  // User re-authenticated.
}).catch((error) => {
  // An error ocurred
  // ...
});
auth_reauth_with_credential.js

Web version 8

const user = firebase.auth().currentUser;

// TODO(you): prompt the user to re-provide their sign-in credentials
const credential = promptForCredentials();

user.reauthenticateWithCredential(credential).then(() => {
  // User re-authenticated.
}).catch((error) => {
  // An error occurred
  // ...
});
manage.js

사용자 계정 가져오기

Firebase CLI의 auth:import 명령을 사용하여 파일에서 Firebase 프로젝트로 사용자 계정을 가져올 수 있습니다. 예를 들어:

firebase auth:import users.json --hash-algo=scrypt --rounds=8 --mem-cost=14