플러터, flutter) Firebase - SDK를 이용한 Auth, rest 말고!

rest api를 활용한 경우 서버에 우리의 api key를 함께 보내면서 로그인을 확인 받고,

거기서 토큰을 받아서 로그인이 인정되는 시간까지 하다가 뭐 또 연장하거나 등등의 절차를

우리가 직접 처리했다. 

 

그런데 sdk를 쓰면 이미 서버와 긴밀하게 연결이 되어 있기 때문에 토큰이런거 다 필요없고

그냥 더 간단하게 할 수 있다.

사실은 sdk가 뒤에서 다 작업을 해주는데 우리는 간편하게 몇줄의 코딩으로 처리할 수 있는 것이다.

 

또한 rest api의 경우에는 그냥 백엔드 서버랑 통신하는거라서 아무런 연결절차도 필요없지만

파이어베이스의 경우 이미 해둔 연결작업들이 있어서, 더 간편하게 할 수 있다.

 

이제 코드를 살펴보자

 

1. 먼저 Firebase auth 패키지를 import해야 한다

https://pub.dev/packages/firebase_auth#-installing-tab-

firebase_auth | Flutter Package

2. auth 인증절차를 밟자

Firebase sdk들은 instance가 다 존재한다 (싱글톤)

그래서 일단 그 instance를 하나의 레퍼런스에 저장하고

 

로그인이면 > signInwith~를 써주고,

가입이면 > createUser~를 써주면 된다.

 

그리고 future메소드이기 때문에 async/await를 써주었고,

결과값으로 AuthResult를 반환하기에 result 레퍼런스를 만들어서 받도록 해주었다.

 

매우간단하지?

 

async/await이니까 try-catch로 에러처리도 해주어야하고, 

result를 어떻게 활용할지 등 많은 절차를 추가해야하지만

일단 가입 및 로그인은 이렇게하면 된다!

 

이제 try-catch 설정을 해주자

로그인 시도하는 부분을 try로 묶고

 

에러 처리는 이렇게 2개로 나누었다.

PlatformException은 firebase에서 보내는 에러형태다. 그래서 따로 처리를 해주었다.

 - 메시지가 따로 전달되면 해당 메시지를 보여주고, 그렇지 않으면 일반적인 형태의 메시지를 정해서 보여준다.

 - 메시지를 보여주는 방법은 snackbar를 이용하는 것이다. 그런데 여기서 

Scaffold.of(ctx)를 이용하는데, 같은 클래스에서 처음으로 scaffold가 시작되기 때문에 해당 위젯의 context를 쓰면 에러가 날 수 밖에 없고(위젯트리 해당 위젯 위로 scaffold는 존재하지 않기 때문에) 그래서 하위 위젯의 context를 받아서 쓰기로 코드를 수정했다.

 

buildcontext를 따로 받는 것을 알 수 있다.

 

또한 추가적으로 꿀팁인데

여기보면 입력받은 값을 trim()해서 전달한다. 앞뒤 공백을 정리해줘서 어이없는 error를 방지할 수 있다.

 

 

3. userName을 database에 저장하기

 - 가입이 완료된 후에 해당 고객의 고유 id를 이용해서 username과 useremail을 저장해보자!

딱 가입이 됐을 때만 실행하게 해두었고,

users라는 collection에 (없으면 알아서 만들어짐) .document로 접근했는데 

이전에는 add라는 메소드를 썼는데 add는 document의 이름이 자동으로 만들어지지만,

document를 사용하면 이름을 정할 수 있다. 그래서 안에 우리는 가입해서 부여된 usder id를 document이름으로 설정했다.

그리고 setData는 document에 관한 data를 설정할 수 있고, 역시 map으로 형성되기에 map으로 넣어주었다.

가입에 성공했더니 이렇게 됐다. 완벽ㅎr다.