コンテンツにスキップ
アカウント作成/サインイン
Stripe ドキュメントのロゴ
/
アカウントを作成サインイン
概要構築済みのシステムをアップグレード
オンライン決済
概要ユースケースを見つけるManaged Payments を使用する
対面決済
決済手段
決済シナリオ
決済以外の機能

注

このページはまだ日本語ではご利用いただけません。より多くの言語で文書が閲覧できるように現在取り組んでいます。準備が整い次第、翻訳版を提供いたしますので、もう少しお待ちください。

今後の支払いに備え、オーストラリアの BECS Direct Debit の詳細を保存する

今後のオーストラリアの BECS Direct Debit 支払いに備え、Setup Intents API を使用して決済手段の情報を保存します。

Stripe の事前構築された UI コンポーネントである Stripe Elements を使用して、機密データを扱うことなく銀行口座の詳細を安全に収集できる決済フォームを作成します。Setup Intents API を使用して、事前に BECS ダイレクトデビットの決済手段の詳細を収集し、後から最終的な金額や支払い日を決定できます。この機能は以下の目的に利用できます。

Stripe を設定する
サーバー側

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

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

Command Line
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
# Available as a gem
sudo gem install stripe
Gemfile
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
# If you use bundler, you can add this line to your Gemfile
gem 'stripe'

Customer を作成または取得する
サーバー側

以降の支払いに BECS ダイレクトデビットの口座を再利用するには、その口座を Customer に関連付ける必要があります。

お客様のビジネスで顧客がアカウントを作成する際、Customer オブジェクトを作成します。この Customer オブジェクトの ID を、顧客を表す独自の内部表記と関連付けることで、保存されている支払い方法の詳細を後で取得して使用することができます。

新しい Customer を作成するか、または既存の Customer を取得して、この支払いに関連付けます。サーバに以下のコードを含め、新しい Customer を作成します。

Command Line
cURL
Stripe CLI
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
curl -X POST https://api.stripe.com/v1/customers \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:"

SetupIntent を作成する
サーバー側

SetupIntent (支払い方法設定インテント) は、今後の支払いのために顧客の決済手段をセットアップするお客様の意図を表すオブジェクトです。SetupIntent は、この設定プロセスのステップを追跡します。BECS ダイレクトデビットの場合、このステップには顧客からの同意書の収集と、ライフサイクル全体にわたる同意書の有効性の追跡が含まれます。

payment_method_types を au_becs_debit に設定してサーバーに SetupIntent (支払い方法設定インテント) を作成し、Customer の id を指定します。

Command Line
curl
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
curl https://api.stripe.com/v1/setup_intents \
  -u 
sk_test_BQokikJOvBiI2HlWgH4olfQ2
: \
  -d "payment_method_types[]"="au_becs_debit" \
  -d "customer"="{{CUSTOMER_ID}}"

サーバで SetupIntent を作成した後、アプリケーションのデータモデルで現在のセッションの顧客に SetupIntent ID を関連付けることができます。これを行うと、支払い方法の収集に成功した後で情報を取得できます。

返される SetupIntent オブジェクトには、client_secret プロパティが含まれています。この client secret をクライアント側のアプリケーションに渡して、設定プロセスを続行します。

支払い方法の詳細と同意書承認を収集する
クライアント側

Stripe Elements を使用してクライアントで支払い情報を収集する準備ができました。Elements は、支払いの詳細を収集するための構築済み UI コンポーネントのセットです。

Stripe Element には、HTTPS 接続を介して支払い情報を Stripe に安全に送信する iframe が含まれています。組み込みを機能させるには、決済ページのアドレスの先頭を http:// ではなく https:// にする必要があります。

HTTPS を使用せずに実装をテストできます。本番環境で決済を受け付ける準備が整ったら、HTTPS を有効化します。

Stripe Elements を設定する

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

payment_setup.html
<head>
  <title>Payment Setup</title>
  <script src="https://js.stripe.com/clover/stripe.js"></script>
</head>

次の JavaScript を使用して、お客様の決済ページに Elements のインスタンスを作成します。

const stripe = Stripe(
'pk_test_TYooMQauvdEDq54NiTphI7jx'
);
const elements = stripe.elements();

ダイレクトデビットのリクエスト

お客様が BECS ダイレクトデビット支払いを作成する前に、顧客がダイレクトデビットリクエスト利用規約に同意する必要があります。顧客は入力を完了したダイレクトデビットリクエスト (DDR) を送信することで、この規約に同意したことになります。この承認により、お客様は顧客の口座から引き落としを行う同意書を得られます。Mandate は支払い方法へのデビットが許可されたことの記録です。

同意書にオンラインで同意してもらうために、フォームを作成して必要な情報を収集できます。フォームは HTTPS で提供し、以下の情報を取得します。

情報説明
口座名義人名口座名義人の氏名
BSB 番号銀行口座の Bank-State-Branch 番号 (例: 123-456)
口座番号銀行口座番号 (例: 87654321)

ダイレクトデビットリクエストを収集する際には、BECS ダイレクトデビット規約に従い、決済フォームの一環として次のことを行います。

  • Stripe の DDR 利用規約の正確な規約をフォーム上にインラインで、またはフォームからリンクしたページに表示し、それが「DDR 利用規約」であると明記します。
  • 同意された DDR とこれに伴う DDR 利用規約を顧客がいつでも参照できるようにします。これは印刷物でも、変更不可の電子的なコピー (メールなど) の形でもかまいません。お客様が利用できるように Stripe がこの DDR をオンラインで提供します
  • 以下に示す許可のための標準的なテキストを表示し、顧客に BECS DDR に同意してもらいます。「Rocketship Inc」 を自社名に置き換えてください。顧客が同意すると、顧客の銀行口座からの BECS ダイレクトデビット支払いが許可されたことになります。

注

銀行口座の詳細を提供することにより、このダイレクトデビットリクエストとダイレクトデビットリクエスト利用規約に同意し、Stripe Payments Australia Pty Ltd ACN 160 180 343 ダイレクトデビットユーザー ID 番号 507156 (「Stripe」) が Rocketship Inc (「加盟店」) に代わり、加盟店との利用規約の詳細に従って、一括電子決済システム (BECS) を通じてアカウントから決済を引き落とすことを承認します。上記の口座のアカウント所有者または権限のある署名者であることを証明します。

同意された同意書の詳細情報は、PaymentMethod を設定する際、または PaymentIntent を確認する際に生成されます。この同意書 (同意された DDR とこれに伴う DDR 利用規約) はいつでも顧客に提示できる必要があります。これは印刷物でも、変更不可の電子的なコピー (メールなど) でもかまいません。Stripe はお客様が利用できるように、この利用規約を PaymentMethod にリンクされた Mandate オブジェクトの url プロパティでホストします。

オーストラリアの銀行口座 Element を追加および設定する

Australia Bank Account Element は、BSB 番号と口座番号の両方の収集と検証に役立ちます。この Element は、決済フォーム上に保存場所が必要です。決済フォームに、一意の ID を指定して空の DOM ノード (コンテナー) を作成してください。また、顧客はダイレクトデビットリクエスト利用規約を読んで同意する必要もあります。

payment_setup.html
HTML
CSS
No results
<form action="/setup" method="post" id="setup-form">
  <div class="form-row inline">
    <div class="col">
      <label for="accountholder-name">
        Name
      </label>
      <input
        id="accountholder-name"
        name="accountholder-name"
        placeholder="John Smith"
        required
      />
    </div>
    <div class="col">
      <label for="email">
        Email Address
      </label>
      <input
        id="email"
        name="email"
        type="email"
        placeholder="john.smith@example.com"
        required
      />
    </div>
  </div>

  <div class="form-row">
    <!--
    Using a label with a for attribute that matches the ID of the
    Element container enables the Element to automatically gain focus
    when the customer clicks on the label.
    -->
    <label for="au-bank-account-element">
      Bank Account
    </label>
    <div id="au-bank-account-element">
      <!-- A Stripe Element will be inserted here. -->
    </div>
  </div>

  <!-- Used to display bank (branch) name associated with the entered BSB -->
  <div id="bank-name"></div>

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

  <!-- Display mandate acceptance text. -->
  <div class="col" id="mandate-acceptance">
    By providing your bank account details, you agree to this Direct Debit Request
    and the <a href="stripe.com/au-becs-dd-service-agreement/legal">Direct Debit Request service agreement</a>,
    and authorise Stripe Payments Australia Pty Ltd ACN 160 180 343
    Direct Debit User ID number 507156 (“Stripe”) to debit your account
    through the Bulk Electronic Clearing System (BECS) on behalf of
    Rocket Rides (the "Merchant") for any amounts separately
    communicated to you by the Merchant. You certify that you are either
    an account holder or an authorised signatory on the account listed above.
  </div>
  
  <!-- Add the client_secret from the SetupIntent as a data attribute -->
  <button id="submit-button" data-secret="{{CLIENT_SECRET}}">Set up BECS Direct Debit</button>

</form>

フォームが読み込まれるときに、次のように、Australia Bank Account Element のインスタンスを作成し、それを Element コンテナーにマウントできます。

// Custom styling can be passed to options when creating an Element
const style = {
  base: {
    color: '#32325d',
    fontSize: '16px',
    '::placeholder': {
      color: '#aab7c4'
    },
    ':-webkit-autofill': {
      color: '#32325d',
    },
  },
  invalid: {
    color: '#fa755a',
    iconColor: '#fa755a',
    ':-webkit-autofill': {
      color: '#fa755a',
    },
  }
};

const options = {
    style: style,
    disabled: false,
    hideIcon: false,
    iconStyle: "default", // or "solid"
}

// Create an instance of the auBankAccount Element.
const auBankAccount = elements.create('auBankAccount', options);

// Add an instance of the auBankAccount Element into
// the `au-bank-account-element` <div>.
auBankAccount.mount('#au-bank-account-element');

Stripe に支払い方法の詳細を送信する
クライアント側

SetupIntent オブジェクト全体をクライアントに送信するのではなく、ステップ 2 で取得した client secret を使用します。これは、Stripe API リクエストを認証する API キーとは異なります。

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

ユーザーがフォームを送信したら、stripe.confirmAuBecsDebitSetup を使用してセットアップを完了します。セットアップに成功すると、SetupIntent の status プロパティに succeeded 値が返されます。セットアップが成功しなかった場合は、返された error を調べて原因を判断してください。

customer が設定されているため、セットアップが成功すると、PaymentMethod が指定された Customer オブジェクトに関連付けられます。この時点で Customer オブジェクトの ID を、お客様独自の顧客の内部表現に関連付けることができます。これにより、顧客の決済手段の詳細を求めるプロンプトを表示することなく、格納された PaymentMethod を使用して以降の支払いを回収できます。

const form = document.getElementById('setup-form');
const accountholderName = document.getElementById('accountholder-name');
const email = document.getElementById('email');
const submitButton = document.getElementById('submit-button');
const clientSecret = submitButton.dataset.secret;

form.addEventListener('submit', async (event) => {
  event.preventDefault();
  stripe.confirmAuBecsDebitSetup(
    clientSecret,
    {
      payment_method: {
        au_becs_debit: auBankAccount,
        billing_details: {
          name: accountholderName.value,
          email: email.value
        }
      }
    }
  );
});

SetupIntent が正常に確定した後、Mandate (同意書) オブジェクトから取得した同意書の URL を顧客に提示する必要があります。また顧客に同意書が確定したことを伝える際には、下記の詳細情報を含めることを推奨します。

  • ダイレクトデビットの準備が整ったことを示す明確な確認メッセージ
  • 口座から引き落とされるたびに顧客の銀行明細書に表示されるビジネス名
  • 支払い金額とスケジュール (該当する場合)
  • 生成された DDR 同意書 URL へのリンク

Mandate オブジェクトの ID は、SetupIntent オブジェクトの mandate から取得できます。この ID は、確定後に送信される setup_intent.succeeded イベントの一部として送信され、API から取得することもできます。

Command Line
cURL
Stripe CLI
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
curl https://api.stripe.com/v1/setup_intents/{{SETUP_INTENT_ID}} \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d "expand[]"=mandate

構築したシステムをテストする

テスト用の BSB 番号 000000 と以下のいずれかのテストアカウント番号を confirmAuBecsDebitSetup リクエストで使用することで、フォームをテストできます。

BSB 番号口座番号説明
000000000123456生成された PaymentMethod で作成された PaymentIntent は、processing から succeeded に変わります。同意書のステータスは引き続き active です。
000000900123456生成された PaymentMethod で作成された PaymentIntent は、processing から succeeded に変わります (3 分の遅延あり)。同意書のステータスは引き続き active です。
000000111111113生成された PaymentMethod で作成された PaymentIntent は、processing から requires_payment_method に変わり、account_closed エラーコードが返されます。同意書のステータスはその時点で inactive になります。
000000111111116生成された PaymentMethod で作成された PaymentIntent は、processing から requires_payment_method に変わり、no_account エラーコードが返されます。同意書のステータスはその時点で inactive になります。
000000222222227生成された PaymentMethod で作成された PaymentIntent は、processing から requires_payment_method に変わり、refer_to_customer エラーコードが返されます。同意書のステータスは引き続き active です。
000000922222227生成された PaymentMethod で作成された PaymentIntent は、processing から requires_payment_method に変わり、refer_to_customer エラーコードが返されます (3 分の遅延あり)。同意書のステータスは引き続き active です。
000000333333335生成された PaymentMethod で作成された PaymentIntent は、processing から requires_payment_method に変わり、debit_not_authorized エラーコードが返されます。同意書のステータスはその時点で inactive になります。
000000666666660生成された PaymentMethod で作成された PaymentIntent は、processing から succeeded に変わりますが、不審請求の申請が直ちに作成されます。
000000343434343結果として生じる PaymentMethod により作成された PaymentIntent は、支払い金額が原因でアカウントの週次支払い金額の上限を超えてしまうため、charge_exceeds_source_limit エラーで失敗します。
000000121212121結果として生じる PaymentMethod により作成された PaymentIntent は、支払い金額がアカウントの取引金額の上限を超えているため、charge_exceeds_transaction_limit エラーで失敗します。

オプションオーストラリアの銀行口座 Element を検証する
クライアント側

オーストラリアの銀行口座 Element はユーザの入力時にその内容を検証します。顧客が間違いを修正できるように、オーストラリアの銀行口座 Element で変更イベントをリッスンし、エラーを表示してください。

auBankAccount.on('change', (event) => {
  const displayError = document.getElementById('error-message');
  if (event.error) {
    displayError.textContent = event.error.message;
  } else {
    displayError.textContent = '';
  }
});

変更イベントには、より充実したユーザー体験の構築に役立つパラメーターが他にも含まれています。詳細については、Stripe.js リファレンスを参照してください。

オプション将来の決済を受け付ける
クライアント側

SetupIntent が成功すると、新しい PaymentMethod および Mandate (同意書) オブジェクトが作成されます。これらのオブジェクトは、顧客に情報の入力を求めることなく将来の支払いを開始するために使用できます。

Command Line
cURL
Stripe CLI
Ruby
Python
PHP
Java
Node.js
Go
.NET
No results
curl https://api.stripe.com/v1/payment_intents \
  -u "
sk_test_BQokikJOvBiI2HlWgH4olfQ2
:" \
  -d amount=1000 \
  -d currency=aud \
  -d "payment_method_types[]"=au_becs_debit \
  -d customer=
"{{CUSTOMER_ID}}"
 \
  -d payment_method=
"{{PAYMENT_METHOD_ID}}"
 \
  -d confirm=true

参照情報

このページはお役に立ちましたか。
はいいいえ