12. 리액트 [인증] - 인증의 기본 원리, 파이어 베이스 Auth편(1)

[인증의 기본 원리]

 

인증은 크게, 서버사이드 인증 방식과 토큰 인증 방식을 가진다.

 

1. 서버사이드 인증 방식

 

서버측에 사용자들의  정보를 저장하고, 유저가 정보를 제출하면, 확인하고, 그에 따라 응답한다.

정보는 데이터베이스나, 디스크 등에 저장되어 관리된다.

사용자로부터 로그인 요청이 오면, 인증이 되었을 경우,

클라이어언트의 상태를 계속 유지하게 된다. (인증 상태, 즉 사용자 정보 유지)

이 경우를 Sateful(상태성) 이라고 한다.

로그인 사용자가 늘어 날 경우 세션을 유지하는 메모리와,

CORS 오류 등으로 인해, 소규모에서만 적용이 가능하다.

 

또한, 백엔드와 프론트엔드 간의 커넥션이 긴밀하지 않을 경우, 언제든 해킹의 위험이 있다.

 

2. 토큰 기반의 인증 방식

 

서버측에 사용자들의 정보를 저장하고, 인증서를 발급하는 시스템이다.

 

유저는 서버측에, 정보를 제공해, 합당한 정보일 경우, 서버는 "토큰" 을 발급한다.

유저는 발급받은 토큰을 어딘가(쿠키, 로컬스토리지 등...)저장해, 요청을 보낼 때 제출한다.

 

서버는 더이상 사용자의 인증상태 를 유지해주지 않는다. 그럼으로 인해, 서버는 과부하를 줄일 수 있다.

이 경우를 Stateless(무상태성) 이라고 한다.

 

토큰은 오로지 서버만이 알 수 있으며, 자신이 생성한 토큰인지 확인 할 수 있다.

 

 

파이어베이스 AUTH 를 통해서, 인증을 진행해보자.

 

파이어베이스는 가짜 백엔드 서버로, 구성하기 너무나도 간편한 장점이 있다.

처음 Nodejs 로 백엔드 서버를 구성해보고,

Nextjs 로 프론트엔드와 백엔드가 같이 있는 풀스택 라이브러리를 사용해 보았다.

 

이번에는 React 로만 구성된, 프론트엔드를 만들 것이기 때문에, 가짜 백엔드서버를 파이어베이스로 선택했다.

 

[파이어베이스 AUTH]

https://firebase.google.com/docs/reference/rest/auth?hl=en&authuser=0#section-change-password 

Firebase 인증 REST API

 

FireBase Auth DOCS 에 보면, 우측에 원하는 기능을 누르면,

필요한 것이 무엇인지, 어디에 보내야하는지, 어떤 것을 보내야 하는지,

method 는 어떤 것으로 해야하는지 자세히 설명해준다.

 

파이어베이스의 Project 안쪽,  Authentication 탭에는, 

인증된 사용자들으 보는 공간이 있다.