오늘은 Firebase 의 인증(Authentication)을 사용하는 방법을 정리해 보겠습니다.

 

1. Email 인증 활성화 하기

먼저 왼쪽 메뉴에서 Authentication을 선택해 줍니다.

화면 한 가운데에서 Set up sign-in method버튼을 선택해 줍니다.

 

 

그럼 아래와 같은 화면을 만나게 되는데요.

이메일을 이용한 기본적인 회원가입과 로그인외에도,

facebook이나 google 혹은 twitter계정 등 다양한 계정을 이용한 인증 후 로그인 방법을 제공해 주고 있습니다.

카카오 계정이나 네이버계정을 이용하는 방법도 제공하였으면 좋았겠지만,

아쉽게도 제공해주지 않고 있고, 아마 앞으로도 어려울 것 같습니다.

 

 

이 중 이메일을 선택하도록 하겠습니다.

그리고 enable을 활성화 해 줍니다.

네, 이제 코드한줄 치지 않고 이메일/패스워드를 사용할 수 있는 준비가 되었습니다.

 

 

2. test유저 추가하기

2-1. UI에서 유저 추가하기

이제 위에서 한대로 활성화 시킨 이메일인증이 정상 동작하는지 확인해 보아야 할 텐데요.

test유저를 추가하는 방법은 아주 간단합니다.

아래와 같이, Users탭에서 Add User버튼을 클릭해 주면 됩니다.

 

 

email과 password를 입력해 주고, Add user버튼을 클릭해 줍니다.

 

 

2-2. 코드로 유저 추가하기

위에서 웹브라우즈를 이용한 콘솔에서 유저를 추가해 보았는데요.

NodeJS코드를 이용해서 추가해 보도록 하겠습니다.

NodeJS와 Express의 routing에 대해 알고있다고 가정하고 진행하겠습니다.

 

우선 Firebase환경 설정 값을 알고 있어야 하는데요.

Firebase의 홈화면에서 Add app을 클릭해 줍니다.

 

 

아래와 같이 나오는 화면에서, Select a platform에서 "</>"마크가 보이는 아이콘을 누르면 됩니다

여기서 볼 수 있는 값을 이용하면 되는데요.

 

 

저의 경우는, 아래와 같이 firebase를 initialize해 주었습니다.

이 값은 사용하는 Firebase내에서 사용하는 서비스에 따라 달라지겠지요.

 

 

id와 패스워드를 입력할 수 있는 화면을 만들고,

router에서 post메소드로 유저를 생성할 수 있습니다.

createUserWithEmailAndPassword 함수를 이용해서 유저를 생성할 수 있습니다.

 

 

코드로 유저를 추가한 경우 다음과 같은 에러가 나오기도 하는데요.

본인이 설정하지는 않았지만, Firebase의 인증기능 자체에서,

최소 6자의 문자가 되도록 설정되어 있습니다.

이에 따른 메시지를 유저가 알 수 있도록 후에 처리해 주어야 겠네요.

 

 

2-3. 추가한 유저 로그인 및 로그아웃 하기

이번에는 위에서 추가한 유저를 로그인 및 로그아웃 해 보도록 하겠습니다.

 

login페이지에 입력창과 폼을 만들구요.

login버튼을 클릭하면, post메소드를 이용해서 확인해 볼 수 있는데요.

아래와 같이 signInWithEmailAndPassword함수에 아이디와 패스워드를 넣어주기만 하면 되겠지요.

 

 

아래와 같은 코드를 이용해서 logout도 쉽게 해 볼 수 있습니다.

 

 

웹으로 간단히 구현해 보았지만,

Android나 iOS등에서도 구현 가능하며 문서도 잘 되어서 특별히 어렵지는 않은 것 같습니다.

API도 잘 제공되어 있어서, 특별히 Retrofit같은 라이브러리를 이용할 필요도 없구요.

특히나 Android와의 궁합은 더욱 좋은 것 같습니다.

 

3. Firebase Authentication이용 팁

3-1. Anonymous 로그인

로그인 방법을 정하면서, ID와 비밀번호 또는 Google이나 Facebook, Twitter의 계정을 선택할 수 있었는데요.

서비스에 따라서는 가장 하단의 익명(Anonymous)를 사용할 수도 있습니다.

 

이것은 유저의 정보를 제공해주지 않고 uid만 가지는 유저인데요.

로그인을 하지 않고도 서비스의 일부분을 이용할 수 있도록 할 때 필요합니다.

특히나 쇼핑몰 같은 경우, 장바구니에 넣은 다음 회원가입을 진행하는 경우도 있기 때문이지요.

 

이것을 사용할 때 주의할 점은,

익명(Anonymous)로 사용하던 유저가 가입을 결정해서 하게될 때,

새로운 유저를 생성하는 것이 아니라,

유저의 credential을 익명(Anonymous)이던 유저에 연결해 주도록 처리해 주어야 한다는 점 입니다.

 

그렇지 않으면, 익명(Anonymous)였을 때 사용했던 데이터들이 모두 사라지게 되기 때문이지요.

예를 들면, 가입 전에 장바구니에 넣었던 상품들의 데이터가 가입하면서 사라져 버리는 것 이지요.

 

Firebase는 이러한 문제를 Client들에서 linkWithCredential 메소드와 같은 메소드를 제공해줌으로써,

해결할 수 있는 방법을 제시해 주고 있어서 공식문서를 참조하여 이를 해결할 수 있습니다.

안드로이드의 경우 아래 링크를 사용할 수 있습니다.

>> www.firebase.google.com/docs/auth/android/anonymous-auth

 

3-2.

 

이상으로 Firebase Authentication(인증) 이용하는 방법에 대해서 간단하게 정리해 보았습니다.

더 좋은 방법이 있으면 이 글을 통해서 정리하도록 하겠습니다.

 

+ Recent posts