支払いと送金別方式を作成する

プラットフォームアカウントで支払いを作成し、複数の連結アカウントに売上を送金できます。

「支払いと送金を別々」に作成して、1 つの支払いから複数の連結アカウントに資金を送金する場合や、支払い時に特定のユーザーが不明な場合に送金します。プラットフォームアカウントへの支払いは、連結アカウントへの送金から切り離されます。この支払いタイプでは、次のようになります。

プラットフォームのアカウントで支払いを作成し、売上を連結アカウントに送金します。この支払いは、ご自身のアカウントでの支払いとして表示され、さらに連結アカウントへの送金も表示されます (金額はご自身で決定します)。この金額はアカウント残高から引き落とされます。
複数の連結アカウントに売上を送金できます。
Stripe の手数料、返金、チャージバックは、お客様のアカウント残高から引き落とされます。

この支払いタイプは、レストランのデリバリープラットフォームである DoorDash のように、複数の当事者間で支払いを分割する必要があるマーケットプレイスに最適です。

Stripe は、以下の地域で支払いと送金別方式に対応しています。

アイルランド

アメリカ

イギリス

イタリア

エストニア

オーストラリア

オーストリア

オランダ

カナダ

キプロス

ギリシャ

クロアチア

シンガポール

スイス

スウェーデン

スペイン

スロバキア

スロベニア

チェコ共和国

デンマーク

ドイツ

ニュージーランド

ノルウェー

ハンガリー

フィンランド

ブラジル

フランス

ブルガリア

ベルギー

ポーランド

ポルトガル

マルタ

マレーシア

メキシコ

ラトビア

リトアニア

リヒテンシュタイン

ルーマニア

ルクセンブルグ

日本

多くのシナリオでは、プラットフォームと連結アカウントは同じ地域に所在している必要があります。許可されていない国境を越えて送金しようとすると、エラーが返されます。複数地域にわたる場合のサポートについては、海外送金をご覧ください。送金は、支払い、トップアップ、および手数料の許可されたユースケースと併用する場合にのみ使用する必要があります。

注

Express ダッシュボードにアクセスできる連結アカウント、またはダッシュボードにアクセスできない連結アカウントには、支払いと送金別方式を使用することをお勧めします。

ウェブ

iOS

Android

React Native

Stripe Elements を使用して、サイトに UI コンポーネントを埋め込むことでカスタムの決済システムを構築します。クライアント側とサーバー側のコードでさまざまな支払い方法を受け付ける決済フォームを構築します。この実装と、Stripe のその他の実装タイプとの比較をご覧ください。

リピートユーザーに対する Link のしくみを見るには、メールアドレス demo@stripe.com を入力してください。新規登録中の Link のしくみを見るには、他の任意のメールアドレスを入力し、フォームの残りの部分に入力してください。 Google Pay または Apple Pay ウォレットのいずれかが関連付けられた有効カードがある場合、このデモでは対応するウォレットのみが表示されます。

導入作業

コーディングが一部必須

接続方法のタイプ

カスタムの決済フローに UI コンポーネントを組み合わせる

UI のカスタマイズ

Appearance API による CSS レベルのカスタマイズ

まず、Stripe アカウントを登録します。

アプリケーションから Stripe API にアクセスするには、Stripe の公式ライブラリを使用します。

PaymentIntent を作成する
サーバー側

Stripe は PaymentIntent (支払いインテント) オブジェクトを使用して、顧客から支払いを回収する意図を示し、プロセス全体を通して請求の実施と支払い状態の変化を追跡します。

購入プロセスで顧客に表示される支払い方法は、PaymentIntent にも含まれています。Stripe によってダッシュボードの設定から支払い方法を自動的に取得することも、手動でリスト化することもできます。

貴社の構築済みのシステムで支払い方法の提供にコードベースのオプションを必要とする場合を除き、支払い方法を手動でリスト化しないでください。Stripe は通貨、支払い方法の制約、その他のパラメーターを評価し、対応可能な支払い方法のリストを決定します。購入完了率の上昇につながり、使用通貨と顧客の所在地に最も適した支払い方法を優先的に表示します。一方、優先度の低い支払い方法は、オーバーフローメニューに隠された状態になります。

サーバーで金額、通貨、後で売上の送金に関連付ける transfer_group の値を指定して PaymentIntent を作成します。最新バージョンの API では、Stripe はデフォルトで機能を有効にしているため、automatic_payment_methods パラメーターの指定は必要ありません。支払い方法はダッシュボードで管理できます。Stripe は、取引の金額、通貨、決済フローなどの要素に基づいて、適切な支払い方法が返されるように処理します。

client secret を取得する

PaymentIntent には、client secret が含まれています。これは、支払いプロセスを安全に完了するためにクライアント側で使用されます。client secret をクライアント側に渡す際は、いくつかの方法を使用できます。

ブラウザーの fetch 関数を使用して、サーバーのエンドポイントから client secret を取得します。この方法は、クライアント側が 1 ページのアプリケーションで、特に React などの最新のフロントエンドフレームワークで構築されている場合に最適です。client secret を処理するサーバーのエンドポイントを作成します。

その後、クライアント側で JavaScript を使用して client secret を取得します。

(async () => {
  const response = await fetch('/secret');
  const {client_secret: clientSecret} = await response.json();
  // Render the form using the clientSecret
})();

支払いの詳細を収集する
クライアント側

Payment Element を使用してクライアント側で支払い詳細を収集します。Payment Element は事前構築された UI コンポーネントであり、さまざまな決済手段の詳細の収集をシンプルにします。

Payment Element には、HTTPS 接続を介して支払い情報を Stripe に安全に送信する iframe が含まれています。一部の支払い方法では、支払いを確定するために別のページにリダイレクトする必要があるため、Payment Element を別の iframe 内に配置しないでください。

iframe の使用を選択し、Apple Pay または Google Pay を受け付ける場合、iframe の allow 属性が "payment *" に設定されている必要があります。

構築済みのシステムを機能させるには、決済ページのアドレスの先頭を http:// ではなく https:// にする必要があります。HTTPS を使用しなくてもシステムをテストできますが、本番環境で決済を受け付ける準備が整ったら、必ず、HTTPS を有効にしてください。

Stripe.js を設定する

Payment Element は Stripe.js の機能として自動的に使用できるようになります。決済ページに Stripe.js スクリプトを含めるには、HTML ファイルの head にスクリプトを追加します。常に js.stripe.com から Stripe.js を直接読み込むことにより、PCI 準拠が維持されます。スクリプトをバンドルに含めたり、そのコピーを自身でホストしたりしないでください。

checkout.html
<head>
  <title>Checkout</title>
  <script src="https://js.stripe.com/v3/"></script>
</head>

決済ページで以下の JavaScript を使用して、Stripe のインスタンスを作成します。

checkout.js
// Set your publishable key: remember to change this to your live publishable key in production
// See your keys here: https://dashboard.stripe.com/apikeys
const stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);

Payment Element を支払いページに追加する

Payment Element を決済ページに配置する場所が必要です。決済フォームで、一意の ID を持つ空の DOM ノード (コンテナー) を作成します。

checkout.html
<form id="payment-form">
  <div id="payment-element">
    <!-- Elements will create form elements here -->
  </div>
  <button id="submit">Submit</button>
  <div id="error-message">
    <!-- Display error message to your customers here -->
  </div>
</form>

前のフォームが読み込まれたら、Payment Element のインスタンスを作成して、それをコンテナーの DOM ノードにマウントします。Elements インスタンスを作成する際に、前のステップからの client secret を options に渡します。

client secret は支払いを完了できるため、慎重に取り扱う必要があります。記録したり、URL に埋め込んだり、当該の顧客以外に漏洩することがないようにしてください。

checkout.js
const options = {
  clientSecret: '{{CLIENT_SECRET}}',
  // Fully customizable with appearance API.
  appearance: {/*...*/},
};

// Set up Stripe.js and Elements to use in checkout form, passing the client secret obtained in a previous step
const elements = stripe.elements(options);

// Create and mount the Payment Element
const paymentElementOptions = { layout: 'accordion'};
const paymentElement = elements.create('payment', paymentElementOptions);
paymentElement.mount('#payment-element');

Payment Element によって動的なフォームが表示され、顧客はここで支払い方法を選択できます。支払い方法ごとに、フォームでは、必要な支払いの詳細のすべてを入力するように顧客に自動的に求めます。

デザインをカスタマイズする

Elements プロバイダーを作成する際に、Appearance (デザイン) オブジェクトを options に渡すことで、サイトのデザインに合わせて Payment Element をカスタマイズできます。

住所を収集

デフォルトでは、Payment Element は必要な請求先住所情報のみを収集します。(たとえば、デジタル商品およびサービスの税金を計算するなどの目的で) 顧客の詳細な請求先住所または配送先住所を収集するには、Address Element を使用します。

Apple Pay マーチャントトークンをリクエストする

Apple Pay の決済を受け付けるよう自社のシステムを構築している場合、マーチャントトークンを返すように Apple Pay インターフェイスを設定して、加盟店が開始する取引 (MIT) を有効にすることをお勧めします。Payment Element で関連するマーチャントトークンのタイプをリクエストします。

Stripe に支払いを送信する
クライアント側

Payment Element からの詳細を指定して stripe.confirmPayment を使用し、支払いを完了します。ユーザーが支払いを完了した後に Stripe がユーザーをリダイレクトする場所を指定するには、この関数に return_url を指定します。ユーザーはまず、銀行のオーソリページなどの中間サイトにリダイレクトされ、その後 return_url にリダイレクトされます。カード支払いでは、支払いが正常に完了するとすぐに return_url にリダイレクトします。

カード決済で支払いの完了後にリダイレクトを行わない場合は、redirect に if_required を設定できます。これで、リダイレクトベースの決済手段で購入する顧客のみがリダイレクトされます。

checkout.js
const form = document.getElementById('payment-form');

form.addEventListener('submit', async (event) => {
  event.preventDefault();

  const {error} = await stripe.confirmPayment({
    //`Elements` instance that was used to create the Payment Element
    elements,
    confirmParams: {
      return_url: 'https://example.com/order/123/complete',
    },
  });

  if (error) {
    // This point will only be reached if there is an immediate error when
    // confirming the payment. Show error to your customer (for example, payment
    // details incomplete)
    const messageContainer = document.querySelector('#error-message');
    messageContainer.textContent = error.message;
  } else {
    // Your customer will be redirected to your `return_url`. For some payment
    // methods like iDEAL, your customer will be redirected to an intermediate
    // site first to authorize the payment, then redirected to the `return_url`.
  }
});

return_url が、Web サイト上の支払いステータスを表示するページと対応していることを確認します。Stripe が顧客を return_url にリダイレクトするときは、以下の URL クエリーパラメーターが指定されます。

パラメーター	説明
`payment_intent`	`PaymentIntent` の一意の識別子。
`payment_intent_client_secret`	`PaymentIntent` オブジェクトの client secret。

注意

顧客のブラウザーセッションを追跡するツールを利用している場合、リファラー除外リストに stripe.com ドメインの追加が必要になる場合があります。リダイレクトを行うと、一部のツールでは新しいセッションが作成され、セッション全体の追跡ができなくなります。

クエリパラメーターのいずれか 1 つを使用して PaymentIntent を取得します。PaymentIntent のステータスを調べて、顧客に表示する内容を決定します。また、return_url を指定するときにカスタムのクエリパラメーターを追加することもできます。このパラメーターはリダイレクトプロセスの間維持されます。

status.js
// Initialize Stripe.js using your publishable key
const stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);

// Retrieve the "payment_intent_client_secret" query parameter appended to
// your return_url by Stripe.js
const clientSecret = new URLSearchParams(window.location.search).get(
  'payment_intent_client_secret'
);

// Retrieve the PaymentIntent
stripe.retrievePaymentIntent(clientSecret).then(({paymentIntent}) => {
  const message = document.querySelector('#message')

  // Inspect the PaymentIntent `status` to indicate the status of the payment
  // to your customer.
  //
  // Some payment methods will [immediately succeed or fail][0] upon
  // confirmation, while others will first enter a `processing` state.
  //
  // [0]: https://stripe.com/docs/payments/payment-methods#payment-notification
  switch (paymentIntent.status) {
    case 'succeeded':
      message.innerText = 'Success! Payment received.';
      break;

    case 'processing':
      message.innerText = "Payment processing. We'll update you when payment is received.";
      break;

    case 'requires_payment_method':
      message.innerText = 'Payment failed. Please try another payment method.';
      // Redirect your user back to your payment page to attempt collecting
      // payment again
      break;

    default:
      message.innerText = 'Something went wrong.';
      break;
  }
});

支払い後のイベントを処理する
サーバー側

支払いが完了すると、Stripe は payment_intent.succeeded イベントを送信します。ダッシュボードの Webhook ツールを使用するか Webhook のガイドに従ってこれらのイベントを受信し、顧客への注文確認メールの送信、データベースでの売上の記録、配送ワークフローの開始などのアクションを実行します。

クライアントからのコールバックを待つのではなく、これらのイベントをリッスンします。クライアントでは、コールバックが実行される前に顧客がブラウザーのウィンドウを閉じたり、アプリを終了する場合、また悪意を持つクライアントがレスポンスを不正操作する場合もあります。非同期型のイベントをリッスンするよう組み込みを設定すると、単一の組み込みで複数の異なるタイプの支払い方法を受け付けることができます。

Payment Element を使用して支払いを回収する場合は、payment_intent.succeeded イベントのほかにこれらのイベントを処理することをお勧めします。

イベント	説明	アクション
payment_intent.succeeded	顧客が正常に支払いを完了したときに送信されます。	顧客に注文の確定を送信し、顧客の注文のフルフィルメントを実行します。
payment_intent.processing	顧客が正常に支払いを開始したが、支払いがまだ完了していない場合に送信されます。このイベントは、多くの場合、顧客が口座引き落としを開始するときに送信されます。その後、`payment_intent.succeeded` イベント、また、失敗の場合は `payment_intent.payment_failed` イベントが送信されます。	顧客に注文確認メールを送信し、支払いが保留中であることを示します。デジタル商品では、支払いの完了を待たずに注文のフルフィルメントを行うことが必要になる場合があります。
payment_intent.payment_failed	顧客が支払いを試みたが、支払いに失敗する場合に送信されます。	支払いが `processing` から `payment_failed` に変わった場合は、顧客に再度支払いを試すように促します。

送金を作成する
サーバー側

サーバーで、Transfer (送金) を作成し、使用する transfer_group を指定することで、アカウントから連結アカウントに送金します。

送金額と支払い金額が一致している必要はありません。1 回の支払いを複数の送金に分割したり、複数の支払いを 1 回の送金に含めることができます。以下の例では、同じ transfer_group に関連付けられた追加の送金を作成しています。

送金オプション

transfer_group 文字列には任意の値を指定できますが、1 つのビジネスアクションを示す必要があります。また、関連する支払いや transfer_group の指定がない送金を作成することもできます。これはたとえば、プロバイダーに支払いをする必要があるが、それに関連付けられた顧客の支払いがない場合などです。

注

transfer_group は、関連付けられているオブジェクトのみを識別します。標準の機能は影響を受けません。関連する支払いの資金が利用可能になる前に送金されないようにするには、送金の source_transaction 属性を使用します。

By default, a transfer request fails when the amount exceeds the platform’s available account balance. Stripe doesn’t automatically retry failed transfer requests.

You can avoid failed transfer requests for transfers that are associated with charges. When you specify the associated charge as the transfer’s source_transaction, the transfer request automatically succeeds. However, we don’t execute the transfer until the funds from that charge are available in the platform account.

注

支払いと送金別方式を使用する場合は、入金スケジュールを計画する際に考慮が必要です。自動入金は、source_transaction が定義されていない送金に支障をきたす場合があります。

実装内容をテストする

カード番号	シナリオ	テスト方法
	カード支払いは成功し、認証は必要とされません。	クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。
	カード支払いには認証が必要です。	クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。
	カードは、`insufficient_funds` などの拒否コードで拒否されます。	クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。
	UnionPay カードは、13 ～ 19 桁の可変長です。	クレジットカード番号と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。

実装内容をテストするためのその他の情報については、テストをご覧ください。

オプションその他の支払い方法を有効にする

売上処理加盟店を指定する

売上処理加盟店は、アカウントに設定されたケイパビリティと支払いの作成方法によって決まります。売上処理加盟店は、支払いの作成に誰の情報を使用するかを決定します。これには、その支払いに使用される顧客のクレジットカードまたは銀行口座の明細に表示される明細書表記 (プラットフォームまたは連結アカウントのもの) が含まれます。

売上処理加盟店を指定することにより、誰に対して支払いを作成するかをより明確にすることができます。たとえば、一部のプラットフォームは最終顧客がプラットフォーム (オンデマンドプラットフォームなど) と直接やり取りすることを理由として、売上処理加盟店となることを希望します。ただし、これと異なり最終顧客と直接やり取りする連結アカウントが存在するプラットフォームもあります (E コマースプラットフォーム上のストアなど)。こうしたシナリオでは、連結アカウントを売上処理加盟店にするのが合理的です。

連結アカウントの ID に on_behalf_of パラメーターを設定して、そのアカウントを支払いの売上処理加盟店にすることができます。on_behalf_of を使用すると、以下のようになります。

連結アカウントの国と売上処理通貨を使用して、支払いが売上として処理されます。
連結アカウントの国の手数料体系が使用されます。
連結アカウントの明細書表記が顧客のクレジットカード明細書に表示されます。
連結アカウントがプラットフォームと異なる国に所在する場合、連結アカウントの住所と電話番号が顧客のクレジットカード明細書に表示されます。
入金前の保留中の残高が保持される日数は、連結アカウントの delay_days 設定によって異なります。

on_behalf_of が省略された場合、プラットフォームが取引に関する金銭的責任を負います。

注意

on_behalf_of パラメーターは、card_payments などの支払いケイパビリティを持つ連結アカウントのみで利用できます。受取人利用規約が適用されているアカウントは、card_payments やその他の支払いケイパビリティをリクエストできません。

手数料を回収する

支払いと送金別方式を使用する場合、プラットフォームは、宛先アカウントに送金する金額を減らすことで、支払いの手数料を回収できます。レストランと運転手への支払いを行うレストランのデリバリーサービス取引の例を考えてください。

顧客は 100 USD を支払います。
Stripe は、3.20 USD の手数料を回収して、残りの 96.80 USD をプラットフォームアカウントの保留中の残高に加算します。
プラットフォームは、レストランの連結アカウントに 70 USD を送金して、運転手の連結アカウントに 20 USD を送金します。
6.80 USD のプラットフォーム手数料がプラットフォームアカウントに残されます。

支払いがプラットフォームアカウントの手数料と連結アカウントへの送金に分割される仕組み

Connect を使用した複数通貨での支払いの処理について、詳細は複数通貨の処理をご覧ください。

送金可能な金額

デフォルトの動作では、プラットフォームアカウントの利用可能な残高から売上を送金します。利用可能な残高を超えて送金しようとすると、エラーが発生します。この問題を回避するには、送金を作成するときに、source_transaction パラメーターとして支払い ID を指定して、その送金を既存の支払いに関連付けます。source_transaction を指定すると、関連する支払いがまだ売上処理されていない場合でも、利用可能な残高に関係なく、送金リクエストは成功を返します。ただし、関連付けられた支払いによる売上をプラットフォームアカウントからの送金に利用できるようになるまで、売上は入金先アカウントで利用できません。

注

プラットフォームの残高不足のために送金が失敗した場合、資金を追加しても、失敗したアクションが自動的に再試行されることはありません。資金を追加した後に、失敗した送金または入金を繰り返す必要があります。

元の支払いに transfer_group 値が指定されている場合、Stripe は、同じ値を送金の transfer_group に割り当てます。そうでない場合は、Stripe は、group_ と関連する PaymentIntent ID の形式 (例: group_pi_2NHDDD589O8KAxCG0179Du2s) で文字列を生成します。この文字列は、支払いと送金の両方の transfer_groupとして割り当てられます。

注

送金の作成時に source_transaction を指定する必要があります。この属性は後で更新できません。

PaymentIntent から支払い ID を取得できます。

PaymentIntent の latest_charge 属性を取得します。この属性は、PaymentIntent に関連付けられた最新の支払いの ID です。
リクエストで payment_intent を指定して支払いのリストをリクエストします。この方法では、PaymentIntent に関連付けられているすべての支払いの詳細なデータが返されます。

このパラメータを使用するときは、以下のことを確認してください。

送金金額は、元の支払いの金額を超えることはできません
送金の合計が元の支払いを超えない限り、同じ source_transaction で複数の送金を作成できます
送金により、関連する支払いが保留状態になります。支払いからの売上が N 日後に利用可能になるとすると、送金先 Stripe アカウントが送金から受け取る支払いも N 日後に利用可能になります。
Stripe は自動的に transfer_group を作成します
支払いに関連付けられている取引残高の通貨は、送金の通貨と同じである必要があります

ACH などの非同期の支払い方法が、後続の送金リクエストの実行後に失敗する場合があります。これらの支払いでは、source_transaction を使用しないでください。代わりに、charge.succeeded イベントがトリガーされるまで待ち、その後で売上を送金するようにしてください。これらの支払いで source_transaction を使用する必要がある場合は、支払いの失敗を管理する機能を実装する必要があります。

source_transaction として使用される支払いが失敗すると、プラットフォームのアカウント残高からの売上が連結アカウントに送金され、支払いを補填します。これらの売上を回収するには、失敗した source_transaction に関連する送金を差戻しします。

返金する

プラットフォームで作成された支払いは、シークレットキーを使用して返金できます。ただし、支払いの返金は関連するどの送金にも影響しません。以降の送金額の減額、または送金の差戻しによって返金される金額の調整はプラットフォームの責任で行います。

送金を差戻す

Connect は、連結アカウントに対して行われた送金の全額または一部金額 (amount 値で指定) を差戻す機能をサポートしています。送金の差戻しは、支払いに関連する返金や不審請求の申請、または送金のミスの修正のみに使用します。

送金差戻しにより、プラットフォームの利用可能残高に指定された金額 (または全額) が戻されて追加され、それに応じて連結アカウントの利用可能残高が減少します。連結アカウントの利用可能残高が差戻し額よりも大きい場合、または連結されたリザーブが有効になっている場合のみ、送金を差戻すことができます。

送金差戻しに通貨の換算が必要な場合、換算後に差戻し額で残高がゼロになるとエラーが返されます。

連結アカウントの返金を無効にしても、送金の差戻し処理機能はブロックされません。