개발자

next.js 에서 ssr의 경우 쿠키 접근은 어떻게 하나요?

2023년 01월 26일조회 1,899

1. next.js 에서 ssr의 경우 로컬스토리지는 접근이 불가능한데 쿠키도 접근이 불가능한가요? 2. 그리고 추가로 궁금한 부분은 accessToken을 로컬 스토리지로 저장하시는 분들은 ssr시에 인증을 어떻게 하시나요??

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 2

인기 답변

손정현님의 프로필 사진

안녕하세요. 1. next.js 서버 사이드에서는 들어오는 리퀘스트 객체에 접근이 가능합니다. 해당 객체로 쿠키 접근이 가능해요. - https://nextjs.org/docs/advanced-features/middleware#using-cookies - https://nextjs.org/docs/api-reference/next/server#nextrequest 2. accessToken이라고 말씀하시는 것으로 보아 OAuth token 이라고 예상하고 답변을 드리자면, accessToken을 주로 요청 헤더에 Authorization: Bearer {accessToken}으로 추가해서 서버로 보내줍니다. 클라이언트 (브라우저)에서 accessToken을 어디에 저장할지와 서버에서 어떻게 처리할지는 구현 방법에 따라 다를 것 같습니다. 좀 더 부연 설명을 하자면, 주로 클라이언트 쪽에서 서버로 요청을 보낼 때 헤더에 accessToken을 넣어주고 서버에서는 들어오는 요청의 헤더를 확인해서 인증/인가 하는 형태입니다. 모든 endpoint 마다 코드 복붙을 하면 안되니까 중간에 middleware 또는 interceptor 등을 사용해서 인증/인가 관련 로직을 처리합니다. 관련해서 커리어리 내에도 질문들이 많아서 한번 훑어보시면 도움이 되실 것 같습니다 :) - https://careerly.co.kr/qnas/1707 - https://careerly.co.kr/qnas/1539 - https://careerly.co.kr/qnas/1051 - https://careerly.co.kr/qnas/1533

커리어리 AI 봇님의 프로필 사진

1. SSR에서도 쿠키에 접근이 가능합니다. Next.js에서 제공하는 ' getServerSideProps '나 ' getInitialProps '를 사용하여 서버 측에서 쿠키에 접근할 수 있습니다. 예를 들어, ' req.cookies '를 통해 쿠키에 접근할 수 있습니다. 2. ' accessToken '을 로컬 스토리지에 저장하는 것은 보안상의 문제가 있습니다. 대신 쿠키나 서버 측 상태 관리 라이브러리 (예: Redux)를 사용하여 인증을 처리하는 것이 좋습니다. 쿠키를 사용하려면 ' getServerSideProps '나 ' getInitialProps '에서 쿠키를 읽고, 클라이언트 측에서는 서버에서 전달된 쿠키를 사용하여 요청을 보내면 됩니다. 예를 들어, Axios에서는 ' withCredentials ' 옵션을 true로 설정하여 쿠키를 전송할 수 있습니다.

커리어리 AI 봇의 답변을 평가해 주세요!

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!