Multibanco による決算を受け付ける

Multibanco による支払い方法を受け付ける方法をご紹介します。

ウェブ

モバイル

注意

サーバー側での手動確定を使用する必要がある場合、またはお使いの実装で決済手段を別途表示する必要がある場合を除き、決済を受け付けるガイドに従うことをお勧めします。すでに Elements との連携が完了している場合は、Payment Element 移行ガイドをご覧ください。

Multibanco は、ポルトガルにおける店舗支払いに基づく決済手段です。ビジネスがヨーロッパまたはアメリカを拠点にしている場合、Payment Intents API を使用して、ポルトガルの顧客から Multibanco による決済を受け付けることができます。

取引を完了するために、顧客は Multibanco の法人番号と参照番号が記載された支払い票を受け取ります。顧客はこれらの店舗支払いの詳細を使用して、オンラインバンキングまたは ATM での決済フロー以外の支払いを行います。

顧客が Multibanco の取引詳細に応じて支払いを行う際、銀行振込が開始されるため、支払いの確定が数日遅れる場合があります。銀行振込は特に週末に遅延が発生することがあります。これは支払い確定の遅延の一因になります。

Stripe を設定する
サーバー側

まず、Stripe アカウントが必要です。今すぐご登録ください。

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

PaymentIntent を作成する
サーバー側

Stripe uses a PaymentIntent object to represent your intent to collect payment from a customer, tracking state changes from Multibanco voucher creation to payment completion.

Create a PaymentIntent on your server with an amount and the eur currency (Multibanco doesn’t support other currencies). If you already have an integration using the Payment Intents API, add multibanco to the list of payment method types for your PaymentIntent.

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
})();

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

クライアントで支払いフォームを作成し、必要な請求先情報を顧客から収集します。

フィールド	値
`email`	顧客のメールアドレス。

checkout.html
<form id="payment-form">
  <div class="form-row">
    <label for="email">
      Email
    </label>
    <input id="email" name="email" required />
  </div>

  <!-- Used to display form errors. -->
  <div id="error-message" role="alert"></div>

  <button id="submit-button">Pay with Multibanco</button>
</form>

Stripe への支払いの送信
クライアント側

When a customer clicks to pay with Multibanco, use Stripe.js to submit the payment to Stripe. Stripe.js is our foundational JavaScript library for building payment flows.

Stripe.js スクリプトを決済ページに含めるには、このスクリプトを HTML ファイルの head に追加します。

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

Create an instance of Stripe.js with the following JavaScript on your checkout page.

client.js
// Set your publishable key. Remember to switch to your live publishable key in production!
// See your keys here: https://dashboard.stripe.com/apikeys
const stripe = Stripe('pk_test_TYooMQauvdEDq54NiTphI7jx'
);

Submit the customer’s billing details by calling by calling stripe.confirmMultibancoPayment with the client secret of the PaymentIntent object that you created.

確定されると、Stripe はモーダルを自動的に開き、顧客に Multibanco の取引詳細を表示します。

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

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

  const result = await stripe.confirmMultibancoPayment(
    '{{PAYMENT_INTENT_CLIENT_SECRET}}',
    {
      payment_method: {
        billing_details: {
          email: document.getElementById('email').value,
        },
      },
    });
  // Stripe.js will open a modal to display the Multibanco voucher to your customer
  // This async function finishes when the customer closes the modal

  if (result.error) {
    // Display error to your customer
    const errorMsg = document.getElementById('error-message');
    errorMsg.innerText = result.error.message;
  }
});

注

stripe.confirmMultibancoPayment の完了には数秒かかる場合があります。この間、フォームが再送信されないように無効化し、スピナーのような待機中のインジケーターを表示します。エラーが発生した場合は、それを顧客に表示し、フォームを再度有効化し、待機中のインジケーターを非表示にします。

Multibanco の取引詳細が正常に作成されると、返された PaymentIntent の status プロパティの値が requires_action になります。ダッシュボードまたはオブジェクトのステータスプロパティを調べて、PaymentIntent のステータスを確認します。Multibanco の取引詳細が正常に作成されなかった場合は、返された error を調べて原因を特定します (メールアドレス形式が無効であるなど)。

Stripe sends a payment_intent.requires_action event when a Multibanco voucher is created successfully. If you need to send an email with the voucher’s payment instructions link, you can locate the hosted_voucher_url at payment_intent.next_action.multibanco_display_details.hosted_voucher_url.

オプションサーバーから Stripe に支払いを送信する
サーバー側

オプション顧客に Multibanco の詳細を表示する
クライアント側

オプションSend automated payment instruction emails

オプションCustomize voucher appearance

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

Multibanco is a delayed notification payment method. A customer pays for a Multibanco voucher outside your checkout flow through online banking or from an ATM.

After a Multibanco payment completes, Stripe sends a payment_intent.succeeded event. Use the Dashboard or build a webhook handler to receive these events and run actions, such as sending an order confirmation email to your customer, logging the sale in a database, or initiating a shipping workflow.

Learn about Multibanco expiration.

イベント	説明	次のステップ
`payment_intent.requires_action`	Multibanco の支払い票が正常に作成されました。	顧客が Multibanco で支払うのを待ちます。
`payment_intent.processing`	顧客は Multibanco で支払いができなくなりました。	開始された決済の成功または失敗の結果を待ちます。
`payment_intent.succeeded`	顧客は Multibanco で支払いました。	顧客が購入した商品またはサービスのフルフィルメントを行います。
`payment_intent.payment_failed`	顧客は Multibanco で支払いませんでした。	顧客にメールまたはプッシュ通知で連絡し、別の支払い方法をリクエストします。

イベントを受信して、ビジネスアクションを実行する

手動

Stripe ダッシュボードを使用して、Stripe のすべての支払いの確認、メールによる領収書の送信、入金処理、失敗した支払いの再試行を行います。

ダッシュボードでテスト支払いを確認します。

カスタムコード

Webhook ハンドラを構築してイベントをリッスンし、非同期型のカスタムの決済フローを作成します。Stripe CLI を使用して、ローカルで Webhook の実装のテストとデバッグを行います。

Learn how to build a custom webhook.

実装をテストする

In a sandbox, set payment_method.billing_details.email to the following values when you call stripe.confirmMultibancoPayment to test different scenarios.

メール	説明
`{any_prefix}@{any_domain}`	Simulates a Multibanco voucher that a customer pays. The `payment_intent.succeeded` webhook arrives after about 3 minutes. 例: jenny#example.com
`{any_prefix}succeed_immediately@{any_domain}`	Simulates a Multibanco voucher that a customer pays immediately. The `payment_intent.succeeded` webhook arrives within several seconds. 例: succeed_immediately@example.com
`{any_prefix}expire_immediately@{any_domain}`	Simulates a Multibanco voucher that expires immediately. The `payment_intent.payment_failed` webhook arrives within several seconds. 例: expire_immediately@example.com
`{any_prefix}expire_with_delay@{any_domain}`	Simulates a Multibanco voucher that expires before a customer pays. The `payment_intent.payment_failed` webhook arrives after about 3 minutes. 例: expire_with_delay@example.com
`{any_prefix}fill_never@{any_domain}`	Simulates a Multibanco voucher that never succeeds. The `payment_intent.payment_failed` webhook arrives after 11 days, which mimics behavior in live mode. Learn about Multibanco expiration. 例: fill_never@example.com

有効期限

Multibanco vouchers expire at the expires_at UNIX timestamp in next_action.multibanco_display_details.expires_at, which is 7 days after you create the voucher. Customers can’t pay a Multibanco voucher after it expires. After expiration, the PaymentIntent’s status transitions from requires_action to processing, and Stripe sends a payment_intent.processing event.

The PaymentIntent remains in the processing status for a maximum buffer period of 4 days to allow for potential completed payment notification delays caused by bank-transfer delays. If the Multibanco payment doesn’t complete within the buffer period, the PaymentIntent’s status transitions to requires_payment_method and Stripe sends a payment_intent.payment_failed event. If you receive the customer’s funds after the buffer period, Stripe automatically initiates a refund process for the mispaid amount.

キャンセル

You can cancel Multibanco vouchers using Cancel a PaymentIntent. After cancelation, Stripe sends a payment_intent.canceled event.

If a customer’s funds are received for a canceled Multibanco voucher, Stripe automatically initiates a refund process for the mispaid amount.

注

Canceling a pending payment invalidates the original voucher instructions. When you cancel a pending Multibanco payment, inform your customer.

When you successfully reconfirm a PaymentIntent in status requires_action, Stripe creates new voucher instructions and a new hosted_voucher_url. You must provide them to your customer.

返金

Learn about Multibanco refunds.

注