[개발 상식] 쿠키의 HttpOnly, Secure, SameSite

HTTP 통신 중 사용자의 중요 정보를 담고 있는 쿠키를 보호하기 위한 방법으로, 여러 쿠키 플래그가 있습니다. 그 중에서도 HttpOnly, Secure, 그리고 SameSite 플래그에 대해 자세히 알아보고자 합니다.1. HttpOnly 플래그의 역할HttpOnly 플래그는 웹 어플리케이션에서 쿠키를 더 안전하게 관리할 수 있게 도와주는 설정입니다. 이 플래그가 설정된 쿠키는 클라이언트 사이드 스크립트, 즉 자바스크립트를 통한 접근이 차단됩니다.사용자가 웹 페이지에 접속할 때 서버에서 HttpOnly 플래그를 포함한 쿠키를 전송하면, 해당 쿠키는 브라우저에 저장되지만 document.cookie를 통한 직접적인 접근은 불가능해집니다.이러한 특성 덕분에, HttpOnly 쿠키는 Cross-Site Sc..

• format_list_bulleted 개발관련/개발 상식
• · 2024. 8. 15.
• textsms

Next.js 환경에서 cookie 설정하기

이번에 두 개 이상의 쿠키를 설정하는 방법을 몰라서 삽질을 했습니다. 다른 분들은 저처럼 삽질하지 마시라고 기록합니다!🤣 우선 기본적인 쿠키 설정 방법 예시입니다. ✨ 쿠키 설정 예시 import { serialize } from "cookie"; export async function POST(res: Response) { ... const ACCESS_SERIALRIZE = serialize("kakaoAccessToken", access_token, { httpOnly: true, secure: process.env.NODE_ENV === "production", sameSite: "strict", maxAge: expires_in, path: "/", }); return NextResponse.j..

• format_list_bulleted 개발관련/Next
• · 2024. 1. 9.
• textsms

[개발 상식] 쿠키, 세션, 토큰 어떤 차이일까?

이번 글은, 세션과 토큰의 차이점을 공부하며 정리한 글입니다. 세션과 토큰의 차이점을 알고, 적시에 사용할 수 있는 프로그래머가 되어 봅시다! 우선 세션과 토큰을 설명하기 앞서, 쿠키라는 개념을 짚고 넘어가 봅시다. 🍪쿠키(Cookie)? 쿠키는 브라우저에 데이터를 저장하는 것을 말합니다. 모든 브라우저는 ‘요청’ 을 보내고, ‘응답’을 받게 되는데요, 이 때 브라우저가 요청을 보낼 때 보내야할 데이터가 있다면 함께 보낼 수 있게 됩니다. 요청 시 쿠키 데이터를 함께 보낼 수 있게 되는 것이죠. 이렇게 쿠키에 저장된 값 덕분에 인증은 물론, 다양한 정보를 저장할 수 있어 페이지가 이동되거나, 브라우저를 닫고 열어도 데이터를 기억할 수 있다는 것이죠. 일반적으로 쿠키는 유효기간을 가지고 있으며, 개발 환경..

• format_list_bulleted 개발관련/개발 상식
• · 2023. 11. 23.
• textsms