hotfix : 결제 신청시 customerKey 형식 오류#397
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Warning Rate limit exceeded
⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. 📒 Files selected for processing (4)
📝 Walkthrough워크스루토스 페이먼츠 결제 처리에서 고객 키 생성 로직을 개선하여 회원 ID 기반의 변경사항
예상 코드 리뷰 난이도🎯 2 (Simple) | ⏱️ ~10분 시
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/components/payment/paymentActionClient.tsx`:
- Around line 127-131: The customerKey validation currently throws an Error
inside the block guarded by customerKey length check (the customerKey validation
in paymentActionClient.tsx) which only gets console.error'd in the surrounding
catch (the catch near the existing payment assignment) leaving payment as null
and causing onPay (the onPay handler) to show a misleading "loading module"
message; change the flow so that validation failures do not throw a generic
Error but instead set a clear, user-facing error state (e.g., setPaymentError or
setPayment with an object describing validation error) and log a redacted
message (no raw customerKey) in the console; update the catch to rethrow or
propagate unexpected errors but handle validation-specific results so onPay can
display a specific "invalid customer ID" UI instead of the generic loading
message.
- Line 122: The lint failure is caused by an unnecessary escape inside the
character class of the regex /[^a-zA-Z0-9\-_=\.@]/g; update that regex to remove
the useless backslash before the dot (i.e., change \. to .) so the pattern
becomes /[^a-zA-Z0-9\-_=.@]/g wherever this regex literal is used (search for
the regex /[^a-zA-Z0-9\-_=\.@]/g in paymentActionClient.tsx and replace it).
| if (customerKey.length < 2 || customerKey.length > 50) { | ||
| throw new Error( | ||
| `customerKey가 유효하지 않습니다: ${customerKey} (길이: ${customerKey.length})`, | ||
| ); | ||
| } |
There was a problem hiding this comment.
customerKey 유효성 검사 실패 시 사용자에게 오해를 줄 수 있는 에러 처리
유효성 검사에서 throw new Error를 하더라도 해당 에러는 137번 줄의 catch 블록에서 console.error만 호출하고 payment 상태는 null로 유지됩니다. 이후 사용자가 결제하기 버튼을 클릭하면 onPay 내부(40번 줄)에서 "결제 모듈을 불러오는 중입니다. 잠시 후 다시 시도해주세요."라는 오해의 소지가 있는 메시지가 표시됩니다. 실제 원인(customerKey 형식 오류)과 전혀 다른 메시지를 보게 됩니다.
또한, 에러 메시지에 customerKey 값(= memberId 기반)이 그대로 포함되어 console.error로 출력될 수 있습니다.
🛡️ 수정 제안: 유효성 검사 실패 시 사용자에게 명확한 피드백 제공
// Toss 에서 2자이상 50자이하 문자열을 요구함
if (customerKey.length < 2 || customerKey.length > 50) {
+ console.error(`customerKey가 유효하지 않습니다 (길이: ${customerKey.length})`);
+ alert('결제 정보를 불러오는 데 문제가 발생했습니다. 고객센터에 문의해주세요.');
+ return;
- throw new Error(
- `customerKey가 유효하지 않습니다: ${customerKey} (길이: ${customerKey.length})`,
- );
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| if (customerKey.length < 2 || customerKey.length > 50) { | |
| throw new Error( | |
| `customerKey가 유효하지 않습니다: ${customerKey} (길이: ${customerKey.length})`, | |
| ); | |
| } | |
| if (customerKey.length < 2 || customerKey.length > 50) { | |
| console.error(`customerKey가 유효하지 않습니다 (길이: ${customerKey.length})`); | |
| alert('결제 정보를 불러오는 데 문제가 발생했습니다. 고객센터에 문의해주세요.'); | |
| return; | |
| } |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/payment/paymentActionClient.tsx` around lines 127 - 131, The
customerKey validation currently throws an Error inside the block guarded by
customerKey length check (the customerKey validation in paymentActionClient.tsx)
which only gets console.error'd in the surrounding catch (the catch near the
existing payment assignment) leaving payment as null and causing onPay (the
onPay handler) to show a misleading "loading module" message; change the flow so
that validation failures do not throw a generic Error but instead set a clear,
user-facing error state (e.g., setPaymentError or setPayment with an object
describing validation error) and log a redacted message (no raw customerKey) in
the console; update the catch to rethrow or propagate unexpected errors but
handle validation-specific results so onPay can display a specific "invalid
customer ID" UI instead of the generic loading message.
There was a problem hiding this comment.
Seems like the humans are having a chat. I'll hop back into my burrow for now. If you need me again, just tag @coderabbitai in a new comment, and I'll come hopping out!
1 participant
🌱 연관된 이슈
ZTO-190
☘️ 작업 내용
토스 결제 위젯 연동시 특수문자를 요구했는데 현재는 memberId 가 쌩으로 들어가서 오류남.
접두사 member- 붙여서 해결
🍀 참고사항
스크린샷 (선택)
Summary by CodeRabbit