이커머스 파트너 가입 시 중복확인과 SMS 인증을 단일 동선으로 통합
목차
사업자 회원가입 플로우 정리
이커머스 파트너 회원가입 화면을 손봤음. 기존엔 휴대폰 입력란 옆에 "중복확인" 버튼이 따로 있고, 그 아래 SMS 인증 영역이 또 따로 있었음. 사용자가 두 번 눌러야 가입 진행이 됐고, 동선이 꼬여서 이탈이 많이 났음.
무엇이 문제였나
- 중복확인 통과 후 SMS 인증 단계로 안 넘어가는 케이스가 많았음
- 중복확인은 통과했는데 인증 안 한 채 제출하면 서버단에서 막혀서 폼이 통째로 리셋됨
- 고객센터 문의 대부분이 "가입 버튼이 안 눌려요" 였음
| 이전 | 이후 |
|---|---|
| 중복확인 + SMS 인증 2단계 | SMS 인증 1단계로 통합 |
| 중복확인 후 번호 바꾸면 재검증 안 됨 | 인증요청 시점에 중복+본인확인 동시 처리 |
| 가입 완료율 낮음 | 단일 동선으로 이탈 감소 기대 |
통합한 방식
인증요청 핸들러에서 휴대폰 중복 체크를 먼저 하고, 통과해야 SMS를 발송함. 인증코드 검증 성공 시점에만 가입 버튼이 활성화되도록 했음.
async function requestSms(phone) {
const dup = await checkPhoneDuplicate(phone);
if (dup.exists) {
showError('이미 가입된 번호임');
return;
}
await sendVerifyCode(phone);
startResendTimer(180);
}
서버단도 정리함. 인증 성공 토큰을 세션에 저장해두고, 회원가입 제출 시 토큰 일치 + TTL 미만일 때만 통과시킴. 토큰 없으면 422 반환.
작업하면서 배운 것
- 중복확인 버튼처럼 "안전장치 같아 보이는 UI"가 실제 데이터엔 노이즈만 남기는 경우가 많았음. 검증은 서버가 하고, 클라는 단일 동선으로 유도하는 게 맞음
- SMS 발송 비용도 줄었음. 이전엔 중복확인만 통과시킨 뒤 다른 번호로 발송하는 어뷰징 로그가 좀 있었는데, 통합 후엔 한 번호로만 발송 가능
- 폼 검증을 클라/서버 둘 다 손볼 땐 토큰 TTL을 짧게 잡는 게 안전했음. 길게 잡으면 세션 탈취 시 문제 생김
후속 과제
- 본인인증 결과 캐시 정책 조정. 현재 5분인데 이탈률 보고 늘리거나 줄일 예정
- 휴대폰 번호 포맷 정규화(하이픈 처리)를 서버단으로 옮기기
- 가입 전환율 A/B 측정 붙이기
다음
댓글 0
첫 댓글 달아줘.