클라이언트
안녕하세요 현재 쇼핑몰 프로젝트로 결제 부분을 토스페이먼츠를 테스트로 연동시켜보려고합니다.
테스트 클라이언트키와 테스트 시크릿키로 토스페이먼츠를 연동하려고하는데요.
제가 생각한 흐름은
1. 프론트에서 주문 정보를 받고 결제하기 버튼을 눌렀을 때 스프링부트(백엔드)에의 결제 요청api로 orderId와 amount, orderName 등 정보를 DB에 한번 저장하고 응답 값을 넘겨준다.
2. 응답값(orderId, orderName, amount) 을 받은 프론트는 이값을가지고 토스페이먼츠의 결제 위젯을 렌더링한다.
3. 위젯에서 결제수단 선택(토스, 네이버, 신용/체크카드)를 선택하고 "위젯"의 결제하기 버튼을 누른다
4. (토스를 선택했다고 가정) 휴대폰 번호와 이름을 입력 or qr코드 인증을 한다.
5. 인증 성공시 successUrl로 이동한다. succesUrl로 이동할 때 paymentKey와 amount orderId를 같이 보내준다.
6. 3가지 값을 받은 프론트는 이 값을 spring 서버로 전달한다.
7. spring 은 3가지 값을 토스페이먼츠의 결제 승인 api로 보낸다.
8. 승인 성공 시 응답값을 준다.
이렇게 이해하고 있습니다.
여기서 궁금한점은
1. 샌드박스에서 테스트를 했을 떄 qr코드까지 인증을 완료했을 때 결제 승인 버튼이 나오던데 그 경우는 위의 과정 중에서 몇번에 해당할까요?
2. 테스트 클라이언트키를 통해서 객체를 초기화했을 때 테스트 시크릿 키와 테스트 클라이언트키는 한 계정에 나와있는 세트여야하겠죠?
3. 실제 서비스가 아니라 쇼핑몰 프로젝트에서 결제를 토스페이먼츠로 구현하는 것이 목표인데 실제로 토스페이먼츠를 도입한것처럼 사용 가능하겠죠?(ex) 가격을 주문 했을 떄의 가격으로 결제 가능, 가이드에서는 하드코딩되어있어서용)
4. 1번에서 orderId를 보낼 때 auto_increment로 생성된 값인 number타입이면 안되나요? api문서에 나와있는 6자이상 64자이하의문자열과 같은 형식을 지켜야할까요?)
5. 위에서 말한 결제 흐름이 맞을까요? (저희는 next.js(프론트)와 springboot(백엔드)입니다!
8 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
1. 샌드박스에서 테스트를 했을 떄 qr코드까지 인증을 완료했을 때 결제 승인 버튼이 어떻게 나오는지 캡쳐 부탁드립니다.
2. 네 맞습니다.
3. 네 맞습니다.
4. 6자리 이상으로 해주시기 바랍니다.
5. 네 이해하신 내용이 맞습니다.
qr코드 인증 후 나오는 페이지입니다!
결제 승인하기를 누른 후 3가지 값이 나옵니다.
그렇다면 orderId는 6자리인 String으로만 설정하면 될까요??

이건 인증 완료후 successURL 로 이동하지 못해서 보이는 화면입니다.
successURL 에서 뭔가 처리하는데 시간이 오래 걸리시는 건가요?
아니면 브라우저 콘솔에 에러가 있는지 확인부탁드립니다.
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.
저 결제 승인하기 버튼을 누르면
아래와 같은 사진이 나오는데 정상적으로 동작은 하는것 같습니다.
저 결제 승인하기의 과정은 2번째 사진을 기준으로 클라이언트에서 결제정보를 입력한 후 토스페이먼츠에서 응답값을 주면서 이루어지는 과정인것이죠?
- 정리하면 구매자가 qr코드 인증 후 succesURL paymentKey, amount, orderId로 값이 프론트로 온다.
- 결제 승인하기 버튼은 토스페이먼츠에서 내부적으로 동작한다.라고 생각되는데 맞나요?
+ 추가로 orderId는 6자이상인 String타입으로 보내기만 하면 되는 것인가요?


정리하면 구매자가 qr코드 인증 후 succesURL paymentKey, amount, orderId로 값이 프론트로 온다.
--> frontend 로 오는것맞습니다. query param 을 파싱해서 사용하시면 됩니다
결제 승인하기 버튼은 토스페이먼츠에서 내부적으로 동작한다.라고 생각되는데 맞나요?
--> 아닙니다. 승인요청은 가맹점에서 저희쪽으로 요청하셔야해요
추가로 orderId는 6자이상인 String타입으로 보내기만 하면 되는 것인가요?
--> 맞습니다. 추가적인 요건은 문서를 참고해주세요
