Zenn
🤑

個人開発者のためのStripe超入門①

に公開
React
Stripe
Supabase
tech

このガイドは個人開発者がStripe決済を理解し、実装するための超入門コンテンツです。

第1章 Stripe決済の全体像

概要

Stripeを使うことで、従来は複雑だった決済システムの実装ハードルが大幅に下がります。全体像をつかむための最低限必要な知識として、Web決済に的を絞って、Stripe決済の基本構造、単発決済とサブスクリプション決済の違い、テスト環境の使い方を説明します。

Web決済システムの全体像

Stripe決済システムは以下のようなコンポーネントで構成されています：
※最小限の基本的な決済に必要なもの。実際にはもっと複雑で、膨大な構造です

基本概念

  • 商品（Product）: 販売する商品やサービスの基本情報
  • 価格（Price）: 商品の価格設定（金額、通貨、請求間隔）
  • 顧客（Customer）: 購入者の情報を管理
  • 支払いインテント（Payment Intent）: 単発決済の処理を管理
  • サブスクリプション（Subscription）: 継続課金の管理

アプリケーションとの連携例

Stripe決済と、運営するアプリケーションとをどう連携するかはとても重要です。
主にStripeとバックエンドのデータをどう同期させるかに配慮しながら組み立てます。
一部、フロントエンドからStripeに直接通信する部分もあるので、決済の流れを整理することが大事です。

単発決済フロー

サブスクリプション決済フロー

Stripeの主要オブジェクト関係図

決済タイプ別の特徴

単発決済

単発決済は、商品購入や単発サービスの料金を一度だけ支払う決済方式です。ユーザーが商品を選択し、決済を完了すると、その場で料金が確定し、商品やサービスが提供されます。ECサイトでの商品購入や、コンサルティングの単発料金などが該当します。ProductとPriceで商品情報を定義し、Payment Intentで決済処理を管理します。決済が完了すると、Webhookを通じて即座にシステムに通知されます。

サブスクリプション決済

サブスクリプション決済は、SaaSや定額サービスなどで継続的に料金を徴収する決済方式です。ユーザーが一度契約すると、設定された間隔（月額、年額など）で自動的に請求書が作成され、登録されたカードから決済が実行されます。NetflixやSpotifyなどの月額サービスが代表例です。ProductとPrice（recurring設定）で商品を定義し、Subscriptionオブジェクトで継続課金を管理します。毎回の課金時にWebhookで通知を受け取ることができます。

バリエーション管理

テスト環境と本番環境

テスト環境（サンドボックス）

Stripeでは本番稼働前に安全にテストできるサンドボックス環境を提供しています。この環境では実際の決済は発生せず、何度でも安全にテストを行うことができます。

テスト用APIキー:

  • Publishable Key: pk_test_... で始まる
  • Secret Key: sk_test_... で始まる

テストカード番号:

4242424242424242  # 成功パターン（一番よく使う）
4000000000000002  # カード拒否
4000000000009995  # 残高不足
4000000000000069  # 有効期限切れ

※有効期限は未来日付なら何でも良い。CVCは任意の数字

本番環境

本番環境では本番用のAPIキーを使用することで、実際のユーザーから料金を徴収することができます。

本番用APIキー:

  • Publishable Key: pk_live_... で始まる
  • Secret Key: sk_live_... で始まる

環境の切り替え

開発段階ではテストキーとテストカード番号を使用し、十分にテストを行った後、リリース時に本番キーに切り替えます。APIキー（シークレット）は必ずバックエンドの環境変数で管理し、フロントエンドに漏洩しないよう注意が必要です。公開可能キーのほうはフロントエンドのアプリケーションで利用可能です。

Stripeアカウントについて

大前提として必要なStripeアカウントは、登録自体は簡単にできます。
本番環境の申請は案内サイトが準備できた状態でする必要があります。サービスは出来上がっていなくてもよいですが、サービスの中身や特定商取引法に不備があるとなかなか申請が通りません。
個人事業・法人とも対応しています。

本番環境申請に必要な準備

  • Webサイト: サービス内容が明確に記載されたページ
  • 特定商取引法に基づく表記: 正確な事業者情報、返品・キャンセル規約
  • プライバシーポリシー: 個人情報の取り扱いについて
  • 利用規約: サービス利用に関する規約
  • 事業者情報: 法人・個人事業主の登録情報

申請タイミング

テスト実装がおよそ完了し、サービスの概要が固まった段階で本番申請するとよいと思います。申請から承認まで数日から数週間かかる場合があるため、期間には余裕をみてください。申請が通らなかった場合でも、サポートと連絡を取るとていねいに対応してもらえるため、不十分な点を修正して再申請すればOKです。

重要なポイント

  1. Product vs Price: 商品情報と価格設定は分離して管理
  2. Customer管理: 顧客情報を適切に管理することで、サポートや分析が容易
  3. Webhook活用: 決済完了やサブスク変更を確実にキャッチ
  4. テストファースト: 本番前に必ずテスト環境で動作確認

まとめ

Stripe決済の基本構造をごく簡単に説明しました。テスト環境で十分確認してから本番環境に移行することが重要です。セキュリティに注意しながら実装することで、安全な決済システムを素早く構築できます。

Appendix： Stripe APIキーの取得タイミングと本番環境申請・審査について

開発用のテストAPIキー

  • 取得タイミング: Stripeアカウント作成直後、即座に取得可能

  • 審査の有無: 審査不要。アカウント登録のみで自動発行

  • 使用可能機能: 決済処理を含む、Stripeのほぼ全機能をテスト環境で検証可能

  • Stripeアカウント登録ページ (https://dashboard.stripe.com/register/payments)

審査なしで検証できる範囲

テストキーを使用して以下の機能を完全に検証可能：

  • 単発決済（Payment Intent）の作成・実行
  • サブスクリプション決済の作成・管理
  • 顧客情報の管理
  • Webhook送信のテスト
  • ダッシュボードでの取引履歴確認
  • 返金処理のテスト
  • 各種API機能の動作確認

本番用キーの有効化タイミング

  • 審査前: 本番用トークンは取得可能だが使用不可（制限モード）
  • 審査後: トークンの制限が解除され、実際の決済処理が可能に

実用的な開発フロー

  1. アカウント作成直後: テストトークンで開発・テスト開始
  2. 開発完了段階: 本番トークンを取得（まだ使用不可）
  3. 本番申請・審査完了: 本番トークンが有効化され、実決済が可能

つまり、開発・テスト段階では審査は一切不要で、本格的な機能検証が可能です。

※フロント/バックエンドコード側で、テスト・本番用APIキーの切替ロジックを組めば、最初の時点で本番用キーをシークレット等に設定することも可能

次：第2章（前半） 基本実装 - 単発決済

Discussion