# Payment Intents APIへの移行 > #### Payment Element 導入機能 > > Payment Element を導入して、サブスクリプション、税金、割引、配送、通貨換算を管理できます。詳細については、[決済ページの構築](https://docs.stripe.com/payments/quickstart-checkout-sessions.md) ガイドを参照してください。 既存のカードと Charges API 組み込みを移行する方法は以下のとおりです。 決済フローの移行は非常に煩雑な場合があります。Payment Intents API を段階的に採用し、それを Charges API と並行して使用するのが安全です。この目的のために、移行を次のステップに分割できます。 1. [API バージョンとクライアントライブラリを更新](https://docs.stripe.com/payments/payment-intents/migration.md#api-version)します。 1. 該当する場合は、[支払いプロパティから読み取るコードを移行](https://docs.stripe.com/payments/payment-intents/migration/charges.md)して、Charges API によって作成された支払いと Payment Intents API によって作成された支払いの間の読み取りパスの整合性を確保します。これにより、読み取り側のシステムが支払いの古いシステムと新しいシステムの両方で機能するようになります。 1. [ウェブサイト](https://docs.stripe.com/payments/payment-intents/migration.md#web)、[iOS](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=ios)、[Android](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=android) 上の既存の Charges API 連携機能を統合して、Payment Intents API を使用するようにします。 1. [Customer オブジェクトにカードを保存](https://docs.stripe.com/payments/payment-intents/migration.md#saved-cards)する組み込みを移行します。 1. [規制用テストカードでテスト](https://docs.stripe.com/testing.md#regulatory-cards)して、アップグレードしたシステムが認証を正しく処理することを確認します。 ## API バージョンとクライアントライブラリを更新する Payment Intents API はすべての API バージョンで機能しますが、[最新の API バージョンにアップグレード](https://docs.stripe.com/upgrades.md#how-can-i-upgrade-my-api)することをお勧めします。[2019-02-11](https://docs.stripe.com/upgrades.md#2019-02-11) より古い API バージョンを使用する場合は、コード例を確認しながら、以下の 2 つの変更点に注意します。 - `requires_source` は `requires_payment_method` に名前が変更されています - `requires_source_action` は `requires_action` に名前が変更されています また、Stripe の [SDK](https://docs.stripe.com/sdks.md) を使用している場合、Payment Intents API を使用するには、最新バージョンのライブラリにアップグレードする必要があります。 ## 1 回限りの支払いフローを移行 #### Elements Stripe.js および Elements を使用して構築された組み込みは、以下のステップで構成されます。 1. サーバ側で支払いを回収する Intent を登録する 1. クライアント側で支払いの詳細を収集する 1. 支払いの作成を開始する 1. サーバ側で顧客の注文のフルフィルメントを実行する ### ステップ 1: サーバ側で支払いを回収する Intent を登録する サーバーで [PaymentIntent を作成](https://docs.stripe.com/payments/payment-intents.md)し、[クライアント側でアクセスできる](https://docs.stripe.com/payments/payment-intents.md#passing-to-client)ようにします。 ### ステップ 2: クライアント側で支払いの詳細を収集する [confirmCardPayment](https://docs.stripe.com/js.md#stripe-confirm-card-payment) 関数を使用して、支払い情報を収集し、Stripe に直接送信します。 ### ステップ 3: 支払いの作成を開始する 既存の組み込みでは、最後のステップでトークン化された支払い情報を使用してサーバで支払いを作成していますが、このステップは不要になりました。これは、前のステップで呼び出される `confirmCardPayment` 関数が支払いの作成を開始するためです。 ### ステップ 4: 顧客の注文のフルフィルメントを実行 自動確認では、クライアント側での顧客のアクションに基づいて非同期で支払いが作成されるため、[Webhook を監視して](https://docs.stripe.com/payments/payment-intents/verifying-status.md)支払いが正常に完了するタイミングを判断する必要があります。顧客の支払いが成功した後に注文のフルフィルメントなどのステップを実行するには、Webhook のサポートを実装して、`payment_intent.succeeded` イベントを監視します。 ### Before 支払いが成功した場合は、フルフィルメントを実行します。 ### After `payment_intent.succeeded` Webhook に登録し、Webhook ハンドラでフルフィルメントを実行します。 移行が完了できました。次のセクションではテストカードを使用して、アップグレードした組み込みが 3D セキュア認証を処理することを確認します。 #### 支払いリクエストボタン Stripe.js の[支払いリクエストボタン](https://docs.stripe.com/stripe-js/elements/payment-request-button.md) は、従来の PaymentRequest システムで取得されたトークンを使用して PaymentIntent に関連付けることにより、Payment Intents API で動作します。 PaymentRequest を使用して構築された組み込みは、以下のステップで構成されます。 1. サーバ側で支払いを回収する Intent を登録する 1. クライアント側で支払いの詳細を収集する 1. 支払いの作成を開始する 1. サーバ側で顧客の注文のフルフィルメントを実行する また、[Express Checkout Element](https://docs.stripe.com/elements/express-checkout-element.md) を使用して、Apple Pay、Google Pay、Link、PayPal など、複数のワンクリック決済ボタンを顧客に提供することもできます。 ### ステップ 1: サーバ側で支払いを回収する Intent を登録する サーバーで [PaymentIntent を作成](https://docs.stripe.com/payments/payment-intents.md)し、[クライアント側でアクセスできる](https://docs.stripe.com/payments/payment-intents.md#passing-to-client)ようにします。 ### ステップ 2: クライアント側で支払いの詳細を収集する `PaymentRequest` オブジェクトの `token` イベントをリッスンします。これにより、支払いプロセスが完了するタイミングを示すために使用できるトークンとコールバック関数が提供されます。 Payment Intents API に対応するようにこのシステムを調整するには、[confirmCardPayment](https://docs.stripe.com/js.md#stripe-confirm-card-payment) 関数を使用して、トークンをサーバーに送信する代わりにトークン ID を渡します。`confirmCardPayment` 関数によって返された Promise が解決したら、完了コールバックを呼び出します。 ### ステップ 3: 支払いの作成を開始する 既存の組み込みでは、最後のステップでトークン化された支払い情報を使用してサーバで支払いを作成していますが、このステップは不要になりました。これは、前のステップで呼び出される `confirmCardPayment` 関数が支払いの作成を開始するためです。 ### ステップ 4: 顧客の注文のフルフィルメントを実行 自動確認では、クライアント側での顧客のアクションに基づいて非同期で支払いが作成されるため、[Webhook を監視して](https://docs.stripe.com/payments/payment-intents/verifying-status.md)支払いが正常に完了するタイミングを判断する必要があります。顧客の支払いが成功した後に注文のフルフィルメントなどのステップを実行するには、Webhook のサポートを実装して、`payment_intent.succeeded` イベントを監視します。 ### Before 支払いが成功した場合は、フルフィルメントを実行します。 ### After `payment_intent.succeeded` Webhook に登録し、Webhook ハンドラでフルフィルメントを実行します。 移行が完了できました。次のセクションではテストカードを使用して、アップグレードした組み込みが 3D セキュア認証を処理することを確認します。 #### レガシーの Checkout Checkout のレガシーバージョンを使用している場合は、[新しいバージョンの Checkout](https://docs.stripe.com/payments/checkout.md) にアップグレードします。これが Stripe で支払いを受け付ける最速の方法です。これにより、1 回限りの支払いとサブスクリプションを受け付けることができます。また、お客様のサーバー上で Stripe API を使用せずに Checkout を使用することもできます。[Checkout 移行ガイド](https://docs.stripe.com/payments/checkout/migration.md)に従って、既存のシステムを移行してください。 代わりに独自の決済フローを構築する場合は、[Elements](https://docs.stripe.com/payments/elements.md) に切り替えてください。Elements にアップグレードした場合は、[Elements 移行ガイド](https://docs.stripe.com/payments/payment-intents/migration.md#web) を使用して Payment Intents API 導入を構築できます。 #### Stripe.js v2 既存の Stripe.js v2 システムをアップグレードして Payment Intents API を使用するには、まず構築済みのシステムを更新し、Elements で支払い情報を収集するように設定します。Elements は、構築済みの UI コンポーネントを提供し、SAQ A レポートを使用して簡易な [PCI 準拠](https://docs.stripe.com/security/guide.md)を確保します。 Elements にアップグレードした後は、[Elements 移行ガイド](https://docs.stripe.com/payments/payment-intents/migration.md#web) を使用して Payment Intents API 導入を構築できます。 ## Customer オブジェクトにカードを保存する組み込みに移行する #### 決済フローでのカードの保存 決済フローでカード情報を収集する Payment Intents API 組み込みは、次のステップで構成されます。 1. サーバ側で支払いを回収する Intent を登録する 1. クライアント側で支払いの詳細を収集する 1. 支払いの作成を開始する 1. サーバ側で顧客の注文のフルフィルメントを実行する ### ステップ 1: サーバ側で支払いを回収する Intent を登録する サーバー上に [PaymentIntent を作成](https://docs.stripe.com/payments/payment-intents.md)します。ユーザーがアプリケーションの外部にいるときに請求することが多い場合は、[setup_future_usage](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-setup_future_usage) を `off_session` に設定し、アプリケーション内でユーザーに請求する予定の場合は `on_session` に設定します。オンセッションとオフセッションの両方の支払いにカードを使用する場合は、`off_session` を使用します。Customer ID と一緒に `setup_future_usage` パラメーターを指定すると、PaymentIntent が確定され、顧客の操作が完了した後、結果の PaymentMethod がその Customer に保存されます。次に、PaymentIntent に[クライアント側でアクセスできる](https://docs.stripe.com/payments/payment-intents.md#passing-to-client)ようにします。 ### ステップ 2: クライアント側で支払いの詳細を収集する [confirmCardPayment](https://docs.stripe.com/js.md#stripe-confirm-card-payment) 関数を使用して、支払い情報を収集し、Stripe に直接送信します。 最後に、支払い方法 (`paymentIntent.payment_method`) を顧客に関連付けます。 ### ステップ 3: 支払いの作成を開始する 既存の組み込みでは、最後のステップでトークン化された支払い情報を使用してサーバで支払いを作成していますが、このステップは不要になりました。これは、前のステップで呼び出される `confirmCardPayment` 関数が支払いの作成を開始するためです。 ### ステップ 4: 顧客の注文のフルフィルメントを実行 自動確認では、クライアント側での顧客のアクションに基づいて非同期で支払いが作成されるため、[Webhook を監視して](https://docs.stripe.com/payments/payment-intents/verifying-status.md)支払いが正常に完了するタイミングを判断する必要があります。顧客の支払いが成功した後に注文のフルフィルメントなどのステップを実行するには、Webhook のサポートを実装して、`payment_intent.succeeded` イベントを監視します。 ### Before 支払いが成功した場合は、フルフィルメントを実行します。 ### After `payment_intent.succeeded` Webhook に登録し、Webhook ハンドラでフルフィルメントを実行します。 移行が完了できました。次のセクションではテストカードを使用して、アップグレードした組み込みが 3D セキュア認証を処理することを確認します。 #### 決済フロー以外でのカードの保存 決済フロー外でカード詳細を保存する既存の導入にいくつか変更を加える必要があります。まず、サーバーで [SetupIntent](https://docs.stripe.com/api/setup_intents.md) を作成してください。SetupIntent は初回決済なしでカードを認証します。 SetupIntent の [client secret](https://docs.stripe.com/api/setup_intents/object.md#setup_intent_object-client_secret) をクライアントに渡し、顧客がカードの詳細情報を入力した後で、[createToken](https://docs.stripe.com/js.md#stripe-create-token) や [createSource](https://docs.stripe.com/js.md#stripe-create-source) ではなく、[confirmCardSetup](https://docs.stripe.com/js.md#stripe-confirm-card-setup) 関数を使用します。 規制による要求がある場合は、[confirmCardSetup](https://docs.stripe.com/js.md#stripe-confirm-card-setup) によってユーザーはカードの認証を求められます。 [confirmCardSetup](https://docs.stripe.com/js.md#stripe-confirm-card-setup) が成功すると、顧客に関連付けできる [PaymentMethod (支払い方法)](https://docs.stripe.com/api/payment_methods/object.md) が `setupIntent.payment_method` に追加されます。 その PaymentMethod の ID をサーバーに渡し、Customers API の代わりに Payment Methods API を使用して、Customer オブジェクトに[支払い方法を関連付け](https://docs.stripe.com/api/payment_methods/attach.md)ます。 #### 保存したカードでの支払い 以前に保存した決済手段で決済する場合、顧客の ID と、以前に保存したカード、Source、または PaymentMethod の ID の両方を指定する必要があります。以前は、ID が指定されていない場合、顧客のデフォルトソースが使用されていました。現在は、希望する決済手段を明示的に渡す必要があります。 顧客が*オフセッション* (A payment is described as off-session if it occurs without the direct involvement of the customer, using previously-collected payment information)の場合、オフセッション支払いのフラグを指定する必要があります。詳細については、[保存されたカードに請求する](https://docs.stripe.com/payments/save-and-reuse.md?platform=web&ui=elements#charge-saved-payment-method)をご覧ください。 ## 保存された支払い方法にアクセスする 顧客の以前に保存したカード、Source、PaymentMethod を表示するには、顧客オブジェクトの [sources](https://docs.stripe.com/api/customers/object.md#customer_object-sources) プロパティを参照する代わりに、[決済手段を一覧表示する](https://docs.stripe.com/api/payment_methods/list.md)方法を使用してください。これは、顧客に追加された新しい PaymentMethod が顧客オブジェクトの sources プロパティに重複しないため必須です。 ## 組み込みをテストする 組み込みを十分にテストして、追加の認証が必要なカードと不要なカードが正しく処理されることを確認することが重要です。将来の日付の有効期限と 3 桁のセキュリティコードとともに、これらのカード番号を[サンドボックス](https://docs.stripe.com/keys.md#test-live-modes)で使用し、認証が必要な場合と不要な場合について、組み込みを検証します。 | 番号 | 認証 | 説明 | | ---------------- | --------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | 4000002500003155 | 設定時または最初の取引時に必要 | このテストカードは、[1 回限りの支払い](https://docs.stripe.com/payments/accept-a-payment.md?platform=web)の認証が必要です。ただし、[Setup Intents API](https://docs.stripe.com/payments/save-and-reuse.md) を使用してこのカードを設定し、それ以降の支払いに保存したカードを使用する場合は、追加の認証の必要はありません。 | | 4000002760003184 | 必須 | このテストカードは、すべての取引で認証を必要とします。 | | 4000008260003178 | 必須 | このテストカードには認証が必要ですが、認証の成功後に、支払いは `insufficient_funds` エラーコードで拒否されます。 | | 4000000000003055 | 対応可能 | このテストクレジットカードは 3D セキュア 2 による認証をサポートしていますが、必須ではありません。このクレジットカードを使用した決済では、[サンドボックス Radar ルール](https://docs.stripe.com/payments/3d-secure/authentication-flow.md#three-ds-radar)で認証をリクエストしない限り、サンドボックスでの追加認証は必要ありません。 | これらのカードをアプリケーションまたは[支払いデモ](https://stripe-payments-demo.appspot.com)で使用して、さまざまな動作を確認します。 ## See also - [iOS の PaymentIntents](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=ios) - [Android の PaymentIntents](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=mobile&platform=android)