リーダーに接続する

タッチ決済を使用すると、ユーザーは、互換性のある NFC 対応 Android デバイスまたは互換性のある iPhone で対面の非接触型決済を受け付けることができます。タッチ決済は、Visa、Mastercard、アメリカン・エキスプレスの非接触型カードと、NFC ベースのモバイルウォレット (Apple Pay、Google Pay、Samsung Pay) に対応しています。iPhone と Android のタッチ決済のサポートは、ネイティブ Terminal SDK に含まれていて、モバイルアプリで直接決済を有効にします。

サポート対象のデバイスでアプリをタッチ決済リーダーに接続するには、次のステップを実行します。

• SDK を使用してリーダーを検出し、デバイスの互換性を確認します。
• SDK を使用してリーダーに接続し、決済を受け付けます。
• 予期しない切断に対処して、リーダーが予期せず切断した場合にもユーザーが引き続き決済を受け付けられるようにします。

export default function DiscoverReadersScreen() {
  const { discoverReaders, discoveredReaders } =
    useStripeTerminal({
      onUpdateDiscoveredReaders: (readers) => {
        // The `readers` variable will contain an array of all the discovered readers.
      },
    });

  useEffect(() => {
    const { error } = await discoverReaders({
      discoveryMethod: 'tapToPay',
    });
  }, [discoverReaders]);

  return <View />;
}

リーダーに接続する

Tap to Pay で決済を受け付けるには、前のステップで検出されたリーダーを connectReader メソッドに指定します。

リーダーを接続する際、場所にリーダーを登録する必要があります。これを行うには、関連付けられているロケーション ID を connectReader に渡します。

iPhone で on_behalf_of を使用してデスティネーション支払い を行う場合、連結アカウント ID も入力する必要があります。

ConnectReaderScreen.tsx

const { reader, error } = await connectReader({
    reader: selectedReader,
    locationId: 
'{{LOCATION_ID}}'
  },
  'tapToPay'
);

if (error) {
  console.log('connectTapToPayReader error:', error);
  return;
}

console.log('Reader connected successfully', reader);

口座の関連付けおよび Apple 利用規約

Apple の iPhoneのタッチ決済の利用規約は、リーダーへの初回連結の際に表示されます。Apple に登録するには、Apple が提供する規約に同意する前に、貴社を表す有効な Apple ID を指定する必要があります。これは、Stripe アカウントごとに 1 回のみ実行する必要があります。アカウントは、他のモバイルデバイスを含む後続の連結においては、このプロセスを繰り返す必要はありません。

それぞれの連結アカウントは、次の場合に利用規約に同意する必要があります。

• Connect ユーザーがダイレクト支払いを作成する
• Connect ユーザーがデスティネーション支払いを作成し、on_behalf_of アカウントを指定する

Apple ID アカウントを関連付けて、タッチ決済による決済を受け付ける

iPhone のタッチ決済で connectReader メソッドを呼び出すと、どの iPhone でも 24 時間以内にアプリ間で最大 3 つの Stripe アカウントを使用できます。同じ 24 時間以内に同一デバイスで別のアカウントが使用された場合、connectReader メソッドがSCPErrorTapToPayReaderMerchantBlockedエラーを生成します。

口座の関連付けについて、詳細は Apple iPhone のタッチ決済 FAQ の「iPhoneのタッチ決済のビジネス情報」セクションをご覧ください。

予期しない切断に対処する

アプリとリーダーの間で予期しない切断が発生することがあります。たとえば、デバイスのインターネット接続が失われ、メモリーの制約により Android OS がタッチ決済リーダーのサービスを終了すると、タッチ決済リーダーは予期せず切断される可能性があります。

テスト中は、デバイスのインターネットアクセスを無効にすることで、予期しない切断をシミュレーションできます。

自動的に再接続を試行する

予期しない切断が発生すると、Stripe はデフォルトで自動的に再接続を試行します。そのプロセス全体を通して、リーダーのステータスを伝える通知をアプリに表示することをお勧めします。

const { reader, error } = await connectReader({
    reader,
    autoReconnectOnUnexpectedDisconnect: true, // default setting
  },
  'tapToPay'
);

if (error) {
  console.log('connectReader error:', error);
  return;
}

console.log('Reader connected successfully', reader);

SDK が自動的に再接続を試行すると、以下が発生します。

1. SDK では、onDidStartReaderReconnect を介して通知されます。接続が切れて、再接続が進行中であることを必ずアプリで知らせてください。
   • cancelReaderReconnection メソッドを使用して、いつでも再接続の試行を停止できます。
2. SDK でリーダーへの再接続が成功すると、Stripe は onDidSucceedReaderReconnect を介して通知します。接続が復旧し、通常の動作が続くことを、必ずアプリで知らせてください。
3. SDK がリーダーに接続できない場合、Stripe は onDidFailReaderReconnect と onDidDisconnect の両方を介して通知します。必ず、予期しない切断が発生したことをアプリで知らせてください。

const { discoverReaders, connectedReader, discoveredReaders } =
    useStripeTerminal({
      onDidStartReaderReconnect: (disconnectReason) => {
        // 1. Notified at the start of a reconnection attempt
        // Use cancelable to stop reconnection at any time
      },
      onDidSucceedReaderReconnect: () => {
        // 2. Notified when reader reconnection succeeds
        // App is now connected
      },
      onDidFailReaderReconnect: (): => {
        // 3. Notified when reader reconnection fails
        // App is now disconnected
      }
    });

切断を手動で処理する

切断をお客様自身で処理するには、autoReconnectOnUxpectedDisconnect を false に設定し、onDidReportUnexpectedReaderDisconnect コールバックを実装します。これにより、アプリからタッチ決済リーダーに再接続できるようになり、また必要に応じて、ユーザーに失敗原因とタッチ決済へのアクセスを有効にする方法が通知されます。エンドユーザーは、インターネット接続の問題など、特定のエラーを解決できます。

const { discoverReaders, connectedReader, discoveredReaders } =
    useStripeTerminal({
      onDidReportUnexpectedReaderDisconnect: (readers) => {
        // Consider displaying a UI to notify the user and start rediscovering readers
      },
    });