-
1-16 인증/인가 (쿠키)React 심화주차 2023. 5. 17. 21:31
로그인, 회원가입에 관련된 부분을 개발하는 방법
인증: 서비스를 이용하려는 유저가 등록된 회원인지 확인하는 절차
인가: 특정 리소스에 접근할 수 있는 권한이 있는지 확인하는 절차
http 프로토콜 통신의 특징 두 가지
무상태: 서버는 클라이언트의 상태를 기억하지 않는다. 따라서 각 요청마다 서버에서 요구하는 모든 상태 정보를 담아서 요청
상태값은 매 요청마다 클라이언트가 가지고 오기 때문에, 서버는 클라이언트의 상태를 별도로 기억할 필요없이 주문받은 대로 응답한다.
무상태라는 특성 덕분에 동일한 서버를 여러개로 확장시킬 수 있다.(Scale-Out)
비연결성: 서버와 클라이언트는 연결되어있지 않다. 서버 입장에서는 매번 새로운 요청이다.
비연결성으로 인해 최소한의 서버 자원으로 서버를 유지할 수 있게 해준다.
그러나 각 사용자별 요청이 잦은 서비스의 경우 이러한 비연결성은 오히려 비효율적일 수 있다.
쿠키
무상태와 비연결성이 있는 통신의 특성에도 불구하고 마치 서버가 클라이언트의 인증상태를 기억하는것처럼 구현할 수 있는 수단
브라우저에 저장되는 텍스트 파일이며, key-value형태로 저장
별도로 삭제처리하거나 유효기간이 만료되지 않는 이상 서버와 통신할 때 자동으로 주고 받게됨
서버에 특정 API요청을 했을 때 서버가 응답시 header안에 set-cookie 속성으로 쿠키정보를 담아주면 응답을 받은 브라우저 쿠키는 브라우저에 자동으로 저장
(저장된 쿠키정보는 개발자도구->애플리케이션->저장용량->쿠키에서 확인)
서버에 http요청 할 때마다 브라우저에 저장되어 있는 쿠키는 자동으로 서버에 보내진다.
단 동일한 Origin 또는 CORS를 허용하는 Origin에만 쿠키를 보낸다. ex. 유튜브 서버에서 받은 쿠키는 유튜브이용시에만 주고받기 가능쿠키는 별도의 검증방식을 갖지 않으면 보안에 취약할 수 있다.
'React 심화주차' 카테고리의 다른 글
1-17 인증/인가 (세션) (0) 2023.05.17 1-15 throttling & debouncing (2) (0) 2023.05.17 1-14 throttling&debouncing (1) (0) 2023.05.17 1-13 react query (2) (0) 2023.05.17 1-12 react query (1) (0) 2023.05.17