116. Understanding Authentication
npm create vue@latest
이번엔 어플리케이션에서 사용자 인증(Authentication) 작업을 어떻게 구현하는지에 대해 설명합니다.
우선, 프로젝트를 두 가지 어플리케이션으로 구분합니다.
프론트엔드 Vue 애플리케이션과 백엔드 서버인 Firebase 입니다.
Firebase는 비밀번호 해싱, 확인 이메일 전송, 사용자 데이터 저장 등의 작업을 담당합니다.
프론트엔드 개발자는 로그인 데이터를 서버로 보내고, 서버로부터 토큰을 받아 저장하는 간단한 역할을 합니다.
인증 과정은 다음과 같습니다.
Vue 애플리케이션이 사용자 로그인 데이터를 Firebase로 보내고, Firebase는 사용자를 인증합니다.
인증이 성공하면, Firebase는 토큰을 생성해 이를 응답으로 보냅니다.
이 토큰은 보안을 위해 필수적이며, 로컬 스토리지를 사용하여 저장됩니다.
사용자가 인증된 상태에서 데이터를 저장하거나 업데이트할 때마다 이 토큰을 Firebase로 보내 사용자를 검증합니다.
이러한 인증 방식은 상태 없는(stateless) 인증으로 알려져 있으며, 싱글 페이지 애플리케이션에 자주 사용됩니다.
이는 서버가 로그인 상태를 유지하지 않고, 각 요청마다 토큰을 통해 사용자를 확인하는 방식입니다.
마지막으로, Firebase의 보안 규칙을 수정하여, 읽기는 모두에게 허용하고 쓰기는 인증된 사용자에게만 허용하는 설정을 합니다.
상태 없는(stateless) 인증
Application (Vue) ----- Authentication Data (Login info) ----> Server (Firebase)
<---- Token --------------------------------
Local Storage
