WooshPay JS SDK

웹사이트나 애플리케이션에 사용자 지정 WooshPay 결제 양식을 임베드하는 방법을 알아보세요. 클라이언트 및 서버 측 코드는 다양한 결제 방법을 사용하여 결제를 완료할 수 있는 요소로 결제 양식을 작성합니다.

결제 흐름 #

wooshpay payment flow

WooshPay SDK를 사용하는 단계는 몇 가지가 있습니다:

결제 인텐트 생성 #

서버에 결제 인텐트를 생성하는 엔드포인트를 추가합니다. 결제 인텐트는 고객의 결제 라이프사이클을 추적하여 실패한 결제 시도를 추적하고 고객에게 한 번만 요금이 청구되도록 합니다. 클라이언트에서 결제를 완료하려면 결제 인텐트의 클라이언트 비밀(이 경우 결제 인텐트 번호)을 응답으로 반환합니다. 기본적으로 카드를 사용할 수 있도록 설정되어 있습니다.

wooshpay.js 로드 #

결제 세부 정보가 서버를 거치지 않고 WooshPay로 직접 전송되도록 하여 PCI 규정을 준수하려면 wooshpay.js를 사용하세요. 규정을 준수하려면 항상 js.wooshpay.com에서 wooshpay.js를 로드하세요. 스크립트를 번들에 포함하거나 직접 호스팅하지 마세요.

WooshPay 요소 초기화 #

클라이언트 비밀번호로 WooshPay Elements UI 라이브러리를 초기화합니다. Elements는 결제 세부 정보를 수집하는 데 필요한 UI 구성 요소를 관리합니다.

클라이언트에서 결제 완료 #

결제 완료
통화 확인 결제()를 전달하여 결제 완료 후 WooshPay가 사용자를 리디렉션할 위치를 나타내는 PaymentElement와 return_url을 함께 전달합니다. 인증이 필요한 결제의 경우 WooshPay는 결제 방법에 따라 3D 보안 인증을 위한 모달을 표시하거나 고객을 인증 페이지로 리디렉션합니다. 고객이 인증 프로세스를 완료하면 인증 페이지로 리디렉션됩니다. return_url.

오류 처리 #

즉각적인 오류(예: 고객의 카드가 거부됨)가 있는 경우 wooshpay.js는 오류를 반환합니다. 고객이 다시 시도할 수 있도록 해당 오류 메시지를 고객에게 표시하세요.

결제 상태 메시지 표시 #

WooshPay가 고객을 다음과 같이 리디렉션하면 return_url에서 결제_인텐트_클라이언트_비밀쿼리 매개 변수는 wooshpay.js에 의해 추가됩니다. 이를 사용하여 고객에게 표시할 내용을 결정하기 위해 결제 인텐트를 검색합니다.

데모 신청하기 #

여기에서 다운로드할 수 있습니다. JS SDK 데모 다운로드

어떤 느낌인가요?
Updated on 8월 9, 2023