# 今後の支払いに備え、オーストラリアの BECS Direct Debit の詳細を保存する 今後のオーストラリアの BECS Direct Debit 支払いに備え、Setup Intents API を使用して決済手段の情報を保存します。 # Elements > This is a Elements for when payment-ui is elements. View the full page at https://docs.stripe.com/payments/au-becs-debit/set-up-payment?payment-ui=elements. Stripe の事前構築された UI コンポーネントである [Stripe Elements](https://docs.stripe.com/payments/elements.md) を使用して、機密データを扱うことなく銀行口座の詳細を安全に収集できる決済フォームを作成します。[Setup Intents API](https://docs.stripe.com/payments/setup-intents.md) を使用して、事前に BECS ダイレクトデビットの決済手段の詳細を収集し、後から最終的な金額や支払い日を決定できます。この機能は以下の目的に利用できます。 - 支払い方法をウォレットに保存して、以降の購入を効率化する - サービスの提供後に追加料金を回収する - [サブスクリプションの無料トライアルを開始する](https://docs.stripe.com/billing/subscriptions/trials.md) ## Stripe を設定する [サーバー側] まず、Stripe アカウントが必要です。[今すぐご登録ください](https://dashboard.stripe.com/register)。 アプリケーションから Stripe API にアクセスするには、Stripe の公式ライブラリを使用します。 #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ## Customer を作成または取得する [サーバー側] 以降の支払いに BECS ダイレクトデビットの口座を再利用するには、その口座を *Customer* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments) に関連付ける必要があります。 お客様のビジネスで顧客がアカウントを作成する際、Customer オブジェクトを作成します。この Customer オブジェクトの ID を、顧客を表す独自の内部表記と関連付けることで、保存されている支払い方法の詳細を後で取得して使用することができます。 新しい Customer を作成するか、または既存の Customer を取得して、この支払いに関連付けます。サーバに以下のコードを含め、新しい Customer を作成します。 ```curl curl -X POST https://api.stripe.com/v1/customers \ -u "<>:" ``` ## SetupIntent を作成する [サーバー側] [SetupIntent (支払い方法設定インテント)](https://docs.stripe.com/api/setup_intents.md) は、今後の支払いのために顧客の決済手段をセットアップするお客様の意図を表すオブジェクトです。`SetupIntent` は、この設定プロセスのステップを追跡します。BECS ダイレクトデビットの場合、このステップには顧客からの同意書の収集と、ライフサイクル全体にわたる同意書の有効性の追跡が含まれます。 [payment_method_types](https://docs.stripe.com/api/setup_intents/create.md#create_setup_intent-payment_method_types) を `au_becs_debit` に設定してサーバーに [SetupIntent (支払い方法設定インテント)](https://docs.stripe.com/api/setup_intents.md) を作成し、*Customer* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments) の [id](https://docs.stripe.com/api/customers/object.md#customer_object-id) を指定します。 #### curl ```bash curl https://api.stripe.com/v1/setup_intents \ -u <>: \ -d "payment_method_types[]"="au_becs_debit" \ -d "customer"="{{CUSTOMER_ID}}" ``` サーバで `SetupIntent` を作成した後、アプリケーションのデータモデルで現在のセッションの顧客に `SetupIntent` ID を関連付けることができます。これを行うと、決済手段の収集に成功した後で情報を取得できます。 返される `SetupIntent` オブジェクトには、`client_secret` プロパティが含まれています。この client secret をクライアント側のアプリケーションに渡して、設定プロセスを続行します。 ## 支払い方法の詳細と同意書承認を収集する [クライアント側] [Stripe Elements](https://docs.stripe.com/payments/elements.md) を使用してクライアントで支払い情報を収集する準備ができました。Elements は、支払いの詳細を収集するための構築済み UI コンポーネントのセットです。 Stripe Element には、HTTPS 接続を介して支払い情報を Stripe に安全に送信する iframe が含まれています。組み込みを機能させるには、決済ページのアドレスの先頭を http:// ではなく https:// にする必要があります。 HTTPS を使用せずに実装をテストできます。本番環境で決済を受け付ける準備が整ったら、HTTPS を[有効化](https://docs.stripe.com/security/guide.md#tls)します。 ### Stripe Elements を設定する #### HTML + JS Stripe Elements は Stripe.js の機能として自動的に使用できるようになります。支払いページに Stripe.js スクリプトを含めるには、HTML ファイルの `head` にこのスクリプトを追加します。常に js.stripe.com から Stripe.js を直接読み込むことにより、PCI への準拠が維持されます。スクリプトをバンドルに含めたり、そのコピーを自身でホストすることがないようにしてください。 ```html Payment Setup ``` 次の JavaScript を使用して、お客様の決済ページに [Elements](https://docs.stripe.com/js.md#stripe-elements) のインスタンスを作成します。 ```javascript const stripe = Stripe('<>'); const elements = stripe.elements(); ``` ### ダイレクトデビットのリクエスト お客様が BECS ダイレクトデビット支払いを作成する前に、顧客がダイレクトデビットリクエスト利用規約に同意する必要があります。顧客は入力を完了したダイレクトデビットリクエスト (DDR) を送信することで、この規約に同意したことになります。この承認により、お客様は顧客の口座から引き落としを行う同意書を得られます。`Mandate` は支払い方法へのデビットが許可されたことの記録です。 同意書にオンラインで同意してもらうために、フォームを作成して必要な情報を収集できます。フォームは [HTTPS](https://docs.stripe.com/security/guide.md#tls) で提供し、以下の情報を取得します。 | 情報 | 説明 | | ---------- | ----------------------------------------- | | **口座名義人名** | 口座名義人の氏名 | | **BSB 番号** | 銀行口座の Bank-State-Branch 番号 (例: `123-456`) | | **口座番号** | 銀行口座番号 (例: `87654321`) | ダイレクトデビットリクエストを収集する際には、[BECS ダイレクトデビット規約](https://stripe.com/au-becs/legal)に従い、決済フォームの一環として次のことを行います。 - [Stripe の DDR 利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)の正確な規約をフォーム上にインラインで、またはフォームからリンクしたページに表示し、それが「DDR 利用規約」であると明記します。 - 同意された DDR とこれに伴う [DDR 利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)を顧客がいつでも参照できるようにします。これは印刷物でも、変更不可の電子的なコピー (メールなど) の形でもかまいません。お客様が利用できるように Stripe がこの DDR をオンラインで提供します - 以下に示す許可のための標準的なテキストを表示し、顧客に BECS DDR に同意してもらいます。「Rocketship Inc」 を自社名に置き換えてください。顧客が同意すると、顧客の銀行口座からの BECS ダイレクトデビット支払いが許可されたことになります。 > 銀行口座の詳細を提供することにより、このダイレクトデビットリクエストと[ダイレクトデビットリクエスト利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)に同意し、Stripe Payments Australia Pty Ltd ACN 160 180 343 ダイレクトデビットユーザー ID 番号 507156 (「Stripe」) が *Rocketship Inc* (「加盟店」) に代わり、加盟店との利用規約の詳細に従って、一括電子決済システム (BECS) を通じてアカウントから決済を引き落とすことを承認します。上記の口座のアカウント所有者または権限のある署名者であることを証明します。 同意された同意書の詳細情報は、[PaymentMethod](https://docs.stripe.com/payments/payment-methods.md) を設定する際、または `PaymentIntent` を確認する際に生成されます。この同意書 (同意された DDR とこれに伴う DDR 利用規約) はいつでも顧客に提示できる必要があります。これは印刷物でも、変更不可の電子的なコピー (メールなど) でもかまいません。Stripe はお客様が利用できるように、この利用規約を `PaymentMethod` にリンクされた `Mandate` オブジェクトの `url` プロパティでホストします。 ### オーストラリアの銀行口座 Element を追加および設定する Australia Bank Account Element は、BSB 番号と口座番号の両方の収集と検証に役立ちます。この Element は、決済フォーム上に保存場所が必要です。決済フォームに、一意の ID を指定して空の DOM ノード (コンテナー) を作成してください。また、顧客は[ダイレクトデビットリクエスト利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)を読んで同意する必要もあります。 #### HTML ```html
By providing your bank account details, you agree to this Direct Debit Request and the Direct Debit Request service agreement, 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 ofRocket 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.
``` フォームが読み込まれるときに、次のように、Australia Bank Account Element の[インスタンスを作成](https://docs.stripe.com/js/elements_object/create_element?type=au_bank_account)し、それを Element コンテナーにマウントできます。 ```javascript // 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`
. auBankAccount.mount('#au-bank-account-element'); ``` #### React #### npm npm パブリックレジストリーから [React Stripe.js](https://www.npmjs.com/package/@stripe/react-stripe-js) と [Stripe.js ローダー](https://www.npmjs.com/package/@stripe/stripe-js)をインストールします。 ```bash npm install --save @stripe/react-stripe-js @stripe/stripe-js ``` #### umd Stripe は npm やモジュールを使用しないサイト向けに UMD ビルドも提供しています。 グローバルな `Stripe` 機能をエクスポートする Stripe.js スクリプトと、グローバルな `ReactStripe` オブジェクトをエクスポートする React Stripe.js の UMD ビルドを含めてください。常に **js.stripe.com** から Stripe.js スクリプトを直接読み込むことにより、PCI への準拠が維持されます。スクリプトをバンドルに含めたり、そのコピーを自身でホストすることがないようにしてください。 ```html ``` > [CodeSandbox でのデモ](https://codesandbox.io/s/react-stripe-official-q1loc?fontsize=14&hidenavigation=1&theme=dark)を使用すると、新しいプロジェクトを作成することなく、React Stripe.js を試してみることができます。 ### お客様のページへの Stripe.js および Elements の追加 Element コンポーネントを使用するには、決済ページコンポーネントを [Elements プロバイダー](https://docs.stripe.com/sdks/stripejs-react.md#elements-provider)でラップします。公開キーを使用して `loadStripe` を呼び出し、返された `Promise` を `Elements` プロバイダーに渡します。 ```jsx import React from 'react'; import ReactDOM from 'react-dom'; import {Elements} from '@stripe/react-stripe-js'; import {loadStripe} from '@stripe/stripe-js'; import PaymentSetupForm from './PaymentSetupForm'; // Make sure to call `loadStripe` outside of a component's render to avoid // recreating the `Stripe` object on every render. const stripePromise = loadStripe('<>'); function App() { return ( ); }; ReactDOM.render(, document.getElementById('root')); ``` ### ダイレクトデビットのリクエスト お客様が BECS ダイレクトデビット支払いを作成する前に、顧客がダイレクトデビットリクエスト利用規約に同意する必要があります。顧客は入力を完了したダイレクトデビットリクエスト (DDR) を送信することで、この規約に同意したことになります。この承認により、お客様は顧客の口座から引き落としを行う同意書を得られます。`Mandate` は支払い方法へのデビットが許可されたことの記録です。 同意書にオンラインで同意してもらうために、フォームを作成して必要な情報を収集できます。フォームは [HTTPS](https://docs.stripe.com/security/guide.md#tls) で提供し、以下の情報を取得します。 | 情報 | 説明 | | ---------- | ----------------------------------------- | | **口座名義人名** | 口座名義人の氏名 | | **BSB 番号** | 銀行口座の Bank-State-Branch 番号 (例: `123-456`) | | **口座番号** | 銀行口座番号 (例: `87654321`) | ダイレクトデビットリクエストを収集する際には、[BECS ダイレクトデビット規約](https://stripe.com/au-becs/legal)に従い、決済フォームの一環として次のことを行います。 - [Stripe の DDR 利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)の正確な規約をフォーム上にインラインで、またはフォームからリンクしたページに表示し、それが「DDR 利用規約」であると明記します。 - 同意された DDR とこれに伴う [DDR 利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)を顧客がいつでも参照できるようにします。これは印刷物でも、変更不可の電子的なコピー (メールなど) の形でもかまいません。お客様が利用できるように Stripe がこの DDR をオンラインで提供します - 以下に示す許可のための標準的なテキストを表示し、顧客に BECS DDR に同意してもらいます。「Rocketship Inc」 を自社名に置き換えてください。顧客が同意すると、顧客の銀行口座からの BECS ダイレクトデビット支払いが許可されたことになります。 > 銀行口座の詳細を提供することにより、このダイレクトデビットリクエストと[ダイレクトデビットリクエスト利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)に同意し、Stripe Payments Australia Pty Ltd ACN 160 180 343 ダイレクトデビットユーザー ID 番号 507156 (「Stripe」) が *Rocketship Inc* (「加盟店」) に代わり、加盟店との利用規約の詳細に従って、一括電子決済システム (BECS) を通じてアカウントから決済を引き落とすことを承認します。上記の口座のアカウント所有者または権限のある署名者であることを証明します。 同意された同意書の詳細情報は、[PaymentMethod](https://docs.stripe.com/payments/payment-methods.md) を設定する際、または `PaymentIntent` を確認する際に生成されます。この同意書 (同意された DDR とこれに伴う DDR 利用規約) はいつでも顧客に提示できる必要があります。これは印刷物でも、変更不可の電子的なコピー (メールなど) でもかまいません。Stripe はお客様が利用できるように、この利用規約を `PaymentMethod` にリンクされた `Mandate` オブジェクトの `url` プロパティでホストします。 ### AuBankAccountElement コンポーネントを追加および設定する `AuBankAccountElement` コンポーネントは、BSB 番号と口座番号の両方を収集して検証するために役立ちます。また、顧客は[ダイレクトデビットリクエスト利用規約](https://stripe.com/au-becs-dd-service-agreement/legal)を読んで同意する必要もあります。 #### JSX ```jsx /** * Use the CSS tab above to style your Element's container. */ import React from 'react'; import {AuBankAccountElement} from '@stripe/react-stripe-js'; import './BecsFormStyles.css' // Custom styling can be passed as options when creating an Element. const AU_BANK_ACCOUNT_STYLE = { base: { color: '#32325d', fontSize: '16px', '::placeholder': { color: '#aab7c4' }, ':-webkit-autofill': { color: '#32325d', }, }, invalid: { color: '#fa755a', iconColor: '#fa755a', ':-webkit-autofill': { color: '#fa755a', }, } }; const AU_BANK_ACCOUNT_ELEMENT_OPTIONS = { style: AU_BANK_ACCOUNT_STYLE, disabled: false, hideIcon: false, iconStyle: "default", // or "solid" }; export default function BecsForm({onSubmit, disabled}) { return (
{/* Display mandate acceptance text. */}
By providing your bank account details, you agree to this Direct Debit Request and the Direct Debit Request service agreement, 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 ofRocket 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.
``` Element は完全にカスタマイズ可能です。お客様のサイトのデザインと雰囲気に合わせて [Element のスタイルを設定](https://docs.stripe.com/js/elements_object/create_element?type=au_bank_account#elements_create-options)して、顧客にシームレスな決済体験を提供できます。また、Element が選択されているときなど、さまざまな入力状態のスタイルを設定することもできます。 ## Stripe に支払い方法の詳細を送信する [クライアント側] `SetupIntent` オブジェクト全体をクライアントに送信するのではなく、[ステップ 2](https://docs.stripe.com/payments/au-becs-debit/set-up-payment.md#web-create-setup-intent) で取得した [client secret](https://docs.stripe.com/api/setup_intents/object.md#setup_intent_object-client_secret) を使用します。これは、Stripe API リクエストを認証する API キーとは異なります。 client secret は設定を完了できるため、慎重に取り扱う必要があります。記録したり、URL に埋め込んだり、当該の顧客以外に漏洩することがないようにしてください。 #### HTML + JS ユーザーがフォームを送信したら、[stripe.confirmAuBecsDebitSetup](https://docs.stripe.com/js/setup_intents/confirm_au_becs_debit_setup) を使用してセットアップを完了します。セットアップに成功すると、SetupIntent の `status` プロパティに `succeeded` 値が返されます。セットアップが成功しなかった場合は、返された `error` を調べて原因を判断してください。 [customer](https://docs.stripe.com/api/setup_intents/create.md#create_setup_intent-customer) が設定されているため、セットアップが成功すると、*PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) が指定された `Customer` オブジェクトに関連付けられます。この時点で `Customer` オブジェクトの ID を、お客様独自の顧客の内部表現に関連付けることができます。これにより、顧客の決済手段の詳細を求めるプロンプトを表示することなく、格納された `PaymentMethod` を使用して以降の支払いを回収できます。 ```javascript 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 (同意書) オブジェクト](https://docs.stripe.com/api/mandates.md)から取得した[同意書の URL](https://docs.stripe.com/api/mandates/object.md#mandate_object-payment_method_details-au_becs_debit-url) を顧客に提示する必要があります。また顧客に同意書が確定したことを伝える際には、下記の詳細情報を含めることを推奨します。 - ダイレクトデビットの準備が整ったことを示す明確な確認メッセージ - 口座から引き落とされるたびに顧客の銀行明細書に表示される[ビジネス名](https://docs.stripe.com/payments/au-becs-debit/set-up-payment.md#statement-descriptors) - 支払い金額とスケジュール (該当する場合) - 生成された DDR 同意書 URL へのリンク `Mandate` オブジェクトの ID は、SetupIntent オブジェクトの `mandate` から取得できます。この ID は、確定後に送信される `setup_intent.succeeded` イベントの一部として送信され、[API から取得](https://docs.stripe.com/api/setup_intents/retrieve.md)することもできます。 ```curl curl -G https://api.stripe.com/v1/setup_intents/{{SETUP_INTENT_ID}} \ -u "<>:" \ -d "expand[]=mandate" ``` #### React ユーザーがフォームを送信したら、[stripe.confirmAuBecsDebitSetup](https://docs.stripe.com/js/setup_intents/confirm_au_becs_debit_setup) を使用して、同意書の収集を完了します。BECS ダイレクトデビットの `PaymentMethod` を作成するには、`payment_method` パラメーターの `billing_details` プロパティに顧客のメールアドレスと口座名義人を含める必要があります。 支払いフォームコンポーネントから `stripe.confirmAuBecsDebitSetup` を呼び出すには、[useStripe](https://docs.stripe.com/sdks/stripejs-react.md#usestripe-hook) フックと [useElements](https://docs.stripe.com/sdks/stripejs-react.md#useelements-hook) フックを使用します。フックではなく従来のクラスコンポーネントを使用する場合は、代わりに [ElementsConsumer](https://docs.stripe.com/sdks/stripejs-react.md#elements-consumer) を使用します。 #### フック ```jsx import React from 'react'; import {useStripe, useElements, AuBankAccountElement} from '@stripe/react-stripe-js'; import BecsForm from './BecsForm'; export default function PaymentSetupForm() { const stripe = useStripe(); const elements = useElements(); const handleSubmit = async (event) => { // We don't want to let default form submission happen here, // which would refresh the page. event.preventDefault(); if (!stripe || !elements) { // Stripe.js hasn't yet loaded. // Make sure to disable form submission until Stripe.js has loaded. return; } const auBankAccount = elements.getElement(AuBankAccountElement); // For brevity, this example is using uncontrolled components for // the accountholder's name and email. In a real world app you will // probably want to use controlled components. // https://reactjs.org/docs/uncontrolled-components.html // https://reactjs.org/docs/forms.html#controlled-components const accountholderName = event.target['accountholder-name']; const email = event.target.email; const result = await stripe.confirmAuBecsDebitSetup('{{CLIENT_SECRET}}', { payment_method: { au_becs_debit: auBankAccount, billing_details: { name: accountholderName.value, email: email.value, }, } }); if (result.error) { // Show error to your customer. console.log(result.error.message); } else { // Show a confirmation message to your customer. // The SetupIntent is in the 'succeeded' state. } }; return ( ); } ``` #### クラスコンポーネント ```jsx import React from 'react'; import {ElementsConsumer, AuBankAccountElement} from '@stripe/react-stripe-js'; import BecsForm from './BecsForm'; class PaymentSetupForm extends React.Component { handleSubmit = async (event) => { // We don't want to let default form submission happen here, // which would refresh the page. event.preventDefault(); const {stripe, elements} = this.props; if (!stripe || !elements) { // Stripe.js hasn't yet loaded. // Make sure to disable form submission until Stripe.js has loaded. return; } const auBankAccount = elements.getElement(AuBankAccountElement); // For brevity, this example is using uncontrolled components for // the accountholder's name and email. In a real world app you will // probably want to use controlled components. // https://reactjs.org/docs/uncontrolled-components.html // https://reactjs.org/docs/forms.html#controlled-components const accountholderName = event.target['accountholder-name']; const email = event.target.email; const result = await stripe.confirmAuBecsDebitSetup('{{CLIENT_SECRET}}', { payment_method: { au_becs_debit: auBankAccount, billing_details: { name: accountholderName.value, email: email.value, }, } }); if (result.error) { // Show error to your customer. console.log(result.error.message); } else { // Show a confirmation message to your customer. // The SetupIntent is in the 'succeeded' state. } }; render() { const {stripe} = this.props; return ( ); } } export default function InjectedPaymentSetupForm() { return ( {({stripe, elements}) => ( )} ); } ``` `SetupIntent` が正常に確定した後、[Mandate (同意書) オブジェクト](https://docs.stripe.com/api/mandates.md)から取得した[同意書の URL](https://docs.stripe.com/api/mandates/object.md#mandate_object-payment_method_details-au_becs_debit-url) を顧客に提示する必要があります。また顧客に同意書が確定したことを伝える際には、下記の詳細情報を含めることを推奨します。 - ダイレクトデビットの準備が整ったことを示す明確な確認メッセージ - 口座から引き落とされるたびに顧客の銀行明細書に表示される[ビジネス名](https://docs.stripe.com/payments/au-becs-debit/set-up-payment.md#statement-descriptors) - 支払い金額とスケジュール (該当する場合) - 生成された DDR 同意書 URL へのリンク `Mandate` オブジェクトの ID は、SetupIntent オブジェクトの `mandate` から取得できます。この ID は、確定後に送信される `setup_intent.succeeded` イベントの一部として送信され、[API から取得](https://docs.stripe.com/api/setup_intents/retrieve.md)することもできます。 ```curl curl -G https://api.stripe.com/v1/setup_intents/{{SETUP_INTENT_ID}} \ -u "<>:" \ -d "expand[]=mandate" ``` ## 構築したシステムをテストする テスト用の BSB 番号 `000000` と以下のいずれかのテストアカウント番号を [confirmAuBecsDebitSetup](https://docs.stripe.com/js/setup_intents/confirm_au_becs_debit_setup) リクエストで使用することで、フォームをテストできます。 | BSB 番号 | 口座番号 | 説明 | | -------- | ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `000000` | `000123456` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `succeeded` に変わります。同意書のステータスは引き続き `active` です。 | | `000000` | `900123456` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `succeeded` に変わります (3 分の遅延あり)。同意書のステータスは引き続き `active` です。 | | `000000` | `111111113` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`account_closed` エラーコードが返されます。同意書のステータスはその時点で `inactive` になります。 | | `000000` | `111111116` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`no_account` エラーコードが返されます。同意書のステータスはその時点で `inactive` になります。 | | `000000` | `222222227` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`refer_to_customer` エラーコードが返されます。同意書のステータスは引き続き `active` です。 | | `000000` | `922222227` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`refer_to_customer` エラーコードが返されます (3 分の遅延あり)。同意書のステータスは引き続き `active` です。 | | `000000` | `333333335` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`debit_not_authorized` エラーコードが返されます。同意書のステータスはその時点で `inactive` になります。 | | `000000` | `666666660` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `succeeded` に変わりますが、不審請求の申請が直ちに作成されます。 | | `000000` | `343434343` | 結果として生じる PaymentMethod により作成された PaymentIntent は、支払い金額が原因でアカウントの週次支払い金額の上限を超えてしまうため、`charge_exceeds_source_limit` エラーで失敗します。 | | `000000` | `121212121` | 結果として生じる PaymentMethod により作成された PaymentIntent は、支払い金額がアカウントの取引金額の上限を超えているため、`charge_exceeds_transaction_limit` エラーで失敗します。 | ## Optional: オーストラリアの銀行口座 Element を検証する [クライアント側] オーストラリアの銀行口座 Element はユーザの入力時にその内容を検証します。顧客が間違いを修正できるように、オーストラリアの銀行口座 Element で変更イベントをリッスンし、エラーを表示してください。 #### HTML + JS ```javascript auBankAccount.on('change', (event) => { const displayError = document.getElementById('error-message'); if (event.error) { displayError.textContent = event.error.message; } else { displayError.textContent = ''; } }); ``` #### React ```jsx { if (event.error) { // Store event.error.message in state and display it. } else { // Remove existing error from state. } }}> ``` 変更イベントには、より充実したユーザー体験の構築に役立つパラメーターが他にも含まれています。詳細については、[Stripe.js リファレンス](https://docs.stripe.com/js/element/events/on_change?type=auBankAccountElement#element_on_change-handler)を参照してください。 ## Optional: 将来の決済を受け付ける [クライアント側] SetupIntent が成功すると、新しい *PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) および [Mandate (同意書) オブジェクト](https://docs.stripe.com/api/mandates.md)が作成されます。これらのオブジェクトは、顧客に情報の入力を求めることなく将来の支払いを開始するために使用できます。 ```curl curl https://api.stripe.com/v1/payment_intents \ -u "<>:" \ -d amount=1000 \ -d currency=aud \ -d "payment_method_types[]=au_becs_debit" \ -d "customer={{CUSTOMER_ID}}" \ -d "payment_method={{PAYMENTMETHOD_ID}}" \ -d confirm=true ``` # iOS > This is a iOS for when payment-ui is mobile and platform is ios. View the full page at https://docs.stripe.com/payments/au-becs-debit/set-up-payment?payment-ui=mobile&platform=ios. Stripe の事前構築された BECS 支払い詳細の収集用 UI である STPAUBECSFormView を使用して、顧客の機密データを扱うことなく銀行口座の詳細を安全に収集できる決済フォームを作成します。[Setup Intents API](https://docs.stripe.com/payments/setup-intents.md) を使用して、事前に BECS ダイレクトデビットの決済手段の詳細を収集し、後から最終的な金額や支払い日を決定できます。この機能は以下の目的に利用できます。 - 支払い方法をウォレットに保存して、以降の購入を効率化する - サービスの提供後に追加料金を回収する - [サブスクリプションの無料トライアルを開始する](https://docs.stripe.com/billing/subscriptions/trials.md) ## Stripe を設定する [サーバ側] [クライアント側] まず、Stripe アカウントが必要です。[今すぐ登録](https://dashboard.stripe.com/register)してください。 ### サーバ側 この組み込みには、サーバ上に Stripe API と通信するエンドポイントが必要です。サーバから Stripe API にアクセスするには、Stripe の公式ライブラリを使用します。 #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ### クライアント側 [Stripe iOS SDK](https://github.com/stripe/stripe-ios) はオープンソースです。[詳細なドキュメントが提供されており](https://stripe.dev/stripe-ios/index.html)、iOS 13 以降をサポートするアプリと互換性があります。 #### Swift Package Manager SDK をインストールするには、以下のステップに従います。 1. Xcode で、**File (ファイル)** > **Add Package Dependencies… (パッケージ依存関係を追加)** を選択し、リポジトリー URL として `https://github.com/stripe/stripe-ios-spm` を入力します。 1. [リリースページ](https://github.com/stripe/stripe-ios/releases)から最新のバージョン番号を選択します。 1. **StripePaymentsUI** 製品を[アプリのターゲット](https://developer.apple.com/documentation/swift_packages/adding_package_dependencies_to_your_app)に追加します。 #### CocoaPods 1. まだインストールしていない場合は、[CocoaPods](https://guides.cocoapods.org/using/getting-started.html) の最新バージョンをインストールします。 1. 既存の [Podfile](https://guides.cocoapods.org/syntax/podfile.html) がない場合は、以下のコマンドを実行して作成します。 ```bash pod init ``` 1. この行を `Podfile` に追加します。 ```podfile pod 'StripePaymentsUI' ``` 1. 以下のコマンドを実行します。 ```bash pod install ``` 1. これ以降は、Xcode でプロジェクトを開く際に、`.xcodeproj` ファイルではなく、必ず `.xcworkspace` ファイルを使用するということを忘れないでください。 1. 今後、SDK の最新バージョンに更新するには、以下を実行します。 ```bash pod update StripePaymentsUI ``` #### Carthage 1. まだインストールしていない場合は、[Carthage](https://github.com/Carthage/Carthage#installing-carthage) の最新バージョンをインストールします。 1. この行を `Cartfile` に追加します。 ```cartfile github "stripe/stripe-ios" ``` 1. [Carthage のインストール手順](https://github.com/Carthage/Carthage#if-youre-building-for-ios-tvos-or-watchos)に従います。必ず、[こちら](https://github.com/stripe/stripe-ios/tree/master/StripePaymentsUI/README.md#manual-linking)にリストされている必要なフレームワークのすべてを埋め込んでください。 1. 今後、SDK の最新バージョンに更新するには、以下のコマンドを実行します。 ```bash carthage update stripe-ios --platform ios ``` #### 手動のフレームワーク 1. Stripe の [GitHub リリースページ](https://github.com/stripe/stripe-ios/releases/latest)に移動して、**Stripe.xcframework.zip** をダウンロードして解凍します。 1. **StripePaymentsUI.xcframework** を、Xcode プロジェクトの **General (一般) ** 設定の **Embedded Binaries (埋め込みバイナリー)** セクションにドラッグします。**Copy items if needed (必要に応じてアイテムをコピーする)** を必ず選択してください。 1. [こちら](https://github.com/stripe/stripe-ios/tree/master/StripePaymentsUI/README.md#manual-linking)にリストされている必要なフレームワークのすべてに対して、ステップ 2 を繰り返します。 1. 今後、Stripe の SDK の最新バージョンに更新するには、ステップ 1 から 3 を繰り返します。 > SDK の最新リリースおよび過去バージョンの詳細については、GitHub の [Releases (リリース)](https://github.com/stripe/stripe-ios/releases) ページをご覧ください。リポジトリの[リリースをウォッチ](https://help.github.com/en/articles/watching-and-unwatching-releases-for-a-repository#watching-releases-for-a-repository)して、新しいリリースの公開時に通知を受け取ることも可能です。 アプリの起動時に Stripe [公開可能キー](https://dashboard.stripe.com/test/apikeys)を使用して SDK を設定します。これにより、アプリが Stripe API にリクエストを送信できるようになります。 #### Swift ```swift import UIKitimportStripePaymentsUI @main class AppDelegate: UIResponder, UIApplicationDelegate { func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {StripeAPI.defaultPublishableKey = "<>" // do any other necessary launch configuration return true } } ``` > テストおよび開発時には[テストキー](https://docs.stripe.com/keys.md#obtain-api-keys)を使用し、アプリの公開時には[本番環境](https://docs.stripe.com/keys.md#test-live-modes)キーを使用します。 ## Customer を作成または取得する [サーバー側] 以降の支払いに BECS ダイレクトデビットの口座を再利用するには、その口座を *Customer* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments) に関連付ける必要があります。 お客様のビジネスで顧客がアカウントを作成する際、Customer オブジェクトを作成します。この Customer オブジェクトの ID を、顧客を表す独自の内部表記と関連付けることで、保存されている支払い方法の詳細を後で取得して使用することができます。 新しい Customer を作成するか、または既存の Customer を取得して、この支払いに関連付けます。サーバに以下のコードを含め、新しい Customer を作成します。 ```curl curl -X POST https://api.stripe.com/v1/customers \ -u "<>:" ``` ## 支払い方法の詳細と同意書承認を収集する [クライアント側] SDK により提供されるドロップイン UI コンポーネントである [STPAUBECSFormView](https://stripe.dev/stripe-ios/stripe-payments-ui/Classes/STPAUBECSDebitFormView.html) を使用して、BECS デビットの支払い情報を安全に収集できます。`STPAUBECSFormView​` は、[BECS ダイレクトデビット規約](https://stripe.com/au-becs/legal)の表示に加えて、顧客が氏名、メールアドレス、BSB 番号、および口座番号を入力するための UI を提供します。 会社名を使用して設定される `STPAUBECSFormView` のインスタンスを作成し、SDK のデリゲートを設定して、`STPPaymentMethodParams` のインスタンスの作成に必要な詳細を顧客が入力した後で通知するようにします。 `STPAUBECSFormView's` パブリックプロパティに値を指定して、アプリのデザインと雰囲気に合うように `STPAUBECSFormView` をカスタマイズすることもできます。 #### Swift ```swift import UIKit import StripePaymentsUI class CheckoutViewController: UIViewController { private var becsFormView = STPAUBECSDebitFormView(companyName: "Example Company Inc.") private let saveButton = UIButton() private var setupIntentClientSecret: String? override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .secondarySystemBackground saveButton.layer.cornerRadius = 5 saveButton.contentEdgeInsets = UIEdgeInsets(top: 4, left: 8, bottom: 4, right: 8) saveButton.backgroundColor = .systemGray3 saveButton.titleLabel?.font = UIFont.systemFont(ofSize: 18) saveButton.setTitle("Save", for: .normal) saveButton.addTarget(self, action: #selector(save), for: .touchUpInside) saveButton.isEnabled = false saveButton.translatesAutoresizingMaskIntoConstraints = false view.addSubview(saveButton) becsFormView.becsDebitFormDelegate = self becsFormView.translatesAutoresizingMaskIntoConstraints = false view.addSubview(becsFormView) NSLayoutConstraint.activate([ becsFormView.leadingAnchor.constraint(equalTo: view.leadingAnchor), view.trailingAnchor.constraint(equalTo: becsFormView.trailingAnchor), becsFormView.topAnchor.constraint(equalToSystemSpacingBelow: view.safeAreaLayoutGuide.topAnchor, multiplier: 2), saveButton.centerXAnchor.constraint(equalTo: view.centerXAnchor), saveButton.topAnchor.constraint(equalToSystemSpacingBelow: becsFormView.bottomAnchor, multiplier: 2), ]) } @objc func save() { // ... } } extension CheckoutViewController: STPAUBECSDebitFormViewDelegate { func auBECSDebitForm(_ form: STPAUBECSDebitFormView, didChangeToStateComplete complete: Bool) { saveButton.isEnabled = complete saveButton.backgroundColor = complete ? .systemBlue : .systemGray3 } } ``` ## SetupIntent を作成する [サーバー側] [SetupIntent (支払い方法設定インテント)](https://docs.stripe.com/api/setup_intents.md) は、今後の支払いのために顧客の決済手段をセットアップするお客様の意図を表すオブジェクトです。`SetupIntent` は、この設定プロセスのステップを追跡します。BECS ダイレクトデビットの場合、このステップには顧客からの同意書の収集と、ライフサイクル全体にわたる同意書の有効性の追跡が含まれます。 [payment_method_types](https://docs.stripe.com/api/setup_intents/create.md#create_setup_intent-payment_method_types) を `au_becs_debit` に設定してサーバーに [SetupIntent (支払い方法設定インテント)](https://docs.stripe.com/api/setup_intents.md) を作成し、*Customer* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments) の [id](https://docs.stripe.com/api/customers/object.md#customer_object-id) を指定します。 #### curl ```bash curl https://api.stripe.com/v1/setup_intents \ -u <>: \ -d "payment_method_types[]"="au_becs_debit" \ -d "customer"="{{CUSTOMER_ID}}" ``` サーバで `SetupIntent` を作成した後、アプリケーションのデータモデルで現在のセッションの顧客に `SetupIntent` ID を関連付けることができます。これを行うと、決済手段の収集に成功した後で情報を取得できます。 返される `SetupIntent` オブジェクトには、`client_secret` プロパティが含まれています。この client secret をクライアント側のアプリケーションに渡して、設定プロセスを続行します。 ## Stripe に支払い方法の詳細を送信する [クライアント側] ユーザが支払い詳細を入力したら、`SetupIntent` を確定して引き落とし情報の保存を完了します。 まず、以下を使用して STPSetupIntentConfirmParams オブジェクトを作成します。 1. [STPAUBECSFormView の](https://stripe.dev/stripe-ios/stripe-payments-ui/Classes/STPAUBECSDebitFormView.html) `paymentMethodParams` プロパティ 1. サーバから取得した `SetupIntent` client secret `SetupIntent` オブジェクト全体をクライアントに送信するのではなく、[ステップ 4](https://docs.stripe.com/payments/au-becs-debit/set-up-payment.md#ios-create-setup-intent) で取得した [client secret](https://docs.stripe.com/api/setup_intents/object.md#setup_intent_object-client_secret) を使用します。これは、Stripe API リクエストを認証する API キーとは異なります。 client secret は設定を完了できるため、慎重に取り扱う必要があります。ログに記録したり、URL に埋め込んだり、当該の顧客以外に公開したりしないでください。 次に、[STPPaymentHandler confirmSetupIntent](https://stripe.dev/stripe-ios/stripe-payments/Classes/STPPaymentHandler.html#/c:objc\(cs\)STPPaymentHandler\(im\)confirmSetupIntent:withAuthenticationContext:completion:) メソッドを呼び出して支払いを完了します。 [customer](https://docs.stripe.com/api/setup_intents/create.md#create_setup_intent-customer) が設定されているため、セットアップが成功すると、*PaymentMethod* (PaymentMethods represent your customer's payment instruments, used with the Payment Intents or Setup Intents APIs) は指定された *Customer* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments) オブジェクトに関連付けられます。これにより、顧客の決済手段の詳細を求めるプロンプトを表示することなく、格納された PaymentMethod を使用して以降の支払いを回収できます。 #### Swift ```swift import UIKit import StripePaymentsUI class CheckoutViewController: UIViewController { // ... @objc func save() { guard let setupIntentClientSecret = setupIntentClientSecret, let paymentMethodParams = becsFormView.paymentMethodParams else { return; } let setupIntentParams = STPSetupIntentConfirmParams(clientSecret: setupIntentClientSecret) setupIntentParams.paymentMethodParams = paymentMethodParams STPPaymentHandler.shared().confirmSetupIntent(withParams: setupIntentParams, authenticationContext: self) { (handlerStatus, setupIntent, error) in switch (handlerStatus) { case .failed: // Setup failed break case .canceled: // Setup canceled break case .succeeded: // Setup succeeded break @unknown default: fatalError() break } } } } extension CheckoutViewController: STPAuthenticationContext { func authenticationPresentingViewController() -> UIViewController { return self } } ``` `SetupIntent` を確定した後、[Mandate (同意書) オブジェクト](https://docs.stripe.com/api/mandates.md)から取得した[同意書の URL](https://docs.stripe.com/api/mandates/object.md#mandate_object-payment_method_details-au_becs_debit-url) を顧客に伝える必要があります。また顧客に同意書が確定したことを伝える際には、下記の詳細情報を含めることを推奨します。 - ダイレクトデビットの準備が整ったことを示す明確な確認メッセージ - 口座から引き落とされるときに顧客の銀行明細書に表示される[ビジネス名](https://docs.stripe.com/payments/au-becs-debit/accept-a-payment.md) - 支払い金額とスケジュール (該当する場合) - 生成された DDR 同意書 URL へのリンク `Mandate​` オブジェクトの ID は、[SetupIntent (支払い方法設定インテント) オブジェクト](https://docs.stripe.com/api/setup_intents/object.md#setup_intent_object-mandate) (確定後に送信される `setup_intent.succeeded` イベントに含まれる) の `mandate` からアクセスできますが、[API から取得](https://docs.stripe.com/api/setup_intents/retrieve.md)することもできます。 ## 構築したシステムをテストする テスト用の BSB 番号 `000000` と、以下のいずれかのテスト用口座番号を、[STPPaymentHandler confirmSetupIntent](https://stripe.dev/stripe-ios/stripe-payments/Classes/STPPaymentHandler.html#/c:objc\(cs\)STPPaymentHandler\(im\)confirmSetupIntent:withAuthenticationContext:completion:) メソッドの呼び出しで使用することにより、フォームをテストできます。 | BSB 番号 | 口座番号 | 説明 | | -------- | ----------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `000000` | `000123456` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `succeeded` に変わります。同意書のステータスは引き続き `active` です。 | | `000000` | `900123456` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `succeeded` に変わります (3 分の遅延あり)。同意書のステータスは引き続き `active` です。 | | `000000` | `111111113` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`account_closed` エラーコードが返されます。同意書のステータスはその時点で `inactive` になります。 | | `000000` | `111111116` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`no_account` エラーコードが返されます。同意書のステータスはその時点で `inactive` になります。 | | `000000` | `222222227` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`refer_to_customer` エラーコードが返されます。同意書のステータスは引き続き `active` です。 | | `000000` | `922222227` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`refer_to_customer` エラーコードが返されます (3 分の遅延あり)。同意書のステータスは引き続き `active` です。 | | `000000` | `333333335` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `requires_payment_method` に変わり、`debit_not_authorized` エラーコードが返されます。同意書のステータスはその時点で `inactive` になります。 | | `000000` | `666666660` | 生成された PaymentMethod で作成された PaymentIntent は、`processing` から `succeeded` に変わりますが、不審請求の申請が直ちに作成されます。 | | `000000` | `343434343` | 結果として生じる PaymentMethod により作成された PaymentIntent は、支払い金額が原因でアカウントの週次支払い金額の上限を超えてしまうため、`charge_exceeds_source_limit` エラーで失敗します。 | | `000000` | `121212121` | 結果として生じる PaymentMethod により作成された PaymentIntent は、支払い金額がアカウントの取引金額の上限を超えているため、`charge_exceeds_transaction_limit` エラーで失敗します。 | # Android > This is a Android for when payment-ui is mobile and platform is android. View the full page at https://docs.stripe.com/payments/au-becs-debit/set-up-payment?payment-ui=mobile&platform=android. BECS 支払いの詳細を収集するための事前構築された Stripe の UI である [BecsDebitWidget](https://stripe.dev/stripe-android/payments-core/com.stripe.android.view/-becs-debit-widget/index.html) を使用して、機密データを扱うことなく銀行口座の詳細を安全に収集できる決済フォームを作成します。[Setup Intents API](https://docs.stripe.com/payments/setup-intents.md) を使用して、事前に BECS ダイレクトデビットの決済手段の詳細を収集し、後から最終的な金額や支払い日を決定できます。この機能は以下の目的に利用できます。 - 支払い方法をウォレットに保存して、以降の購入を効率化する - サービスの提供後に追加料金を回収する - [サブスクリプションの無料トライアルを開始する](https://docs.stripe.com/billing/subscriptions/trials.md) ## Stripe を設定する [サーバ側] [クライアント側] まず、Stripe アカウントが必要です。[今すぐ登録](https://dashboard.stripe.com/register)してください。 ### サーバ側 この組み込みには、サーバ上に Stripe API と通信するエンドポイントが必要です。サーバから Stripe API にアクセスするには、Stripe の公式ライブラリを使用します。 #### Ruby ```bash # Available as a gem sudo gem install stripe ``` ```ruby # If you use bundler, you can add this line to your Gemfile gem 'stripe' ``` ### クライアント側 [Stripe Android SDK](https://github.com/stripe/stripe-android) はオープンソースであり、[詳細なドキュメントが提供されています](https://stripe.dev/stripe-android/)。 SDK をインストールするには、[app/build.gradle](https://developer.android.com/studio/build/dependencies) ファイルの `dependencies` ブロックに `stripe-android` を追加します。 #### Kotlin ```kotlin plugins { id("com.android.application") } android { ... } dependencies { // ... // Stripe Android SDK implementation("com.stripe:stripe-android:23.2.0") // Include the financial connections SDK to support US bank account as a payment method implementation("com.stripe:financial-connections:23.2.0") } ``` > SDK の最新リリースおよび過去バージョンの詳細については、GitHub の [Releases](https://github.com/stripe/stripe-android/releases) ページをご覧ください。新しいリリースの公開時に通知を受け取るには、[リポジトリのリリースを確認](https://docs.github.com/en/github/managing-subscriptions-and-notifications-on-github/configuring-notifications#configuring-your-watch-settings-for-an-individual-repository)してください。 Stripe の[公開可能キー](https://dashboard.stripe.com/apikeys)を使用して SDK を設定し、 `Application` サブクラスなどで、Stripe API へのリクエストを実行できるようにします。 #### Kotlin ```kotlin import com.stripe.android.PaymentConfiguration class MyApp : Application() { override fun onCreate() { super.onCreate() PaymentConfiguration.init( applicationContext, "<>" ) } } ``` > テストおよび開発時には[テストキー](https://docs.stripe.com/keys.md#obtain-api-keys)を使用し、アプリの公開時には[本番環境](https://docs.stripe.com/keys.md#test-live-modes)キーを使用します。 Stripe サンプルでは、サーバへの HTTP リクエストの作成に、[OkHttp](https://github.com/square/okhttp) および [GSON](https://github.com/google/gson) も使用します。 ## Customer を作成または取得する [サーバー側] 以降の支払いに BECS ダイレクトデビットの口座を再利用するには、その口座を *Customer* (Customer objects represent customers of your business. They let you reuse payment methods and give you the ability to track multiple payments) に関連付ける必要があります。 お客様のビジネスで顧客がアカウントを作成する際、Customer オブジェクトを作成します。この Customer オブジェクトの ID を、顧客を表す独自の内部表記と関連付けることで、保存されている支払い方法の詳細を後で取得して使用することができます。 新しい Customer を作成するか、または既存の Customer を取得して、この支払いに関連付けます。サーバに以下のコードを含め、新しい Customer を作成します。 ```curl curl -X POST https://api.stripe.com/v1/customers \ -u "<>:" ``` ## 支払い方法の詳細と同意書承認を収集する [クライアント側] SDK が提供するドロップイン UI コンポーネント、[BecsDebitWidget](https://stripe.dev/stripe-android/payments-core/com.stripe.android.view/-becs-debit-widget/index.html) を使用して、BECS デビットの支払い情報を安全に収集できます。`BecsDebitWidget` は、顧客が氏名、メールアドレス、BSB 番号、および口座番号を入力するための UI を提供します。また、[BECS ダイレクトデビット利用規約](https://stripe.com/au-becs/legal)も表示します。 ### BecsDebitWidget をレイアウトに追加する レイアウトに `BecsDebitWidget` を追加し、会社名を `app:companyName` 属性に設定します。 ```xml