로그인 2

세션과 쿠키를 이용한 인증 flow

프론트엔드 기초지식을 복습하는과정에서 현업에서 인턴 경험에서 로그인을 구현할 때 썼던 방법인 세션과 쿠키를 이용한 인증flow에 대해서 다시 복습할 기회가 되어 이렇게 정리를 해 보았다. 용어 정리 Session : 동일한 클라이언트(사용자)가 브라우저를 통해 웹 서버에 접속한 시점으로부터 브라우저를 종료하여 연결을 끝내는 시점 동안에 들어오는 일련의 Request를 하나의 상태로 보고, 그 상태를 일정하게 유지하여 클라이언트와 웹 서버가 연결된 상태를 말한다. Session ID : 서버는 Session에 대한 정보를 저장하고 클라이언트에게는 Sesssion을 구분할 수 있는 ID를 부여하는데 이것을 Session ID 라고 한다. Cookie : 클라이언트의 컴퓨터에 저장되는 데이터 파일로, Cook..

[React] 로그인 구현 + 비밀번호 보이게 기능 코드정리

기업협업중이다. 로그인 페이지부터 맡았는데, westagram 을 하고 난 뒤 그 후로는 카카오로그인을 맡았던 터라.. (?) 구현하는방법이 긴가민가..했다 그래서 기억기억 🤨 여차저차 생각해냈다! 기억난 김에 블로그에 정리해야지 🙋🏻‍♀️ 일단 처음에 적은 코드이고, 여기서는 백엔드와 해야하는 통신을 하는 로직은 주석처리해서 따로 여기에 적지는 않았다! //Login.jsx const Login = () => { const navigate = useNavigate(); const [inputId, setInputId] = useState(''); const [inputPw, setInputPw] = useState(''); const [showPw, setShowPw] = useState(false);..

728x90