0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Simple Membership × Stripe SCA (3Dセキュア) 対応カスタマイズ事例【WordPress + オンラインサロン】

Posted at

Simple Membership × Stripe SCA (3Dセキュア) 対応カスタマイズ事例【WordPress + オンラインサロン】

オンラインサロン向けに構築されたWordPressサイトで、Stripeによる3Dセキュア(SCA)対応のサブスクリプション決済を実装した際のメモです。

対象サイトはビルドサロン社が製作したオンラインサロンで、「Simple Membership」プラグインをベースに会員管理を行っています。


🎯 ゴール

  • StripeのSCA(Strong Customer Authentication)対応により、3Dセキュア必須環境でも安定して動作するサブスクリプション決済を導入
  • Simple Membership の支払いボタンを Checkout Session 経由に変更
  • 支払い完了後のリダイレクトや metadata で会員連携が可能な状態に

🔧 カスタマイズ対象ファイル

wp-content/plugins/simple-membership/views/payments/admin_create_payment_buttons.php
wp-content/plugins/simple-membership/views/payments/payment-gateway/admin_stripe_sca_subscription_button.php
wp-content/plugins/simple-membership/views/payments/payment-gateway/stripe_sca_button_shortcode_view.php

実装内容

1. 管理画面:ボタン作成タイプの追加

$options .= '<option value="stripe_sca_subscription">' . SwpmUtils::_('Stripe SCA Subscription') . '</option>';

これで「Stripe SCAサブスクリプション」という新しい選択肢が追加されます。

2. SCAサブスクリプションボタンの設定画面を拡張

<tr class="form-field form-required">
    <th scope="row"><label for="price_id">Stripe Price ID</label></th>
    <td><input name="price_id" type="text" id="price_id" value="<?php echo esc_attr($button->price_id); ?>" /></td>
</tr>

Stripeダッシュボードで作成した price_id を手動で設定できるように。

3. フロント出力:Checkout Sessionへリダイレクト

const stripe = Stripe('<?php echo esc_js($publishable_key); ?>');

document.getElementById('<?php echo esc_attr($button_id); ?>')
  .addEventListener('click', () => {
    fetch('<?php echo esc_url(admin_url("admin-ajax.php")); ?>?action=create_stripe_sca_session&button_id=<?php echo esc_attr($button_id); ?>')
      .then(response => response.json())
      .then(session => stripe.redirectToCheckout({ sessionId: session.id }))
      .catch(error => console.error('Stripe session creation failed:', error));
  });
</script>

導入後の結果
• ✅ モバイル含め、すべての決済で3Dセキュアが正常に動作
• ✅ 海外からのアクセス・カードでも問題なし
• ✅ 会員登録処理と連動し、metadataでログイン情報が連携可能に

📝 まとめ

Simple Membership はシンプルで使いやすい反面、Stripeとの高度な連携(特にSCA周り)は手動実装が必要になります。

今回のように、カスタムボタン+Checkout Sessionによる設計を行うことで、より安定・確実なサブスクリプション決済が実現可能です。

🔗 参考リンク
• Stripe Checkout - 公式ドキュメント
• Simple Membership - プラグイン公式
• ビルドサロン株式会社 - オンラインサロン構築専門企業

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?