개

Toss payments 개발자 커뮤니티•3y ago•

77 replies

개발인생

브랜드페이 redirect 관련

안녕하세요. 토스 페이먼츠를 통해 브랜드페이 연동을 작업중인 개발자입니다.



https://docs.tosspayments.com/guides/payment-widget/integration-brandpay

해당 링크를 보면서 연동작업을 진행하고 있는데 몇가지 궁금한 점이 있어서 메일 드립니다.

현재 개발 환경은

Vue.js (version 2) – localhost:{포트}
Node.js (express) – 도메인 연결 O, https 호출
Payment-widget CDN 을 사용하여 결제위젯을 붙히는 중입니다.
개발 연동 테스트 상점 키를 가지고 테스트 중입니다.


궁금한 점은 이렇습니다.



paymentWidget.requestPatment() 최초 호출로 약관동의후, redirectUrl로 이동할 때

‘[GET] https://api.tosspayments.com/v1/brandpay/authorizations/customer-token?customerKey={고객Key}’ 호출 후 response status 200.
‘[POST] https://api.tosspayments.com/v1/brandpay/authorizations’ 로 호출 후 response status 200.
까지 정상으로 넘어오는것으로 보이나 ①, ② API를 무한으로 반복적으로 호출합니다.

이후 ① API에서 429 Too Many Requests 로 오류가 터지면서 결제창이 닫히게 됩니다.


해당 오류는 redirectUrl 을 실제 브랜드페이 UI가 제공되는 쇼핑몰 사이트의 URL과 동일하게 설정하니 무한으로 API를 호출하게 되고,

다른 방법으로는 redirectUrl 을 서버로 보내고자 하니 CORS 오류가 발생합니다. (현재 'Access-Control-Allow-Origin': ‘*’ 로 설정되어있어서 호출이 불가합니다)

혹시 redirectUrl로 지정된 페이지에서 따로 처리해줘야할 작업이 있을까요?
아니면 다른 해결방법이 있는지 궁금합니다

Ps. SDK 가 아닌 API 로 작업도 고려하였으나, 화면 구성을 커스텀할 필요가 없기에 시간적 낭비로 판단되어 SDK 로 해결방법을 제시해주시면 감사하겠습니다.

브랜드페이 연동하기 | 토스페이먼츠 개발자센터

일반 결제와 내 상점만의 자체 간편결제 시스템 브랜드페이를 한 번에 연동하고 싶다면 결제위젯에 브랜드페이를 추가하세요.