본문 바로가기

Frontend/TroubleShooting4

[TroubleShooting] 공백때문에 예약이 실패한다고? - 정규표현식 검증 불일치 이슈 해결기 📍 공백때문에 예약이 실패한다고? - 정규표현식 검증 불일치 이슈 해결기문제 상황특정 상품을 예약하기위해 해당 아이템을 선택하여 예약결제페이지에서 예약폼을 모두 채우고 예약하기 버튼을 누르면 예약생성요청에 실패하는 현상이 있었다. CS 로그를 확인해보니 공통적으로 LASTNAME 필드에 공백을 포함하면 예약에 실패한다는 의견이 많았다. DataDog 에러 로그를 살펴본 결과, 백엔드에서 LASTNAME 필드 검증 시 /[\\S]{1,128}/ 정규표현식에 통과하지 못하면서 요청이 거절되고 있었다.대안 분석공급사에 정규표현식 수정 요청장점: 사내 개발 리소스를 사용하지 않아도 된다. (버티컬 작업을 필요로하지 않음. )단점: 공급사에서 즉각 대응해줄 보장이 없고 “다른 판매처에도 영향이 간다”는 이유로 .. 2025. 10. 20.
[TroubleShooting] 예약 실패 → PDP 새로고침, 브라우저 간 메시지 통신으로 해결하기 📍 예약 실패 → PDP 새로고침, 브라우저 간 메시지 통신으로 해결하기문제 상황놀앱으로 예약생성 실패 알럿 클릭시 현재 페이지(예약결제페이지)가 닫히고 PDP페이지로 돌아오게 된다. 이때 PDP는 상품의 최신 정보(상품/옵션/아이템 판매 가능, 가격 등)를 다시 불러와야한다. 그렇지않으면 유저는 예약이 불가능했던 기존 스냅샷 정보를 계속 사용하게되어 좋지못한 UX를 경험하게 된다.대안 분석visibilityChange 이벤트 활용장점: 간단한 구현 (페이지가 다시 활성화 될 때 상품 정보 API 호출)단점: 예약 실패 상황과 무관하게 단순히 탭 전화만해도 API를 호출하게 된다. 이는 실시간으로 조회하는 API 특성상 불필요한 네트워크 비용이 발생하게 되어 서버/클라이언트 모두 부담이 크다.useEf.. 2025. 9. 28.
[TroubleShooting] 쿠폰 전체 받기 기능을 개선해보자! 📍 쿠폰 전체 받기 기능을 개선해보자!문제 상황상품 상세 페이지(PDP) 내 쿠폰받기 팝업에서 쿠폰 전체 받기 버튼 클릭시, 일부 유저가 쿠폰 다운로드 실패 알럿이 반복적으로 노출된다는 CS 접수되었다. 즉, 사용자는 전체 쿠폰 받기 버튼을 눌렀는데 실제로는 다운로드가 일부 실패하거나 에러 메시지만 보는 상황원인 분석DataDog에서 쿠폰 다운로드시 호출되는 베네핏 API 확인. 에러로그를 살펴보니 문제가 발생한 시점에 0.1초 간격으로 할인 쿠폰이 이미 발급되었습니다. 에러로그가 찍혀있는것을 발견함.(01:12:00.520, 01:12:00.521, 01:12:00.522, 01:12:00.525 ...) 그러나 프로그램을 사용하지 않는 이상 유저가 0.1초 간격으로 다운로드 버튼을 누를 수 없기때문.. 2025. 9. 15.
[TroubleShooting] 타임 아웃 처리로 Braze Feature flag 로딩 UX 개선하기 Braze Feature flag 로딩 타임 아웃 처리로 UX 개선하기문제 상황Braze 툴로 A/B 테스트를 구현하는데, braze initialize 후 getFeatureFlag() 호출 시점에서 featureFlag 데이터가 준비되지않아 undefined가 반환되는 이슈가 발생했다. 이로인해 FeatureFlagProvider 내부에서 children이 null로 반환되어 페이지 전체가 렌더링되지 않는 문제가 있었다.접근/해결 방식재시도 로직 추가: feature flag가 없을 경우 refreshFeatureFlags 메서드로 한번 더 호출타임아웃 설정: 네트워크 지연으로 인한 무한 대기를 방지하기 위해 최대 대기 시간 설정로딩 상태 관리: 사용자에게 로딩 중임을 알리고, 타임아웃 후에는 기존 .. 2025. 8. 20.