サブスクリプションの実装を構築する
ロゴ、画像、カラーをカスタマイズします。
構築済みのオンラインで提供されるフォームを使用して支払いを回収し、サブスクリプションを管理します。
GitHub の組み込みのサンプルを複製します。
より実践的なガイドについては、Billing の組み込みのクイックスタートをご覧ください。
デモを参照して、オンラインで提供されているサンプルをご確認ください。
構築する内容
このガイドでは、Stripe Checkout を使用して月額固定料金のサブスクリプションを販売する方法について説明します。
このガイドでは以下の方法について説明します。
- 商品カタログを構築して、ビジネスをモデル化する
- Checkout セッションをサイトに追加し、ボタン、成功ページ、キャンセルページなどを組み込む
- サブスクリプションのイベントをモニタリングし、サービスへのアクセスを提供する
- カスタマーポータルを設定する
- 顧客ポータルセッションをサイトに追加し、ボタンやリダイレクトなどを組み込む
- ポータルを使用して顧客がサブスクリプションを自身で管理できるようにする
組み込み完了後に、以下の目的で組み込みを拡張できます。
- 税額を表示する
- 割引を適用する
- 無料トライアル期間を設ける
- 決済手段を追加する
- オンライン請求書ページを導入する
- Checkout をセットアップモードで使用する
- 従量課金、段階制料金体系、使用量ベースの料金体系を設定する
- 比例配分を管理する
- 顧客が複数の商品のサブスクリプションに登録できるようにする
- Integrate entitlements to manage access to your product’s features
Stripe を設定する
任意の Stripe クライアントをインストールします。
Stripe CLI をインストールします (オプション)。CLI は Webhook のテストを提供し、これを実行することで商品および価格を作成できます。
その他のインストールオプションについては、Stripe CLI を使ってみるをご覧ください。
料金体系モデルを作成するダッシュボードまたは Stripe CLI
ダッシュボードまたは Stripe CLI で商品とその価格を作成します。
この例では、「基本」と「プレミアム」という 2 つのサービスレベルオプションがある固定価格のサービスを使用しています。サービスレベルオプションごとに、1 つの商品と 1 つの継続価格を作成する必要があります (初期費用のような 1 回限りの支払いを追加する場合は、1 回限りの価格で 3 つ目の商品を作成します。わかりやすくするために、この例には 1 回限りの支払いを含めていません)。
この例では、各商品が 1 カ月間隔で請求されます。基本商品の価格は 5 USD で、プレミアム商品の価格は 15 USD です。
複数の請求期間を提供している場合、Checkout を使用して、より長い請求期間で顧客へのアップセルを行い、事前により多くの売上を回収できます。
他の料金体系モデルについては、Billing の例をご覧ください。
Checkout セッションを作成するクライアントおよびサーバー
サーバー側のエンドポイントを呼び出す決済ボタンを Web サイトに追加して Checkout セッションを作成します。
<html> <head> <title>Checkout</title> </head> <body> <form action="/create-checkout-session" method="POST"> <!-- Note: If using PHP set the action to /create-checkout-session.php --> <input type="hidden" name="priceId" value="price_G0FvDp6vZvdwRZ" /> <button type="submit">Checkout</button> </form> </body> </html>
アプリケーションのバックエンドで、フロントエンドが呼び出すセッションを作成するエンドポイントを定義します。以下の値が必要です。
- 顧客が登録するサブスクリプションの価格 ID。フロントエンドがこの値を渡します
success_url
。お客様の Web サイト上にあり、支払い完了後に顧客が戻されるページです。
必要に応じて cancel_url
を指定できます。これは、決済フローで顧客が決済をキャンセルした場合の戻り先であるお客様のウェブサイト上のページです。このコールに、サブスクリプションに対する請求サイクルの起点を設定することもできます。
ステップ 2 で 1 回限りの価格を作成した場合は、その価格 ID も渡します。Checkout セッションの作成後は、レスポンスで返された URL に顧客をリダイレクトします。
注
価格 ID ではなく lookup_keys を使用して価格を取得できます。例については、サンプルアプリケーションをご覧ください。
この例では Session ID を追加して success_url
をカスタマイズします。この方法の詳細は、成功ページをカスタマイズする方法に関するドキュメントをご覧ください。
サブスクリプションを提供して監視するサーバー
サブスクリプションの登録が成功し、顧客が success_url
に従ってお客様の Web サイトに戻ると、checkout.session.completed
Webhook が開始されます。checkout.session.completed
イベントを受信したら、サブスクリプションをプロビジョニングできます。invoice.paid
イベントを受信するたびに、毎月 (月次で請求する場合) プロビジョニングが継続的に行われます。invoice.payment_failed
イベントを受信した場合には、顧客に通知して顧客をカスタマーポータルに移動して、支払い方法を更新してもらいます。
ご利用のシステムロジックの次のステップを決定するには、イベントタイプを確認し、invoice.paid
などの各イベントオブジェクトのペイロードを解析します。データベースに subscription.id
と customer.id
イベントオブジェクトを保存して確認に使用します。
テスト目的の場合は、ダッシュボードでイベントをモニタリングできます。本番環境では、Webhook エンドポイントを設定して、適切なイベントタイプに登録します。STRIPE_WEBHOOK_SECRET
キーが不明な場合は、ダッシュボードで Webhook をクリックして表示します。
モニタリングが必要な最小限のイベントタイプ:
イベント名 | 説明 |
---|---|
checkout.session.completed | Checkout で顧客が「支払う」または「登録」ボタンをクリックすると送信され、新しい購入が通知されます。 |
invoice.paid | 請求期間ごとに、支払いが成功すると送信されます。 |
invoice.payment_failed | 請求期間ごとに、顧客の支払い方法に問題がある場合に送信されます。 |
その他のモニタリング対象のイベントについては、サブスクリプションの Webhook をご覧ください。
カスタマーポータルを設定するダッシュボード
カスタマーポータルを使用すると、顧客が既存のサブスクリプションとインボイスを直接管理できます。
ポータルの設定にはダッシュボードを使用します。少なくとも、顧客が決済手段を更新できるように設定してください。設定可能なその他の項目については、カスタマーポータルの実装をご覧ください。
ポータルセッションを作成するサーバー
フロントエンドが呼び出すカスタマーポータルセッションを作成するエンドポイントを定義します。この CUSTOMER_ID
は、Checkout セッションで作成されたもので、checkout.session.completed
Webhook の処理中に保存した顧客 ID です。ダッシュボードで、ポータルのデフォルトのリダイレクトリンクを設定することもできます。
サイトのページを示す return_url
値をオプションで渡して、サブスクリプションの管理を終えた顧客をこのページにリダイレクトします。
顧客をカスタマーポータルに移動させるクライアント
フロントエンドで、カスタマーポータルへのリンクを提供するボタンを success_url
のページに追加します。
<html> <head> <title>Manage Billing</title> </head> <body> <form action="/customer-portal" method="POST"> <!-- Note: If using PHP set the action to /customer-portal.php --> <button type="submit">Manage Billing</button> </form> </body> </html>
顧客は、カスタマーポータルを終了すると、return_url
の Web サイトに戻ります。引き続き Webhook をモニタリングして、顧客のサブスクリプションの状態を追跡します。
サブスクリプションのキャンセルなどのアクションを許可するようにカスタマーポータルを設定する場合は、モニタリングするその他のイベントについて、カスタマーポータルの実装をご覧ください。
組み込みをテストする
決済手段をテストする
次の表を使用して、さまざまな決済手段とシナリオをテストします。
決済手段 | シナリオ | テスト方法 |
---|---|---|
BECS ダイレクトデビット | 顧客が BECS ダイレクトデビットによる支払いに成功します。 | 口座番号 900123456 と BSB 000-000 を使用して、フォームに入力します。確定された PaymentIntent のステータスは、まず processing に移行し、3 分後に succeeded ステータスに移行します。 |
BECS ダイレクトデビット | 顧客の支払いが account_closed エラーコードで失敗します。 | 口座番号 111111113 と BSB 000-000 を使用して、フォームに入力します。 |
クレジットカード | カード支払いは成功し、認証は要求されません。 | クレジットカード番号 4242 4242 4242 4242 と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。 |
クレジットカード | カード決済で認証が要求されます。 | クレジットカード番号 4000 0025 0000 3155 と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。 |
クレジットカード | カードが insufficient_funds などの拒否コードで支払い拒否されます。 | クレジットカード番号 4000 0000 0000 9995 と、任意の有効期限、セキュリティコード、郵便番号を使用してクレジットカードフォームに入力します。 |
SEPA ダイレクトデビット | 顧客が SEPA ダイレクトデビットによる支払いに成功します。 | 口座番号 AT321904300235473204 を使用して、フォームに入力します。確定された PaymentIntent のステータスはまず、processing に移行し、3 分後に succeeded ステータスに移行します。 |
SEPA ダイレクトデビット | 顧客の Payment Intent のステータスが、processing から requires_payment_method に移行します。 | 口座番号 AT861904300235473202 を使用して、フォームに入力します。 |
イベントを監視する
Webhook を設定して、アップグレードとキャンセルなどのサブスクリプションの変更イベントをリッスンします。サブスクリプションの Webhook に関する詳細は、ガイドをご覧ください。イベントの表示は、ダッシュボード、または Stripe CLI を使用して行うことができます。
Billing の組み込みのテストに関する詳細については、ガイドをご覧ください。