2 段階の確認機能を構築する
ほとんどのシナリオに標準の実装をお勧めしますが、この実装では、決済フローにステップを 1 つ追加できます。こうすると、買い手は、注文の詳細を確認できます。また、社内では注文を確定する前に追加の検証を実行できるようになります。
決済手段を有効にする
注意
This integration path doesn’t support BLIK or pre-authorized debits that use the Automated Clearing Settlement System (ACSS).
決済手段の設定を表示して、サポートする決済手段を有効にします。PaymentIntent を作成するには、少なくとも 1 つは決済手段を有効にする必要があります。
Stripe のデフォルトでは、カード支払いとより多くの顧客にアプローチできるその他の一般的な決済手段が有効になっていますが、ビジネスと顧客に適した追加の決済手段を有効にすることをお勧めします。製品と決済手段のサポートについては、決済手段の導入オプションを、手数料については料金体系ページをご覧ください。
支払いの詳細を収集するクライアント側
Payment Element を使用してクライアントで支払い詳細を収集する準備ができました。Payment Element は事前構築された UI コンポーネントであり、多様な決済手段の支払い詳細の収集を容易にします。
Payment Element には、HTTPS 接続を介して支払い情報を Stripe に安全に送信する iframe が含まれています。一部の決済手段では、支払いを確定するために別のページにリダイレクトする必要があるため、Payment Element を別の iframe 内に配置しないでください。
貴社の構築済みのシステムを機能させるには、決済ページのアドレスの先頭を http://
ではなく https://
にする必要があります。HTTPS を使用しなくてもシステムをテストできますが、本番環境で決済を受け付ける準備が整ったら、必ず、HTTPS を有効にしてください。
Payment Element によって動的なフォームが表示され、顧客はここで決済手段を選択できます。このフォームでは、顧客が選択した決済手段で必要な決済の詳細のすべてが自動的に収集されます。
Elements
プロバイダーを作成する際に Appearance (デザイン) オブジェクト を options
に渡すことで、サイトのデザインに合わせて Payment Element をカスタマイズできます。
住所を収集
デフォルトでは、Payment Element は必要な請求先住所情報のみを収集します。(たとえば、デジタル商品およびサービスの税金を計算するなどの目的で) 顧客の詳細な請求先住所または配送先住所を収集するには、Address Element を使用します。
ConfirmationToken を作成するクライアント側
Use createPaymentMethod through a legacy implementation
If you’re using a legacy implementation, you might be using the information from stripe.createPaymentMethod
to finalize payments on the server. Although we encourage you to follow this guide to Migrate to Confirmation Tokens, you can still access our old documentation to Build a two-step confirmation experience.
When the customer submits your payment form, call stripe.createConfirmationToken
to create a ConfirmationToken to send to your server for additional validation or business logic before confirmation.
確認ページで支払いの詳細を表示する
この時点で、確認ページの表示に必要な情報をすべて入手しています。サーバーを呼び出して必要な情報を取得し、それに応じて確認ページを表示します。
PaymentIntent を作成するサーバー側
支払い確定の直前にカスタムビジネスロジックを実行する
支払いの確定ガイドのステップ 5 に移動して、支払い確定の直前にカスタムのビジネスロジックを実行します。または、以下のステップに従って既存のシステムをシンプルにします。ここでは、クライアント側で stripe.confirmPayment
を使用して、支払いの確定と次のアクションの処理の両方を行います。
顧客が決済フォームを送信したときに、PaymentIntent を使用して確認と決済のプロセスを円滑にします。サーバーで、amount
と currency
を有効にして PaymentIntent を作成します。最新バージョンの API では、機能がデフォルトで有効になっているため、automatic_payment_methods
パラメーターの指定が任意になりました。決済手段はダッシュボードで管理できます。Stripe は取引額、通貨、決済フローなどの要素に基づいて、適切な決済手段が返されるように処理します。悪意のある顧客が金額を恣意的に選択できないようにするために、支払い金額はクライアント側ではなく、常に信頼できる環境であるサーバー側で指定してください。
PaymentIntent には、client secret が含まれています。 この値をクライアントに返し、Stripe.js がこれを使用して支払いプロセスを安全に完了できるようにします。
Stripe に支払いを送信するクライアント側
stripe.confirmPayment を使用して、Payment Element からの詳細を使って支払いを完了します。
前のページで作成した ConfirmationToken の ID を含む confirmation_token
を指定します。この ID には、Payment Element から収集された支払い情報が含まれます。
支払いの完了後に Stripe がユーザーをリダイレクトする場所を指定するには、この関数に return_url を指定します。まず、ユーザーを銀行のオーソリページなどの中間サイトにリダイレクトしてから、return_url
にリダイレクトすることができます。カード支払いでは、支払いが正常に完了するとすぐに return_url
にリダイレクトします。
カード決済で支払いの完了後にリダイレクトを行わない場合は、redirect に if_required
を設定できます。これで、リダイレクトベースの決済手段で購入する顧客のみがリダイレクトされます。
Stripe について顧客に開示する
Stripe は顧客の Elements とのやり取りに関する情報を収集して、サービスを提供し、不正利用を防止し、サービスを向上します。これには、Cookie と IP アドレスを使用して、1 つの決済フローセッションで顧客に表示する Elements を特定することが含まれます。Stripe がこのような方法でデータを使用するために必要なすべての権利と同意について開示し、これらを取得することはお客様の責任です。詳細については、プライバシーセンターをご覧ください。