2 段階の確認機能を構築する
ユーザーが支払いの詳細を入力した後に、オプションの確認ページを追加するか、検証を実行します。
ほとんどのシナリオに標準の実装をお勧めしますが、この実装では、決済フローにステップを 1 つ追加できます。こうすることで、買い手は、注文の詳細を確認できます。また、事業者は注文を確定する前に追加の検証を実行できるようになります。
支払い方法を有効にする
注意
この導入パスは、Automated Clearing Settlement System (ACSS) を使用する BLIK またはプレオーソリデビットに対応していません。
支払い方法の設定を表示して、サポートする支払い方法を有効にします。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 を作成するクライアント側
レガシーの実装で createPaymentMethod を使用する
レガシーの実装を使用している場合は、サーバーで支払いを確定するために stripe.
の情報を使用している場合があります。このガイドに従って Confirmation Tokens に移行することをお勧めしますが、以前のドキュメントを参照して 2 段階の確認機能を構築することもできます。
顧客が決済フォームを送信すると、stripe.createConfirmationToken が呼び出され ConfirmationToken を作成し、支払いの確定前に追加の検証ロジックまたはビジネスロジックをサーバーに送信します。payment_
フィールドを調べることで、追加のロジックを実行できます。
確認ページで支払いの詳細を表示する
この時点で、確認ページの表示に必要な情報をすべて入手しています。サーバーを呼び出して必要な情報を取得し、それに応じて確認ページを表示します。
PaymentIntent を作成するサーバー側
支払い確定の直前にカスタムビジネスロジックを実行する
支払いの確定ガイドのステップ 5 に移動して、支払い確定の直前にカスタムのビジネスロジックを実行します。または、以下のステップに従って既存のシステムをシンプルにします。ここでは、クライアント側で stripe.
を使用して、支払いの確定と次のアクションの処理の両方を行います。
顧客が決済フォームを送信したときに、PaymentIntent を使用して確認と決済のプロセスを円滑にします。サーバーで、amount
と currency
を有効にして PaymentIntent を作成します。最新バージョンの API では、機能がデフォルトで有効になっているため、automatic_
パラメーターの指定が任意になりました。支払い方法はダッシュボードで管理できます。Stripe は取引額、通貨、決済フローなどの要素に基づいて、適切な支払い方法が返されるように処理します。悪意のある顧客が金額を恣意的に選択できないようにするために、支払い金額はクライアント側ではなく、常に信頼できる環境であるサーバー側で指定してください。
PaymentIntent には、client secret が含まれています。 この値をクライアントに返し、Stripe.js がこれを使用して支払いプロセスを安全に完了できるようにします。
Stripe に支払いを送信するクライアント側
stripe.confirmPayment を使用して、Payment Element の詳細を使って支払いを完了します。
前のページで作成した ConfirmationToken の ID を含む confirmation_
を指定します。この ID には、Payment Element から収集された支払い情報が含まれます。
この関数に return_url を指定して、支払い完了後に Stripe がユーザーをリダイレクトする場所を示します。ユーザーは、最初に銀行の認証ページなどの中間サイトにリダイレクトされてから、return_
にリダイレクトされる場合があります。カード支払いでは、支払いが成功するとすぐに return_
にリダイレクトされます。
支払い完了後にカード支払いのリダイレクトを行わない場合は、redirect を if_
に設定できます。これにより、リダイレクトベースの決済手段で購入した顧客のみがリダイレクトされます。
顧客に Stripe を開示する
Stripe は顧客の Elements とのやり取りに関する情報を収集して、サービスを提供し、不正利用を防止し、サービスを向上します。これには、Cookie と IP アドレスを使用して、1 つの決済フローセッションで顧客に表示する Elements を特定することが含まれます。Stripe がこのような方法でデータを使用するために必要なすべての権利と同意について開示し、これらを取得することはお客様の責任です。詳細については、プライバシーセンターをご覧ください。