이 글에서는 실제 동작하는 Passkey 데모 프로젝트를 통해 등록과 로그인을 어떻게 구현하는지 알아본다.전체 코드는 GitHub 레포지토리에서 확인할 수 있다.전체 플로우 한눈에 보기Passkey 등록 플로우1. 클라이언트: 사용자 이름 입력 후 "등록" 버튼 클릭 ↓2. 클라이언트 → 서버: POST /register/start { username } ↓3. 서버: challenge 생성 및 PublicKeyCredentialCreationOptions 반환 ↓4. 클라이언트: navigator.credentials.create() 호출 → 생체 인증 진행 ↓5. 브라우저: 공개키/비밀키 쌍 생성, 비밀키는 디바이스에 저장 ↓6. 클라이언트 → 서버: POST /register/fi..

1. 패스워드의 한계와 Passkey의 등장전통적인 패스워드 인증의 문제점우리는 수십 개의 온라인 서비스에 가입하며 그만큼의 비밀번호를 관리해야 한다. 간단한 비밀번호를 사용하면 보안 위험에 노출되고, 복잡한 비밀번호를 만들면 기억하기 어렵다. 결국 많은 사용자들이 동일한 비밀번호를 여러 사이트에서 재사용하거나, 메모장에 저장하는 위험한 행동을 한다.비밀번호 기반 인증의 근본적인 문제점은 다음과 같다:보안 취약점: 비밀번호는 입력 과정에서 도청되거나, 서버에 저장된 비밀번호 데이터가 유출될 수 있다. 크리덴셜 스터핑(Credential Stuffing) 공격으로 다양한 서비스에서 동시에 로그인을 시도하는 위협도 증가하고 있다. FIDO 얼라이언스의 연구에 따르면 피싱 공격으로 인한 계정 탈취 사건의 99..

현대 웹 애플리케이션에서 사용자 인증을 구현할 때 가장 널리 사용되는 방식 중 하나가 바로 JWT 기반의 Access Token과 Refresh Token을 활용한 세션 관리입니다. 이 글에서는 이 방식의 동작 원리와 함께, CSR과 SSR 환경에서 토큰을 어떻게 저장해야 하는지 살펴보겠습니다.Access Token과 Refresh Token이란?Access TokenAccess Token은 사용자가 인증된 후 API 요청 시 사용자의 신원을 증명하는 짧은 수명의 토큰입니다. 일반적으로 15분에서 1시간 정도의 짧은 유효기간을 가지며, 이 토큰만으로 보호된 리소스에 접근할 수 있습니다.특징:짧은 유효기간 (보통 15분~1시간)매 API 요청마다 전송탈취되더라도 피해를 최소화할 수 있는 구조Refresh ..

웹 개발하다 보면 한 번쯤 들어봤을 질문이죠. GET과 POST 중 뭐가 더 안전할까요? 결론부터 말하자면 POST가 더 안전합니다. 하지만 그 이유가 많은 분들이 생각하는 것과는 조금 다를 수 있어요.흔한 오해: "POST는 암호화되고 GET은 안 된다?"아닙니다. HTTPS를 사용하면 GET이든 POST든 전송 과정에서 모두 암호화됩니다. 반대로 HTTP를 사용하면 둘 다 평문으로 전송되어 중간에서 누구나 볼 수 있죠.HTTP 사용 시:- GET도 위험- POST도 위험- 공유기, ISP 등 중간 경로에서 모든 내용 확인 가능HTTPS 사용 시:- GET도 암호화- POST도 암호화- 중간 경로에서는 내용 확인 불가그렇다면 왜 POST가 더 안전하다고 하는 걸까요?POST가 더 안전한 진짜 이유1. ..

cloudflare 서비스를 사용해 웹개발 시 사용할 이미지를 업로드하고 사용하는 방법을 포스팅 사전준비우선 cloudflare에 회원가입을하고 대시보드로 들어간 후 메뉴에서 Image를 누른다.현시점 기준으로 무료 플랜을 선택하고 한 달에 5$를 지불하는 형식으로 선택하면 테스트용으로 충분한 사용량을 제공해 준다. 이미지 업로드 플로우 (Next Js, App router 기준)input으로 이미지 받아서 파일형식, 크기 등 체크(server action) cloudflare로 이미지 업로드 url, image id 요청해당 Form 제출 시 업로드 url로 이미지 업로드업로드 성공 후 Delivery URL + image id를 DB에 저장 1~2 해당 코드"use client"// file 업로드용..