프론트에서 결제 요청을 할 때 토스url로 직접 요청을 하게 하는 것과 백엔드 서버를 거쳐 요청을 하는 것 중 어떤 방식이 낫나요?
현재 개발자 센터에 나와있는 로직 그대로 구현을 해둔 상태인데요, 처음에 결제 인증을 할 때 프론트 코드에서 바로 토스 서버에 요청을 하게 되는데 인터넷에 어떤 분은 자신의 백엔드 서버를 거쳐서 전송을 하게 하더라구요.
제 개인적인 생각으론 요청 데이터를 검증해야하거나 별도의 비즈니스 로직이 있다면 백엔드를 거쳐 요청하게 하는 것이 맞겠지만, 요청에 대한 검증 처리를 토스에서 해주고 있고 별도의 비즈니스 로직은 필요하지 않다고 생각해서 프론트에서 직접 호출해도 괜찮다고 생각했습니다.
혹시 보통 프론트에서 외부 api요청은 어떤 형태로 구현을 많이 하나요??
10 Replies
⏳ 잠시만 기다려주세요! 곧 답변드리겠습니다
오류 문의일 경우 아래 정보를 미리 전달해주시면, 빠른 답변에 도움이 됩니다.
- 주문번호(orderId) :
- 문의 내용 :
(img를 함께 첨부해주시면 도움이됩니다)
* 계약관련 내용은 1544-7772로 문의주세요.
* 주말/공휴일에는 답변이 늦을 수 있어요.
대부분의 경우인 결제위젯을 통해 구현한다면
1. 서버로부터 orderId를 전달받아
2. 프론트에서 결제위젯을 오픈해
3. 사용자가 결제를 진행하고
4. 결제가 완료되면, Webhook 등으로 서버에서 검증합니다.
https://docs.tosspayments.com/guides/learn/payment-flow
다음 문서를 참고해주세요.
결제 흐름 이해하기 | 토스페이먼츠 개발자센터
카드 결제 과정의 세 가지 핵심 단계인 요청, 인증, 승인을 이해할 수 있어요.
문의주신 내용은 언어적인 특별성을 내포하고 있어서 즉답이 어렵네요.
제 경험상 확실한 내용 위주로 안내드리자면..
1. DB를 사용하셔야 합니다.
2. Frontend 와 Backend 의 영역을 어디까지 보시고 문의주신것인지 모르겠지만
토스페이먼츠 API를 사용하실때 개발자도구 등으로 apiKey 가 노출되지 않아야 합니다.
3. 결제의 검증은 가맹점이 하셔야 하는 영역과 PG에서 해야하는 영역이 다릅니다.
가맹점에서는 (인증시에 PG에 보냈던 금액 == PG에서 successUrl 로 리턴된 금액) 의 검증을 꼭 하셔야합니다.
생각하고 계신 Frontend 의 영역에서 위의 내용들이 문제 없다면 PG연동에 사용되도 큰 문제는 없습니다.
답변 감사합니다! 결제 프로세스 자체는 말씀해주신대로 구현을 하였는데, 프론트에서 외부 api를 직접 호출하는 것과 백엔드를 거쳐 호출하는 것 중 어느 것이 보편적인지가 궁금했습니다!
구체적으로 질문을 드렸어야 했는데 죄송합니다. 제가 궁금했던 부분은 처음에 프론트에서 결제 "인증"을 요청할떄 tossPayments.requestPayment 메서드를 사용하는데, 인터넷에서 어떤 분이 구현하신 코드를 보니까 이 데이터를 그대로 서버에 보내서 서버가 토스 api에게 호출하게 구현을 하셨더라구요. 그래서 원래 외부 api는 무조건 내 서버를 거치도록 구현하는 건가 하는 생각이 들어서 질문을 드렸습니다.
안내해주신 내용은 현재 구현에 반영이 되어있는 거 같습니다 자세한 설명 감사드립니다~
결제창에서의 인증은 고객이 UI를 접해야 하는 페이지에서 진행되기때문에 Frontend 에서 구현되는것이 일반적입니다. checkout 같은 특수한 기능으로 결제창 생성 URL을 따오는 방법도 있긴하지만... 대부분의 가맹점에서 프론트에서 결제창을 열면서 진행됩니다
그렇군요 알려주셔서 감사합니다!!!
좋은 서비스 만드시길 바랍니다. 🥰
넵!! 서비스 쉽게 만들 수 있도록 도움 주셔서 항상 감사합니다 ~~
❤️ 기술문의 경험이 어떠셨나요?!
간단히 코멘트 남겨주세요! 제품 발전에 큰 힘이 됩니다.