【Bubble】Stripeプラグインを用いた決済の実装方法について【Bubble】Stripeプラグインを用いた決済の実装方法について概要Stripeはオンライン決済サービスであり、決済機能をBubbleで簡単に実装できます。Stripeは決済データを保護する為に、様々な対策を講じており、セキュリティーの観点からもStripeで決済機能を実装することで、リスクを抑えます。Stripeでできる主な機能は以下の通りです。・割引とクーポンBubbleアプリにStripeを導入する際の事前準備Stripeでユーザー登録するまずはStripeの新規登録ページにて、ユーザー登録します。申請」を行う必要があります。本記事ではテスト利用のみ行う為、割愛します。本番環境の利用申請については公式ドキュメントを参照ください。次にBubbleエディタ「Plugins」メニューから「Stripe」プラグインをインストールします。インストール後に、以下の画像のようにStripeの設定画面から必要な項目を入力します。development」欄のみ入力します。Keyの値は、Stripe管理画面から取得できます。以上でStripeを導入する際の事前準備は完了です。次項からはBubbleでのオンライン決済方法を解説します。Stripeによるクレジットカード決済と返金処理クレジットカード決済実装の流れ例えば、商品ページにて「購入する」ボタンを押下したら1,000円分決済するようにする場合、「購入する」ボタンのワークフローを設定することで実装できます。Stripeプラグインをインストールすると、「Payment」というワークフローが追加されます。user」アクションを使用して、ユーザーのクレジットカードに支払いを請求するトリガーを設定できます。これらの設定方法については、BubbleのStripeプラグインのドキュメントを参照してください。ワークフロー設定後に、購入ボタンをクリックすると、以下のようなポップアップが表示されます。4242」を使用し、カードの期限については任意の有効な将来の日付、セキュリティコードは3桁の数字を入力します。することで、テスト決済できます。上記のようなStripeのテスト支払いで利用するクレジットカードの番号やその他仕様については公式ドキュメントをご参照ください。Stripeのテスト支払いで利用するクレジットカードの番号やその他仕様については公式ドキュメントをご参照ください。only」を選択することで、仮売上で決済できます。支払額を確認した後に、クレジットカード決済をしたい場合に使用できます。返金処理ユーザーに対して返金する必要があった場合、Stripeのダッシュボードから「支払い」から返金処理をできます。返金を選択すると、以下のポップアップが表示されます。理由を記載して「返金」ボタンをクリックして、返金完了です。