Smartpay チェックアウトを連携する

実用的な全プロジェクトをダウンロードするには、GitHub リポジトリの Smartpay コードサンプルご覧ください。

Smartpay による支払いの仕組みについては、チェックアウトの流れで詳細を確認してください。

サーバー側のコード

以下のガイドに従って、サーバー側の連携を行ってください。

Smartpay checkout

Open Recipe

クライアント側のコード

あとは、お客様が Smartpay で支払いたい時に create-smartpay-checkout を呼び出すだけです。以下のシンプルなコードサンプルを使って連携をテストすることができます。

<!DOCTYPE html>
<html>
  <head>
    <link href="./demo.css" rel="stylesheet" />
  </head>
  <body>
    <form method="POST" action="http://127.0.0.1:5000/create-smartpay-checkout">
      <button id="checkout" type="submit">Checkout</button>
    </form>
  </body>
</html>

テストする

Smartpay では、開発者の皆様にスムーズな体験を提供することを目指しており、連携を簡単にテストしていただけます。

テスト時には、テスト用の API キーを使用してチェックアウトセッションを作成し、Smartpay チェックアウトを起動してください（API リクエストの認証に関する詳細は、認証を参照してください）。テストモードでは、カードネットワークや決済プロバイダにより決済が処理されることはありません。実際に請求される心配がないため、安心して連携作業を行っていただけます。

テストモードのチェックアウトでは、左上に「テスト中」のバナーが表示され、テストモードであることを簡単に確認できます。

テスト用のお客様アカウント

テストモードのチェックアウトを完了するには、テスト用のユーザーアカウントが必要です。以下の手順に従って、Smartpay にテストユーザーとしてサインアップしてください。

メールアドレス

Smartpay チェックアウトにリダイレクトされたら、あとは +test のサフィックスがついた任意のメールアドレス (例: [email protected]) で登録するだけです。登録後、すぐにテスト用のアカウントとして認識されます。

電話番号

電話番号の入力を求められたら、有効な日本の携帯電話番号を入力してください。
Smartpay は、サインアップ時に指定された電話番号に SMS でワンタイムパスワードを送信することにより、お客様の電話番号を確認します。テスト用のアカウントの場合は、このワンタイムパスワードは SMS で送信されず、フォームにあらかじめ入力されています。

カード番号

テスト用の Smartpay アカウントでは、カード番号があらかじめ入力されており、異なるすべての結果をテストしていただけます。

成功: 4242 4242 4242 4242
チェックアウトに失敗: 4100 0000 0000 0019
この支払い方法に失敗: 4000 0000 0000 0119

テスト用のアカウントの場合は、ご自身のカードを追加したり、Apple Pay や Google Pay を利用することはできません。

375 — Test mode checkout - pre-configured card numbers