← トップに戻る
USE CASE 4 · サブスクリプション

🔄 SaaS Subscription - 月額課金デモ

顧客作成 → カードトークン保存 → サーバー側継続課金 までを実elepay APIで実装。
導入パターン: Server SDK のみ + Customer/Source API(バックエンド処理中心)

ライブ加盟店モード

このデモはあなたのelepayテストアカウントに本物の顧客・カードトークン・課金履歴を作成します

プランをお選びください

Starter
¥980/月

個人・スモールチーム向け

  • ユーザー数 3名まで
  • 5GB ストレージ
  • メールサポート
Enterprise
¥9,800/月

大規模組織向け

  • ユーザー数 無制限
  • 1TB ストレージ
  • 専任CSM
  • SSO / 監査ログ

🔁 サブスク課金の仕組み(実装済みフロー)

👤
1. 顧客作成

POST /customers → cus_xxx

💳
2. カード登録

POST /customers/{id}/sources → SDK handleSource()

📅
3. スケジュール実行

cron で月次バッチ起動

4. 自動課金

POST /charges + customerId + sourceId

🔔
5. Webhook通知

charge.captured / charge.failed

⚙️ 実装コード(本ページで実行している処理)

// 1. 顧客作成(一度だけ)
const customer = await fetch('/api/create-customer', {
  method: 'POST', headers: {'Content-Type': 'application/json'},
  body: JSON.stringify({ email, name })
}).then(r => r.json());
// → { id: 'cus_xxx', email, name, ... }

// 2. カード登録枠(Source)作成 → SDK で確定
const source = await fetch('/api/create-source', {
  method: 'POST', headers: {'Content-Type': 'application/json'},
  body: JSON.stringify({ customerId: customer.id, paymentMethod: 'creditcard' })
}).then(r => r.json());
// → { id: 'src_xxx', credential: '...', status: 'pending' }

await elepay.handleSource(source);   // SDK でカード入力 → トークン化保存

// 3. 毎月のサーバーバッチで自動課金(顧客操作なし)
await fetch('/api/recurring-charge', {
  method: 'POST', headers: {'Content-Type': 'application/json'},
  body: JSON.stringify({
    customerId: 'cus_xxx',    // 必須
    sourceId: 'src_xxx',      // 必須(保存カード)
    amount: 2980,
    description: 'Pro プラン 2026年4月分'
  })
});