Toss Payments API 결제 결과를 UI에 표시하는 방법에 대한 질문
토스 페이먼츠 관련 문서에는 api 결과를 set state로 저장할 수 있다고 되어 있는데,
제가 디버그 통해서 확인해보면 set state로 저장할려고 하면 값이 왜 empty로 나올까요?
step1에서 api 결과 값은 제대로 나옵니다.
22 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
결제 인증 절차는 완료 하셨나요?
결제가 시작되고,
인증이 수행되고,
그 후에 승인 API 가 호출되어야 하는 순서인데
지금은 단순히 승인 API 만 호출하는 디버깅을 수행하신것 아닌가요?
2번째 스텝에서 캡쳐하신 스크린샷과 동일하게 값을 설정하신건가요?
API 응답에서 orderID 가 잘 보이는지도 확인해 보시기 바랍니다.
결제 인증되고 승인 결과창이 열렸을 때의 step1 이미지인데요
이때는 값이 들어있어요
그러면 2번째 스텝 setState 설정내용을 캡쳐해서 공유해주세요.
step2
set state입니다
이렇게 하시면 정상적으로 들어가야 할텐데요.
이 이전에 어떤 설정이 잘못되어있으면 이런 경우가 생길까요
아뇨 특별한건 없을겁니다. state 를 설정 못하는 별도 설정이 버블에 있는지는 모르겠어요.
제가 저녁에 일정이 있어서 차주 월요일에 이어서 봐드려도 괜찮을까요? 가능하면 테스트 할수 있도록 URL 과 필요한 계정있으면 알려주시기 바랍니다.
💡 정보 제출
민감 정보를 안전하게 제출해주세요
여기에 남겨주시면 확인해 보도록 하겠습니다.
아 넵 알겟습니다!
저도 디버그 모드 확인할 방법은 없을까요?
저희쪽에서는 정상 결제 난거라서 버블 디버그 모드를 봐야 할것 같습니다.
아니면 에디터 권한을 주시거나요.
답장이 늦어서 죄송합니다.
결론부터 말씀드리면 직접 해결했습니다. 초보적인 실수로 인해 발생된 것 같습니다 ㅠ_ㅜ
<착각한 부분>
1. widget-success페이지에서는 디버그가 안떠서 직접 url에 "&debug_mode=true" 이걸로 확인했다는 점
==> 이미 지난 결제인데 url에서 계속 트라이를 하니 empty로 나온 것 같습니다.
2. 결제 되고 나서 지금 보고 있는 DB 창에서 실시간 동기화가 된다고 착각한 점
==> 새로고침을 하니 변경이 적용되더라구요...
3. 결제 전과 후의 유니크 id를 동일하게 설정해야 하는데 애매한 값을 넣었다는 점
==> 기존에는 current's unique id를 unique로 썼었는데 이건 모든 컬럼이 동일한 값이라 구분이 안되었던 것 같습니다.
다른 질문 한가지만 드리면
결제 실패 테스트 중인데 토스페이먼츠에서 결제실패를 쉽게 할 수 있는 방법이 있을까요?
예전에 받았던 paymentkey 로 widget-success 에서 요청하시면 에러가 나갈겁니다.
결제창 부터 하지 마시고 그냥 widget-success를 호출하시면 될거에요.
widget-success 페이지의 워크플로우 "fail" 떴을 때 step인데요.
알려주신 지난 paymentkey를 넣어서 테스트 해보는 방법은,
결과가 payment_status 컬럼에는 failed, failure_reason 컬럼에는 에러 이유가 적혀야 되는거죠?
현재 단순히 widget-fail 페이지만 뜨고, DB에는 아무 값도 안들어가네요. 혹시 결제창부터 안해서 그런건가요?
step3 에서 's row body text 로 해주셔야 합니다. 실패시에는 버블쪽 버그인지 파싱이 정상적으로 안되더라구요.
row body text 를 저장해 보시면 실패코드와 사유가 JSON 방식으로 있을겁니다.
말씀해주신걸 테스트할려면 정상적인 결제창 결제가 이루어지고 실패를 해야 볼 수 있는 것 맞죠?
예전에 받았던 paymentkey 로 widget-success 에서 요청하시면 에러가 나갈겁니다. 결제창 부터 하지 마시고 그냥 widget-success를 호출하시면 될거에요.이렇게 설명 드렸습니다.
제가 만든 로직 설명을 드리면,
결제 전 고유 ID를 발급하여 데이터베이스에 저장합니다.
결제 완료 후 고유 ID를 확인하고 동일한 경우 해당 결제 건의 데이터를 업데이트합니다.
<문제 상황>
테스트를 위해 고유 ID 검색 코드를 없애고 payment_key를 일부러 다른 값으로 넣어 결제를 실패하게 했습니다.
그 결과, failure_reason과 fail 상태는 기록되었지만, 기존 row가 아닌 오래된 데이터 row에 기록되는 문제가 발생했습니다.
이런 테스트 방식으로 로직을 작성하는 게 맞는지, 또는 놓친 부분이 있는지 궁금합니다.
기존 row 를 어떻게 판단하시는지 모르겠는데, 기존 row 를 찾을수 있도록 해주셔야 합니다.
제가 알려드린건 단순히 저희쪽에서 에러를 받으실수 있게 한거에요.
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.