# PayTo 支払い

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

PayTo は、オーストラリアで使用されているリアルタイムの決済手段です。1 回限りの決済と継続課金を受け付けることができます。PayTo で決済する場合、顧客はモバイルバンキングアプリまたはオンラインバンキングを使用して、同意書を[認証し、承認](https://docs.stripe.com/payments/payment-methods.md#customer-actions)します。

決済が成功したか失敗したかについては、[遅延通知](https://docs.stripe.com/payments/payment-methods.md#payment-notification)を受け取ります。Stripe は通常、同意書の承認から 60 秒以内に決済の最終ステータスに関する通知を送信します。

# Checkout

> This is a Checkout for when payment-ui is checkout. View the full page at https://docs.stripe.com/payments/payto/accept-a-payment?payment-ui=checkout.

> Stripe は、通貨、支払い方法の制限、その他のパラメーターを評価することで、適切な支払い方法を顧客に自動的に提示できます。
> 
> - [決済の受け付け](https://docs.stripe.com/payments/accept-a-payment.md?payment-ui=checkout&ui=stripe-hosted)ガイドに従って、[動的な決済手段](https://docs.stripe.com/payments/payment-methods/dynamic-payment-methods.md)を使用するチェックアウトの統合機能を構築します。
- 動的な決済手段を使用しない場合は、チェックアウトの導入で、決済方法を手動で設定するために以下のステップに従ってください。

## 互換性を判断する

**顧客の居住地**: Australia

**対応可能な通貨**: `aud`

**取引通貨**: `aud`

**支払いモード**: Yes

**セットアップモード**: Yes

**サブスクリプションモード**: Yes

Checkout で PayTo 支払いをサポートするには、すべての明細項目の *価格* (Prices define how much and how often to charge for products. This includes how much the product costs, what currency to use, and the interval if the price is for subscriptions) を AUD (通貨コード `aud`) で指定してください。

## 決済の受け付け

> このガイドは、基本的な [支払い受け付け](https://docs.stripe.com/payments/accept-a-payment.md?ui=stripe-hosted) Checkoutの導入を基盤としています。

Payto を支払い方法として有効にするには、新しい [Checkout セッション](https://docs.stripe.com/api/checkout/sessions.md) を作成してください。

1. `payto` を `payment_method_types` のリストに追加します。
1. すべての `line_items`が `aud` 通貨を使用していることを確認します。

#### Stripe ホスト型ページ

```curl
curl https://api.stripe.com/v1/checkout/sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "line_items[0][price_data][currency]"=aud \
  -d "line_items[0][price_data][product_data][name]"=T-shirt \
  -d "line_items[0][price_data][unit_amount]"=2000 \
  -d "line_items[0][quantity]"=1 \
  -d mode=payment \
  -d "payment_method_types[0]"=card \
  -d "payment_method_types[1]"=payto \
  --data-urlencode success_url="https://example.com/success"
```

#### 組み込みフォーム

```curl
curl https://api.stripe.com/v1/checkout/sessions \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d "line_items[0][price_data][currency]"=aud \
  -d "line_items[0][price_data][product_data][name]"=T-shirt \
  -d "line_items[0][price_data][unit_amount]"=2000 \
  -d "line_items[0][quantity]"=1 \
  -d mode=payment \
  -d "payment_method_types[0]"=card \
  -d "payment_method_types[1]"=payto \
  --data-urlencode return_url="https://example.com/return" \
  -d ui_mode=embedded
```

### 注文のフルフィルメント

決済受け付け後に、[注文のフルフィルメントを実行](https://docs.stripe.com/checkout/fulfillment.md)する方法を説明します。

## 実装内容をテストする

以下のさまざまなテスト用 PayID と銀行口座情報を使用して、テスト API キーで PayTo の実装内容をテストします。各セットによって、本番環境でシステムが直面する各種シナリオが再現されています。

#### PayID

| PayID                                                    | 説明                                                                                                                                                                                                 |
| -------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `{any_prefix}+succeed@{any_domain}`                      | PaymentIntent のステータスは、10 秒後に `requires_action` から `processing` に移行し、さらに 5 秒後に `succeeded` に移行します。                                                                                                  |
| `{any_prefix}+decline@{any_domain}`                      | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `invalid_authorization` 拒否コードを返します。                          |
| `{any_prefix}+expire@{any_domain}`                       | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_timeout` エラーコードと `generic_decline` 支払いの失敗コードを返します。                            |
| `{any_prefix}+insufficient_funds@{any_domain}`           | PaymentIntent のステータスは、10 秒後に　`requires_action` から `processing` に移行し、さらに 5 秒後に `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `insufficient_funds` 拒否コードを返します。 |
| `{any_prefix}+agreement_type_not_supported@{any_domain}` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードを返します。同意書のステータスは `inactive` になります。                             |

#### 口座番号 + BSB 番号

| BSB 番号   | 口座番号        | 説明                                                                                                                                                                                                 |
| -------- | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `000000` | `000123456` | PaymentIntent のステータスは、10 秒後に `requires_action` から `processing` に移行し、さらに 5 秒後に `succeeded` に移行します。                                                                                                  |
| `000000` | `333333335` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `invalid_authorization` 拒否コードを返します。                          |
| `000000` | `333333337` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_timeout` エラーコードと `generic_decline` 支払いの失敗コードを返します。                            |
| `000000` | `222222227` | PaymentIntent のステータスは、10 秒後に　`requires_action` から `processing` に移行し、さらに 5 秒後に `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `insufficient_funds` 拒否コードを返します。 |
| `000000` | `666666667` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードを返します。同意書のステータスは `inactive` になります。                             |


# Elements

> This is a Elements for when payment-ui is elements. View the full page at https://docs.stripe.com/payments/payto/accept-a-payment?payment-ui=elements.

## 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'
```

## PaymentIntent を作成する [サーバー側]

[PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) は、顧客から支払いを回収する意図を表すオブジェクトであり、支払いプロセスを追跡します。PayTo による決済手段を受け付ける `PaymentIntent` を作成するには、回収する金額、通貨として `aud`、[payment_method_types](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) リストで `payto` を指定します。`PaymentIntent` の作成時に渡す決済手段リストを保持している場合は、それに `payto` を追加します。

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1000 \
  -d currency=aud \
  -d "payment_method_types[]"=payto
```

### client secret を取得する

PaymentIntent には、*client secret* (The client secret is a unique key returned from Stripe as part of a PaymentIntent. This key lets the client access important fields from the PaymentIntent (status, amount, currency) while hiding sensitive ones (metadata, customer)) が含まれています。これは、支払いプロセスを安全に完了するためにクライアント側で使用されます。client secret をクライアント側に渡す際は、いくつかの方法を使用できます。

#### 1 ページのアプリケーション

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

#### Ruby

```ruby
get '/secret' do
  intent = # ... Create or retrieve the PaymentIntent
  {client_secret: intent.client_secret}.to_json
end
```

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

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

#### サーバ側のレンダリング

サーバーからクライアントに client secret を渡します。この方法は、アプリケーションがブラウザーへの送信前に静的なコンテンツをサーバーで生成する場合に最適です。

決済フォームに [client_secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) を追加します。サーバー側のコードで、PaymentIntent から client secret を取得します。

#### Ruby

```erb
<form id="payment-form" data-secret="<%= @intent.client_secret %>">
  <button id="submit">Submit</button>
</form>
```

```ruby
get '/checkout' do
  @intent = # ... Fetch or create the PaymentIntent
  erb :checkout
end
```

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

[Payment Element](https://docs.stripe.com/payments/payment-element.md) を使用してクライアント側で支払い詳細を収集します。Payment Element は事前構築された UI コンポーネントであり、さまざまな決済手段の詳細の収集をシンプルにします。

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

iframe を使用して Apple Pay または Google Pay を受け付けたい場合は、iframe の [allow](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe#attr-allowpaymentrequest) 属性を `"payment *"` と等しく設定する必要があります。

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

#### HTML + JS

### Stripe.js を設定する

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

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

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

```javascript
// 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('<<YOUR_PUBLISHABLE_KEY>>');
```

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

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

```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](https://docs.stripe.com/js/elements_object/create) インスタンスを作成する際に、前のステップからの [client secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) を `options` に渡します。

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

```javascript
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 stepconst elements = stripe.elements(options);
// Optional: Autofill user's saved payment methods. If the customer's
// email is known when the page is loaded, you can pass the email
// to the linkAuthenticationElement on mount:
//
//   linkAuthenticationElement.mount("#link-authentication-element",  {
//     defaultValues: {
//       email: 'jenny.rosen@example.com',
//     }
//   })

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

```

#### React

### Stripe.js を設定する

次の 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
```

### Elements プロバイダーを支払いページに追加して設定する

Payment Element コンポーネントを使用するには、決済ページコンポーネントを [Elements プロバイダー](https://docs.stripe.com/sdks/stripejs-react.md#elements-provider)でラップします。公開キーを使用して `loadStripe` を呼び出し、返された `Promise` を `Elements` プロバイダーに渡します。加えて、前のステップの [client secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) を `options` にして `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 CheckoutForm from './CheckoutForm';

// Make sure to call `loadStripe` outside of a component’s render to avoid
// recreating the `Stripe` object on every render.
const stripePromise = loadStripe('<<YOUR_PUBLISHABLE_KEY>>');

function App() {
  const options = {
    // passing the client secret obtained in step 3
    clientSecret: '{{CLIENT_SECRET}}',
    // Fully customizable with appearance API.
    appearance: {/*...*/},
  };

  return (
    <Elements stripe={stripePromise} options={options}>
      <CheckoutForm />
    </Elements>
  );
};

ReactDOM.render(<App />, document.getElementById('root'));
```

### Payment Element コンポーネントを追加する

`PaymentElement` コンポーネントを使用して、フォームを構築します。

```jsx
import React from 'react';
import {PaymentElement} from '@stripe/react-stripe-js';

const CheckoutForm = () => {
  return (
    <form>
      // Optional: Autofill user's saved payment methods. If the customer's
      // email is known when the page is loaded, you can pass the email
      // to the linkAuthenticationElement
      //
      // <LinkAuthenticationElement id="link-authentication-element"
        // Prefill the email field like so:
        // options={{defaultValues: {email: 'foo@bar.com'}}}
      // /><PaymentElement />
      <button>Submit</button>
    </form>
  );
};

export default CheckoutForm;
```

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

[stripe.confirmPayment](https://docs.stripe.com/js/payment_intents/confirm_payment) を使用して、Payment Element の詳細を使って支払いを完了します。これにより、購入者にオーソリリクエストが送信されます。

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

#### HTML + JS

```javascript
const form = document.getElementById('payment-form');

form.addEventListener('submit', async (event) => {
  event.preventDefault();
const {error, paymentIntent} = await stripe.confirmPayment({
    //`Elements` instance that was used to create the Payment Element
    elements,
    redirect: 'if_required',
  });

  const message = document.querySelector('#message')
  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)
    message.innerText = error.message;
  } else {
    // This will execute if the confirm request is successful, or if the
    // payment fails asynchronously.
    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;
    }
  }
});
```

#### React

支払いフォームコンポーネントから [stripe.confirmPayment](https://docs.stripe.com/js/payment_intents/confirm_payment) を呼び出すには、[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, {useState} from 'react';
import {useStripe, useElements, PaymentElement} from '@stripe/react-stripe-js';

const CheckoutForm = () => {
  const stripe = useStripe();
  const elements = useElements();

  const [message, setMessage] = useState(null);

  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 {error, paymentIntent} = await stripe.confirmPayment({
      //`Elements` instance that was used to create the Payment Element
      elements,
      redirect: 'if_required',
    });


    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)
      setMessage(error.message);
    } else {
      // This will execute if the confirm request is successful, or if the
      // payment fails asynchronously.
      switch (paymentIntent.status) {
        case 'succeeded':
          setMessage('Success! Payment received.');
          break;

        case 'processing':
          setMessage("Payment processing. We'll update you when payment is received.");
          break;

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

        default:
          setMessage('Something went wrong.');
          break;
      }
    }
  };

  return (
    <form onSubmit={handleSubmit}>
      <PaymentElement />
      <button disabled={!stripe}>Submit</button>
      {/* Show message to your customers */}
      {message && <div>{message}</div>}
    </form>
  )
};

export default CheckoutForm;
```

## 実装内容をテストする

以下のさまざまなテスト用 PayID と銀行口座情報を使用して、テスト API キーで PayTo の実装内容をテストします。各セットによって、本番環境でシステムが直面する各種シナリオが再現されています。

#### PayID

| PayID                                                    | 説明                                                                                                                                                                                                 |
| -------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `{any_prefix}+succeed@{any_domain}`                      | PaymentIntent のステータスは、10 秒後に `requires_action` から `processing` に移行し、さらに 5 秒後に `succeeded` に移行します。                                                                                                  |
| `{any_prefix}+decline@{any_domain}`                      | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `invalid_authorization` 拒否コードを返します。                          |
| `{any_prefix}+expire@{any_domain}`                       | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_timeout` エラーコードと `generic_decline` 支払いの失敗コードを返します。                            |
| `{any_prefix}+insufficient_funds@{any_domain}`           | PaymentIntent のステータスは、10 秒後に　`requires_action` から `processing` に移行し、さらに 5 秒後に `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `insufficient_funds` 拒否コードを返します。 |
| `{any_prefix}+agreement_type_not_supported@{any_domain}` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードを返します。同意書のステータスは `inactive` になります。                             |

#### 口座番号 + BSB 番号

| BSB 番号   | 口座番号        | 説明                                                                                                                                                                                                 |
| -------- | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `000000` | `000123456` | PaymentIntent のステータスは、10 秒後に `requires_action` から `processing` に移行し、さらに 5 秒後に `succeeded` に移行します。                                                                                                  |
| `000000` | `333333335` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `invalid_authorization` 拒否コードを返します。                          |
| `000000` | `333333337` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_timeout` エラーコードと `generic_decline` 支払いの失敗コードを返します。                            |
| `000000` | `222222227` | PaymentIntent のステータスは、10 秒後に　`requires_action` から `processing` に移行し、さらに 5 秒後に `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `insufficient_funds` 拒否コードを返します。 |
| `000000` | `666666667` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードを返します。同意書のステータスは `inactive` になります。                             |

## Optional: 支払い後のイベントを処理する

支払いが完了すると、Stripe は [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded) イベントを送信します。ダッシュボード、カスタム *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests)、またはパートナーソリューションを使用してこれらのイベントを受信し、また、顧客への注文確認メールの送信、データベースでの売上の記録、配送ワークフローの開始などのアクションを実行します。

クライアントからのコールバックを待つのではなく、これらのイベントをリッスンします。クライアント側では、コールバックが実行される前に顧客がブラウザーのウィンドウを閉じたり、アプリを終了したりする可能性があります。また、悪意を持つクライアントがレスポンスを不正操作する恐れもあります。非同期型のイベントをリッスンするよう構築済みのシステムを設定することで、これ以降はより多くの決済手段を簡単に受け付けられるようになります。[サポートされているすべての決済手段の違い](https://stripe.com/payments/payment-methods-guide)をご確認ください。

- **ダッシュボードでイベントを手動で処理する**

  ダッシュボードを使用して、テスト決済を[ダッシュボードで表示](https://dashboard.stripe.com/test/payments)したり、メール領収書を送信したり、入金を処理したり、失敗した決済を再試行したりできます。

- **Custom Webhook を構築する**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **構築済みアプリを導入する**

  パートナーアプリケーションを統合することで、[自動化](https://stripe.partners/?f_category=automation)や[マーケティング/セールス](https://stripe.partners/?f_category=marketing-and-sales)などの一般的なビジネスイベントを処理します。


# ダイレクト API

> This is a ダイレクト API for when payment-ui is direct-api. View the full page at https://docs.stripe.com/payments/payto/accept-a-payment?payment-ui=direct-api.

## 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'
```

## PaymentIntent を作成する [サーバー側]

[PaymentIntent](https://docs.stripe.com/api/payment_intents/object.md) は、顧客から支払いを回収する意図を表すオブジェクトであり、支払いプロセスを追跡します。PayTo による決済手段を受け付ける `PaymentIntent` を作成するには、回収する金額、通貨として `aud`、[payment_method_types](https://docs.stripe.com/api/payment_intents/create.md#create_payment_intent-payment_method_types) リストで `payto` を指定します。`PaymentIntent` の作成時に渡す決済手段リストを保持している場合は、それに `payto` を追加します。

```curl
curl https://api.stripe.com/v1/payment_intents \
  -u "<<YOUR_SECRET_KEY>>:" \
  -d amount=1000 \
  -d currency=aud \
  -d "payment_method_types[]"=payto
```

### client secret を取得する

PaymentIntent には、*client secret* (The client secret is a unique key returned from Stripe as part of a PaymentIntent. This key lets the client access important fields from the PaymentIntent (status, amount, currency) while hiding sensitive ones (metadata, customer)) が含まれています。これは、支払いプロセスを安全に完了するためにクライアント側で使用されます。client secret をクライアント側に渡す際は、いくつかの方法を使用できます。

#### 1 ページのアプリケーション

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

#### Ruby

```ruby
get '/secret' do
  intent = # ... Create or retrieve the PaymentIntent
  {client_secret: intent.client_secret}.to_json
end
```

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

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

#### サーバ側のレンダリング

サーバーからクライアントに client secret を渡します。この方法は、アプリケーションがブラウザーへの送信前に静的なコンテンツをサーバーで生成する場合に最適です。

決済フォームに [client_secret](https://docs.stripe.com/api/payment_intents/object.md#payment_intent_object-client_secret) を追加します。サーバー側のコードで、PaymentIntent から client secret を取得します。

#### Ruby

```erb
<form id="payment-form" data-secret="<%= @intent.client_secret %>">
  <button id="submit">Submit</button>
</form>
```

```ruby
get '/checkout' do
  @intent = # ... Fetch or create the PaymentIntent
  erb :checkout
end
```

## 支払い方法の詳細を収集して支払いを送信する [クライアント側]

支払いを確定するときに、client secret を渡します。

> client secret は PaymentIntent へのアクセスを許可するため、慎重に取り扱う必要があります。記録したり、URL に埋め込んだり、当該の顧客以外に公開されることがないようにしてください。

`stripe.confirmPayToPayment` を使用して、顧客の支払いの承認を開始します。

顧客は支払いリクエストに関する通知を受け取り、バンキングアプリでリクエストを承認または拒否します。

```javascript
// Inititates the payment request notification to the customer
stripe.confirmPayToPayment(
  '{{PAYMENT_INTENT_CLIENT_SECRET}}',
  {
    payment_method: {
      billing_details: {
        // Name is required for all PayTo payments
        name: 'Jenny Rosen',
        // Email is required only for PayID payments, for refund processing
        email: 'jenny@example.com'
      },
      payto: {
        // Either provide a PayID (typically an email or phone number)
        pay_id: 'jenny@example.com'
        // ...or provide bank account details
        account_number: '000123456',
        bsb_number: '000000'
      }
    }
  }
).then(function(result) {
  if (result.error) {
    // Inform the customer that there was an error.
    console.log(result.error.message);
  }
});
```

デフォルトでは、Stripe.js によって PaymentIntent への更新がポーリングされます。`confirmPayToPayment` によって返されるプロミスは、PaymentIntent が `succeeded` ステータスになるか、支払いが失敗して PaymentIntent が `requires_payment_method` ステータスを返した場合に解決します。[PaymentIntent のライフサイクル](https://docs.stripe.com/payments/paymentintents/lifecycle.md)で、このような移行がどのように発生するかについての詳細をご覧ください。

自身でポーリングするには、`handleActions: false` を設定して自動ポーリングを無効にします。

```javascript
stripe.confirmPayToPayment(
  '{{PAYMENT_INTENT_CLIENT_SECRET}}',
  {
    payment_method: {
      payto: {
        account_number: '000123456',
        bsb_number: '000000'
      }
    }
  }
  { handleActions: false } // <---- Like this
)
```

この例では、お客様自ら [PaymentIntents API](https://docs.stripe.com/api/payment_intents/retrieve.md) を呼び出して、PaymentIntent のステータスを取得します。

## 実装内容をテストする

以下のさまざまなテスト用 PayID と銀行口座情報を使用して、テスト API キーで PayTo の実装内容をテストします。各セットによって、本番環境でシステムが直面する各種シナリオが再現されています。

#### PayID

| PayID                                                    | 説明                                                                                                                                                                                                 |
| -------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `{any_prefix}+succeed@{any_domain}`                      | PaymentIntent のステータスは、10 秒後に `requires_action` から `processing` に移行し、さらに 5 秒後に `succeeded` に移行します。                                                                                                  |
| `{any_prefix}+decline@{any_domain}`                      | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `invalid_authorization` 拒否コードを返します。                          |
| `{any_prefix}+expire@{any_domain}`                       | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_timeout` エラーコードと `generic_decline` 支払いの失敗コードを返します。                            |
| `{any_prefix}+insufficient_funds@{any_domain}`           | PaymentIntent のステータスは、10 秒後に　`requires_action` から `processing` に移行し、さらに 5 秒後に `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `insufficient_funds` 拒否コードを返します。 |
| `{any_prefix}+agreement_type_not_supported@{any_domain}` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードを返します。同意書のステータスは `inactive` になります。                             |

#### 口座番号 + BSB 番号

| BSB 番号   | 口座番号        | 説明                                                                                                                                                                                                 |
| -------- | ----------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `000000` | `000123456` | PaymentIntent のステータスは、10 秒後に `requires_action` から `processing` に移行し、さらに 5 秒後に `succeeded` に移行します。                                                                                                  |
| `000000` | `333333335` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `invalid_authorization` 拒否コードを返します。                          |
| `000000` | `333333337` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_timeout` エラーコードと `generic_decline` 支払いの失敗コードを返します。                            |
| `000000` | `222222227` | PaymentIntent のステータスは、10 秒後に　`requires_action` から `processing` に移行し、さらに 5 秒後に `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードと `insufficient_funds` 拒否コードを返します。 |
| `000000` | `666666667` | PaymentIntent のステータスは、10 秒後に `requires_action` から `requires_payment_method` に移行します。Stripe は、`payment_method_provider_decline` エラーコードを返します。同意書のステータスは `inactive` になります。                             |

## Optional: 支払い後のイベントを処理する

支払いが完了すると、Stripe は [payment_intent.succeeded](https://docs.stripe.com/api/events/types.md#event_types-payment_intent.succeeded) イベントを送信します。ダッシュボード、カスタム *Webhook* (A webhook is a real-time push notification sent to your application as a JSON payload through HTTPS requests)、またはパートナーソリューションを使用してこれらのイベントを受信し、また、顧客への注文確認メールの送信、データベースでの売上の記録、配送ワークフローの開始などのアクションを実行します。

クライアントからのコールバックを待つのではなく、これらのイベントをリッスンします。クライアント側では、コールバックが実行される前に顧客がブラウザーのウィンドウを閉じたり、アプリを終了したりする可能性があります。また、悪意を持つクライアントがレスポンスを不正操作する恐れもあります。非同期型のイベントをリッスンするよう構築済みのシステムを設定することで、これ以降はより多くの決済手段を簡単に受け付けられるようになります。[サポートされているすべての決済手段の違い](https://stripe.com/payments/payment-methods-guide)をご確認ください。

- **ダッシュボードでイベントを手動で処理する**

  ダッシュボードを使用して、テスト決済を[ダッシュボードで表示](https://dashboard.stripe.com/test/payments)したり、メール領収書を送信したり、入金を処理したり、失敗した決済を再試行したりできます。

- **Custom Webhook を構築する**

  [Build a custom webhook](https://docs.stripe.com/webhooks/handling-payment-events.md#build-your-own-webhook) handler to listen for events and build custom asynchronous payment flows. Test and debug your webhook integration locally with the Stripe CLI.

- **構築済みアプリを導入する**

  パートナーアプリケーションを統合することで、[自動化](https://stripe.partners/?f_category=automation)や[マーケティング/セールス](https://stripe.partners/?f_category=marketing-and-sales)などの一般的なビジネスイベントを処理します。