サブスクリプション対応決済サービス Stripe と Laravel からサブスクリプションを操作する Laravel Cashier についてのメモ書き

Stripe.js and Elementsを使用して登録済みのクレジットカード番号を変更する

● 公式サイトのチュートリアル

https://stripe.com/docs/recipes/updating-customer-cards#creating-an-update-your-card-form

● リファレンス

https://stripe.com/docs/stripe-js/reference

● 流れ

次のような画面の流れになります。

1. 入力画面(新しいクレジットカード番号を入力)
  ↓
(WEBアプリサーバへ送信)
  ↓
2. WEBアプリから Stripeへ更新実行
  ↓
3. 完了画面表示

● 1. 入力画面

<script src="https://js.stripe.com/v3/"></script>
<form action="" method="POST">
  <script
  src="https://checkout.stripe.com/checkout.js" class="stripe-button"
  data-key="YOUR-STRIPE_PUBLIC_KEY"
  data-image="/path/to/your/logo.png"
  data-name="お店の名前"
  data-panel-label="クレジットカード番号更新"
  data-label="クレジットカード番号更新"
  data-allow-remember-me=false
  data-locale="auto">
  </script>
</form>

↑ こちらを表示するとメールアドレス入力欄が表示されます。 メールアドレスをあらかじめセットして、ユーザーの入力を省くときは

  data-email="{{ $login_user->email }}"

などとして、email を渡します。

● 2. WEBアプリから Stripeへ更新実行

        // ===== Stripe =====
        \Stripe\Stripe::setApiKey( 'YOUR-STRIPE_SECRET_KEY' );

        $message = "";

        if (isset($_POST['stripeToken'])){
            // dd( $_POST['stripeToken'] );
          try {
            $cu = \Stripe\Customer::update(
              $login_user->stripe_id, // Stripe Customer
              [
                'source' => $_POST['stripeToken'] ,
              ]
            );

            $message = "クレジットカード情報が正常に更新されました";
          }
          catch(\Stripe\Exception\CardException $e) {

            // Use the variable $error to save any errors
            // To be displayed to the customer later in the page
            $body = $e->getJsonBody();
            $err  = $body['error'];
            $error = $err['message'];
          }
          // Add additional error handling here as needed
        }
        // ===== Stripe =====

● 3. 完了画面表示

お好きにお作りください。

No.1593
10/02 22:50

edit