jpskill.com
🛠️ 開発・MCP コミュニティ

stripe-handler

Stripeを使った決済処理や、通常のプラン・クレジット以外での柔軟なチェックアウト、Webhook連携などをスムーズに行い、多様なビジネスニーズに対応できる決済システムを構築・運用するSkill。

📜 元の英語説明(参考)

Handle Stripe payments, custom checkouts, and webhook fulfillment outside of standard plans/credits.

🇯🇵 日本人クリエイター向け解説

一言でいうと

Stripeを使った決済処理や、通常のプラン・クレジット以外での柔軟なチェックアウト、Webhook連携などをスムーズに行い、多様なビジネスニーズに対応できる決済システムを構築・運用するSkill。

※ jpskill.com 編集部が日本のビジネス現場向けに補足した解説です。Skill本体の挙動とは独立した参考情報です。

⚡ おすすめ: コマンド1行でインストール(60秒)

下記のコマンドをコピーしてターミナル(Mac/Linux)または PowerShell(Windows)に貼り付けてください。 ダウンロード → 解凍 → 配置まで全自動。

🍎 Mac / 🐧 Linux
mkdir -p ~/.claude/skills && cd ~/.claude/skills && curl -L -o stripe-handler.zip https://jpskill.com/download/16917.zip && unzip -o stripe-handler.zip && rm stripe-handler.zip
🪟 Windows (PowerShell)
$d = "$env:USERPROFILE\.claude\skills"; ni -Force -ItemType Directory $d | Out-Null; iwr https://jpskill.com/download/16917.zip -OutFile "$d\stripe-handler.zip"; Expand-Archive "$d\stripe-handler.zip" -DestinationPath $d -Force; ri "$d\stripe-handler.zip"

完了後、Claude Code を再起動 → 普通に「動画プロンプト作って」のように話しかけるだけで自動発動します。

💾 手動でダウンロードしたい(コマンドが難しい人向け)
  1. 1. 下の青いボタンを押して stripe-handler.zip をダウンロード
  2. 2. ZIPファイルをダブルクリックで解凍 → stripe-handler フォルダができる
  3. 3. そのフォルダを C:\Users\あなたの名前\.claude\skills\(Win)または ~/.claude/skills/(Mac)へ移動
  4. 4. Claude Code を再起動

⚠️ ダウンロード・利用は自己責任でお願いします。当サイトは内容・動作・安全性について責任を負いません。

🎯 このSkillでできること

下記の説明文を読むと、このSkillがあなたに何をしてくれるかが分かります。Claudeにこの分野の依頼をすると、自動で発動します。

📦 インストール方法 (3ステップ)

  1. 1. 上の「ダウンロード」ボタンを押して .skill ファイルを取得
  2. 2. ファイル名の拡張子を .skill から .zip に変えて展開(macは自動展開可)
  3. 3. 展開してできたフォルダを、ホームフォルダの .claude/skills/ に置く
    • · macOS / Linux: ~/.claude/skills/
    • · Windows: %USERPROFILE%\.claude\skills\

Claude Code を再起動すれば完了。「このSkillを使って…」と話しかけなくても、関連する依頼で自動的に呼び出されます。

詳しい使い方ガイドを見る →
最終更新
2026-05-18
取得日時
2026-05-18
同梱ファイル
1

📖 Skill本文(日本語訳)

※ 原文(英語/中国語)を Gemini で日本語化したものです。Claude 自身は原文を読みます。誤訳がある場合は原文をご確認ください。

Stripe ハンドラー

このスキルは、Stripe を使用して支払いロジックを実装する必要がある場合に使用します。特に、標準的な SaaS サブスクリプションプランや標準的なクレジットパッケージ(それぞれ plans-handler および credits-handler で処理されます)ではないユースケースで使用します。

どのような時に使うか

  • 「1 回限りの製品を購入」フローの実装(例:コース、デジタルグッズ)。
  • カスタムの「サービス」支払いの作成。
  • カスタムメタデータの checkout.session.completed の処理。
  • 標準的でないイベントのための src/app/api/webhooks/stripe/route.ts のカスタマイズ。
  • 重い webhook 処理をバックグラウンドタスクにオフロード(Inngest 経由)。

プロセス

1. 支払いタイプの特定

コードを書く前に、支払いの性質を決定します。

  • サブスクリプションプランですか? -> plans-handler を使用します。
  • クレジットパッケージですか? -> credits-handler を使用します。
  • カスタムの 1 回限りまたは定期的な製品ですか? -> このスキルを続行します。

2. チェックアウトセッションの作成 (API/Action)

Stripe チェックアウトセッションを作成するためのサーバーサイドのエンドポイントが必要です。

  • ファイル: 新しいルート(例:src/app/api/app/orders/create/route.ts)またはサーバーアクションを作成します。
  • インポート: import stripe from "@/lib/stripe";
  • メタデータ: 重要。webhook で購入タイプを識別するために、常に metadata をセッションにアタッチします。
    metadata: {
      type: "my_custom_feature",
      userId: user.id,
      customId: "..."
    }
  • URL: 標準の成功/エラーページ、または必要に応じてカスタムのものを使用します。
    • 成功: ${process.env.NEXT_PUBLIC_APP_URL}/app/subscribe/success?session_id={CHECKOUT_SESSION_ID}
    • エラー: ${process.env.NEXT_PUBLIC_APP_URL}/app/subscribe/error

3. Webhook フルフィルメントの処理

すべての Stripe イベントは src/app/api/webhooks/stripe/route.ts に送られます。

  • ファイル: src/app/api/webhooks/stripe/route.ts
  • 場所: onCheckoutSessionCompleted (1 回限り) または handleOutsidePlanManagementProductInvoicePaid (請求書)。
  • 実装:
    1. イベントオブジェクトから metadata を抽出します。
    2. metadata.type がカスタム機能と一致するかどうかを確認します。
    3. 一致する場合: フルフィルメントロジックを実行します。
      • 単純なロジック: DB を直接更新します。
      • 重いロジック: Inngest イベントをディスパッチして、バックグラウンドで処理します。
    4. 一致しない場合: 関数が標準のプラン/クレジット処理にフォールスルーするようにします。

4. バックグラウンド処理 (Inngest)

本番環境に推奨: フルフィルメントロジックに複数の DB 呼び出し、外部 API が含まれる場合、またはタイムアウトする可能性がある場合(Stripe は 3 秒未満で応答を期待します)。

  • inngest-handler を使用して新しい関数を作成します。
  • webhook で、イベントをディスパッチするだけです。
    await inngest.send({ name: "app/payment.custom_succeeded", data: { sessionId: object.id, metadata } });
  • src/inngest/functions/... で実際のロジックを処理します。

5. データベースの更新

  • 購入がリソースへのアクセスを許可する場合、対応するスキーマ(例:orderscourses)を更新します。
  • フルフィルメントがべき等であることを確認します(重複する webhook イベントを適切に処理します)。

6. フロントエンドの統合

  • 単純なボタンまたはフォームを使用して、API/Action を呼び出します。
  • ユーザーを返された url (Stripe Checkout) にリダイレクトします。

ベストプラクティス

  • べき等性: Webhook は複数回トリガーされる可能性があります。ロジックで注文がすでに完了しているかどうかを確認してください。
  • メタデータ: よりクリーンなロジック分離のために、製品 ID だけでなくメタデータに依存してください。
  • タイムアウト: Stripe webhook は迅速に応答する必要があります。2 秒以上かかるものには Inngest を使用してください。
  • テスト: stripe listen を使用して、webhook をローカルでテストします。

リファレンス

セッションの作成、webhook の処理、および Inngest の使用に関するコードスニペットについては、reference.md を参照してください。

📜 原文 SKILL.md(Claudeが読む英語/中国語)を展開

Stripe Handler

Use this skill when you need to implement payment logic using Stripe, specifically for use cases that are NOT standard SaaS subscription plans or standard Credit packages (which are handled by plans-handler and credits-handler respectively).

When to use

  • Implementing "Buy One-time Product" flows (e.g., Courses, Digital Goods).
  • Creating custom "Service" payments.
  • Handling checkout.session.completed for custom metadata.
  • Customizing src/app/api/webhooks/stripe/route.ts for non-standard events.
  • Offloading heavy webhook processing to background tasks (via Inngest).

Process

1. Identify Payment Type

Before writing code, determine the nature of the payment:

  • Is it a Subscription Plan? -> Use plans-handler.
  • Is it a Credit Package? -> Use credits-handler.
  • Is it a Custom One-time or Recurring Product? -> Continue with this skill.

2. Create Checkout Session (API/Action)

You need a server-side endpoint to create the Stripe Checkout Session.

  • File: Create a new route (e.g., src/app/api/app/orders/create/route.ts) or Server Action.
  • Import: import stripe from "@/lib/stripe";
  • Metadata: CRITICAL. Always attach metadata to the session to identify the purchase type in the webhook.
    metadata: {
      type: "my_custom_feature",
      userId: user.id,
      customId: "..."
    }
  • URLs: Use the standard success/error pages or custom ones if needed.
    • Success: ${process.env.NEXT_PUBLIC_APP_URL}/app/subscribe/success?session_id={CHECKOUT_SESSION_ID}
    • Error: ${process.env.NEXT_PUBLIC_APP_URL}/app/subscribe/error

3. Handle Webhook Fulfillment

All Stripe events go to src/app/api/webhooks/stripe/route.ts.

  • File: src/app/api/webhooks/stripe/route.ts
  • Locate: onCheckoutSessionCompleted (for one-time) or handleOutsidePlanManagementProductInvoicePaid (for invoices).
  • Implement:
    1. Extract metadata from the event object.
    2. Check if metadata.type matches your custom feature.
    3. If yes: Run your fulfillment logic.
      • Simple Logic: Update DB directly.
      • Heavy Logic: Dispatch an Inngest event to handle it in the background.
    4. If no: Let the function fall through to standard plan/credit handling.

4. Background Processing (Inngest)

Recommended for production: If your fulfillment logic involves multiple DB calls, external APIs, or could timeout (Stripe expects a response in < 3s):

  • Use inngest-handler to create a new function.
  • In the webhook, just dispatch the event:
    await inngest.send({ name: "app/payment.custom_succeeded", data: { sessionId: object.id, metadata } });
  • Handle the actual logic in src/inngest/functions/....

5. Database Updates

  • If the purchase grants access to a resource, update the corresponding schema (e.g., orders, courses).
  • Ensure the fulfillment is idempotent (handle duplicate webhook events gracefully).

6. Frontend Integration

  • Use a simple Button or Form to call your API/Action.
  • Redirect the user to the returned url (Stripe Checkout).

Best Practices

  • Idempotency: Webhooks can fire multiple times. Ensure your logic checks if the order is already fulfilled.
  • Metadata: Rely on metadata, not just product IDs, for cleaner logic separation.
  • Timeouts: Stripe webhooks must respond quickly. Use Inngest for anything taking > 2 seconds.
  • Testing: Use stripe listen to test webhooks locally.

Reference

See reference.md for code snippets on creating sessions, handling webhooks, and using Inngest.