WooshPay JS SDK

ウェブサイトやアプリケーションにカスタムWooshPay決済フォームを組み込む方法をご紹介します。クライアント側とサーバー側のコードは、様々な支払い方法を使用して支払いを完了するための要素を備えたチェックアウトフォームを構築します。

支払いの流れ #

WooshPay SDKを使用するには、いくつかのステップがあります：

PaymentIntentの作成 #

PaymentIntentを作成するエンドポイントをサーバーに追加します。PaymentIntent は、顧客の支払いのライフサイクルを追跡し、支払いの失敗を記録して、顧客が一度だけ請求されるようにします。レスポンスでPaymentIntentのクライアントシークレット（この場合はPaymentIntent番号）を返し、クライアントでの支払いを完了させます。デフォルトでカードを有効にします。

wooshpay.jsをロードする #

wooshpay.jsを使用して、支払詳細があなたのサーバーにヒットすることなくWooshPayに直接送信されるようにすることで、PCIコンプライアンスを維持します。常にjs.wooshpay.comからwooshpay.jsをロードしてください。スクリプトをバンドルに含めたり、自分でホストしたりしないでください。

WooshPayエレメントの初期化 #

クライアントシークレットでWooshPay Elements UIライブラリを初期化します。Elementsは、支払い詳細を収集するために必要なUIコンポーネントを管理します。

クライアントへの支払いを完了する #

支払いを完了する
電話 confirmPayment()決済完了後に WooshPay がユーザーをリダイレクトする場所を示すために、PaymentElement と return_url を渡します。認証が必要な支払いの場合、WooshPayは、支払い方法に応じて、3Dセキュア認証用のモーダルを表示するか、顧客を認証ページにリダイレクトします。顧客が認証プロセスを完了すると、次のページにリダイレクトされます。 return_url.

エラー処理 #

即座にエラーが発生した場合（例えば、お客様のカードが拒否された場合）、wooshpay.jsはエラーを返します。そのエラーメッセージを顧客に表示し、再試行できるようにします。

支払い状況メッセージを表示する #

WooshPayが顧客を次のようにリダイレクトする。 return_urlその payment_intent_client_secret（ペイメント・インテント・クライアント・シークレットクエリパラメータはwooshpay.jsによって付加されます。これを使用してPaymentIntentを取得し、顧客に何を表示するかを決定します。