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

メモ

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

設定で支払い方法を管理する

支払い方法設定シートを使用して、顧客がアプリの設定ページで支払い方法を管理できるようにします。

メモ

支払い方法設定シートは、アプリの設定ページで使用するためのものです。チェックアウトと支払いには、アプリ内支払い を使用してください。は、支払い方法の保存と表示にも対応しており、支払い方法設定シートよりも多くの支払い方法をサポートしています。

メモ

コードでは、このコンポーネントは歴史的な理由からCustomerSheet として参照されます。ドキュメント全体を通して、コード例でCustomerSheet と記載されている場合、これは支払い方法設定シートを指します。

支払い方法設定シートは、顧客が保存した支払い方法を管理できるようにする組み込み済みの UI コンポーネントです。決済フローの外側で支払い方法設定シートの UI を使用することができ、外観とスタイルはアプリの外観と美観に合わせてカスタマイズ可能です。顧客は支払い方法の追加と削除ができ、顧客オブジェクトに保存され、デバイスにローカルに保存されたデフォルトの支払い方法を設定できます。アプリ内支払いと支払い方法設定シートの両方を使用して、顧客に保存された支払い方法の一貫したエンドツーエンドのソリューションを提供します。

iOS アプリに保存された複数の支払い方法を提示する支払い方法設定シートのスクリーンショット。

CustomerSession オブジェクトは、SDK に Customer への一時的なアクセス権を付与し、追加の設定オプションを提供します。これらの設定オプションを使用すると、CustomerSheet の動作をカスタマイズできます。 CustomerSession で公開される機能の一覧は、Stripe の APIドキュメント に記載されています。

Stripe を設定する

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

Stripe iOS SDK はオープンソースです。詳細なドキュメントが提供されており、iOS 13 以降をサポートするアプリと互換性があります。

SDK をインストールするには、以下のステップに従います。

  1. Xcode で、File (ファイル) > Add Package Dependencies… (パッケージ依存関係を追加) を選択し、リポジトリー URL として https://github.com/stripe/stripe-ios-spm を入力します。
  2. リリースページから最新のバージョン番号を選択します。
  3. StripePaymentSheet 製品をアプリのターゲットに追加します。

メモ

SDK の最新リリースおよび過去バージョンの詳細については、GitHub の Releases (リリース) ページをご覧ください。リポジトリのリリースをウォッチして、新しいリリースの公開時に通知を受け取ることも可能です。

アプリの起動時に Stripe 公開可能キーを使用して SDK を設定します。これにより、アプリが Stripe API にリクエストを送信できるようになります。

AppDelegate.swift
Swift
No results
import UIKit
import StripePaymentSheet

@main
class AppDelegate: UIResponder, UIApplicationDelegate {

    func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool {
        StripeAPI.defaultPublishableKey = 
"pk_test_TYooMQauvdEDq54NiTphI7jx"

        // do any other necessary launch configuration
        return true
    }
}

メモ

テストおよび開発時にはテストキーを使用し、アプリの公開時には本番環境キーを使用します。

支払い方法を有効にする

支払い方法の設定を表示して、サポートする支払い方法を有効にします。SetupIntent を作成するには、少なくとも 1 つは支払い方法を有効にする必要があります。

多くの顧客から決済を受け付けられるよう、Stripe では、カードやその他一般的な決済手段がデフォルトで有効になっていますが、ビジネスや顧客に適した追加の決済手段を有効にすることをお勧めします。プロダクトと決済手段のサポートについては決済手段のサポートを、手数料については料金体系ページをご覧ください。

メモ

CustomerSheet は、カード、アメリカの銀行口座、SEPA ダイレクトデビットのみに対応しています。

Customer エンドポイントを追加する
サーバー側

サーバー側で、CustomerSession の client secret を取得するエンドポイントと、新しい決済手段を Customer に保存する SetupIntent を作成するエンドポイントの 2 つのエンドポイントを作成します。

  1. Customer ID と CustomerSession の client secret を返すエンドポイントを作成します。
Command Line
curl
Ruby
Python
PHP
Node.js
Java
No results
# Create a Customer (skip this and get the existing Customer ID if this is a returning customer)
curl https://api.stripe.com/v1/customers \
  -u 
sk_test_BQokikJOvBiI2HlWgH4olfQ2
: \
  -X "POST"

curl https://api.stripe.com/v1/customer_sessions \
  -u 
sk_test_BQokikJOvBiI2HlWgH4olfQ2
: \
  -X "POST" \
  -d "customer"="{{CUSTOMER_ID}}" \
  -d "components[customer_sheet][enabled]"=true \
  -d "components[customer_sheet][features][payment_method_remove]"=enabled

メモ

レガシーの顧客の一時キーを使用した実装では、保存された決済手段の allow_redisplay 値が unspecified になります。Customer Sessions の使用時に保存した決済手段に加えて、これらの決済手段を表示するには、payment_method_allow_redisplay_filters を ["unspecified", "always"] に設定します。詳細については、CustomerSessions をご覧ください。

  1. Customer ID を指定して設定された SetupIntent を返すエンドポイントを作成します。
Command Line
curl
Ruby
Python
PHP
Node.js
Java
No results
# Create a Customer (skip this and get the existing Customer ID if this is a returning customer)
curl https://api.stripe.com/v1/customers \
  -u 
sk_test_BQokikJOvBiI2HlWgH4olfQ2
: \
  -X "POST"

curl https://api.stripe.com/v1/setup_intents \
  -u 
sk_test_BQokikJOvBiI2HlWgH4olfQ2
: \
  -d "customer"="{{CUSTOMER_ID}}" \

今後の支払いで、顧客が決済フローでオンセッション時にのみ決済手段を使用する場合、usage パラメーターを on_session に設定して、オーソリ率を改善します。

画面を設定する

次に、IntentConfiguration、CustomerSessionClientSecretProvider、CustomerSheet.Configuration を持つCustomerSheet クラスを使用して支払い方法設定シートを構成します。

var configuration = CustomerSheet.Configuration()

// Configure settings for the CustomerSheet here. For example:
configuration.headerTextForSelectionScreen = "Manage your payment method"

let intentConfiguration = CustomerSheet.IntentConfiguration(setupIntentClientSecretProvider: {
  let json = try await myBackend.createSetupIntent()
  return json["setupIntentClientSecret"]!
})

let customerSheet = CustomerSheet(
      configuration: configuration,
      intentConfiguration: intentConfiguration,
      customerSessionClientSecretProvider: {
        let json = try await myBackend.createCustomerSessionClientSecret()
        return .init(customerId: json["customerId"]!, clientSecret: json["customerSessionClientSecret"]!)
      })

支払い画面を表示する

CustomerSheet を使用して支払い方法設定シートを提示します。顧客がシートを閉じると、CustomerSheet はCustomerSheet.SheetResult で完了ブロックを呼び出します。

import StripePaymentSheet

customerSheet.present(from: self, completion: { result in
  switch result {
  case .canceled(let paymentOption), .selected(let paymentOption):
    // Configure your UI based on the payment option
    self.paymentLabel.text = paymentOption?.displayData().label ?? "None"

    // Optional: Send the selected payment method ID to your backend for advanced use cases
    // like charging a customer when not present in your app
    if let paymentOption = paymentOption {
      switch paymentOption {
      case .paymentMethod(let paymentMethod, let paymentOptionDisplayData):
        MyBackend.setDefaultPaymentMethod(paymentMethod.stripeId)
      case .applePay(paymentOptionDisplayData: let paymentOptionDisplayData):
        MyBackend.setDefaultPaymentMethodIsApplePay()
      }
    }
  case .error(let error):
    // Show the error in your UI
  }
})
  • 顧客が決済手段を選択する場合、その結果は .selected(PaymentOptionSelection?) になります。関連付けられる値は、選択した PaymentOptionSelection になり、ユーザーが過去に選択した決済手段を削除した場合は nil になります。決済手段の詳細は、PaymentOptionSelection の paymentMethod の関連値で確認できます。
  • ユーザーが画面をキャンセルした場合、その結果は .canceled になります。関連付けられる値は、Customer Sheet を開く前に選択された元の決済手段です (その決済手段がまだ利用可能な場合)。
  • エラーが発生した場合、その結果は .error(Error) になります。

詳しくは、Apple Pay を有効にする方法をご確認ください。

オプションACH 決済を有効にする

ACH デビット支払いを有効にするには、以下を行います。

  1. アプリの依存関係として StripeFinancialConnections を含めます。
  2. ダッシュボードの設定セクションで、支払い方法としてアメリカの銀行口座を有効化します。

オプション選択した支払い方法を取得する

支払い方法設定シートを表示せずにデフォルトの支払い方法を取得するには、CustomerSheet でretrievePaymentOptionSelection() を呼び出します。

let paymentMethodOption = try await customerSheet.retrievePaymentOptionSelection()

// Configure your UI based on the payment option
self.paymentLabel.text = paymentOption?.displayData().label ?? "None"

// Send the selected payment method ID to your backend
switch paymentOption {
case .paymentMethod(paymentMethod: let paymentMethod, paymentOptionDisplayData: let paymentOptionDisplayData):
    try await MyBackend.setDefaultPaymentMethod(paymentMethod.stripeId)
case .applePay(paymentOptionDisplayData: let paymentOptionDisplayData):
    try await MyBackend.setDefaultPaymentMethodIsApplePay()
}

オプション画面をカスタマイズする

デザイン

Appearance API を使用して、アプリのデザインに合わせて色、フォント、その他のデザインの属性をカスタマイズします。

メモ

fetchPaymentMethods は、保存された決済手段を除外して表示しないようにできますが、追加可能な決済手段のタイプには影響しません。

デフォルトの請求詳細

支払い画面で収集される請求詳細のデフォルト値を設定するには、defaultBillingDetails プロパティを設定します。CustomerSheet の各フィールドに、指定した値が事前に読み込まれます。

var configuration = CustomerSheet.Configuration()
configuration.defaultBillingDetails.address.country = "US"
configuration.defaultBillingDetails.email = "foo@bar.com"

請求詳細の収集

billingDetailsCollectionConfiguration を使用して、決済画面で請求詳細を収集する方法を指定します。

顧客の名前、メールアドレス、電話番号、住所を収集できます。

CustomerSheet によって収集されない値を関連付けるには、defaultBillingDetails プロパティに値を追加し、billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod を true に設定します。決済手段が必要とする値を収集する予定がない場合は、必ずこの手順を実行してください。

var configuration = CustomerSheet.Configuration()
configuration.defaultBillingDetails.email = "foo@bar.com"
configuration.billingDetailsCollectionConfiguration.name = .always
configuration.billingDetailsCollectionConfiguration.email = .never
configuration.billingDetailsCollectionConfiguration.address = .full
configuration.billingDetailsCollectionConfiguration.attachDefaultsToPaymentMethod = true

メモ

情報の収集に適用される法律については、法務チームに相談してください。電話番号は、取引に必要な場合にのみ収集してください。