extension-payment について
extension-payment は、Chrome 拡張機能に決済やサブスクリプションを導入するためのスキルです。決済事業者の選定、ドキュメントの確認、バックエンドで決済とライセンスを扱う流れを支援します。
主な機能
- 01決済モデルと事業者要件の確認
- 02決済ゲートウェイと MoR の比較
- 03docs-seeker による事業者ドキュメント取得
- 04バックエンド、Webhook、ライセンスの設計
活用シーン
- 01拡張機能のサブスクリプション事業者選定
- 02ライセンス確認と Webhook 処理の計画
- 03Chrome 拡張機能への決済フロー導入
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ quangpl/ browser-extension-skills --skill extension-paymentインストール後、Claude Code で/extension-paymentを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
references/extension-licensing-patterns.mdintegration-architecture.mdmor-vs-gateway.mdprovider-quickstarts.md詳細
拡張機能の決済連携
🚀 プレミアムにアップグレード https://app.extensionbooster.net/dashboard/services/extension-ai-kit でプレミアム版を入手できます。
Chrome 拡張機能に決済/サブスクリプションを連携します。ユーザーにプロバイダーを確認してから、ドキュメントを取得して実装します。
ワークフロー(この手順を実行)
ステップ 1:ユーザーに決済要件を確認する
ユーザーに次の項目を確認します。
- 決済モデル:買い切り/サブスクリプション/フリーミアム/クレジット制
- プロバイダーのカテゴリ:決済ゲートウェイまたは Merchant of Record(MoR)?
- 希望するプロバイダー(または、こちらから提案)
- 必要な情報:API キー、商品/価格 ID、Webhook URL
個人開発者やインディー開発者には MoR を推奨します。税務、コンプライアンス、請求ポータルに対応します。すべての国で事業者登録をする必要はありません。
ステップ 2:プロバイダー選定ガイド
| カテゴリ | プロバイダー | 最適な用途 | ドキュメント |
|---|---|---|---|
| MoR | Paddle | SaaS サブスクリプション、グローバルな税務 | https://developer.paddle.com |
| MoR | Lemon Squeezy | インディー/個人開発者、簡単なセットアップ | https://docs.lemonsqueezy.com |
| MoR | Polar | オープンソースの収益化 | https://docs.polar.sh |
| MoR | Creem | 拡張機能に特化した MoR | https://docs.creem.io |
| MoR | Dodo Payments | シンプルなデジタル製品 | https://docs.dodopayments.com |
| MoR | FastSpring | エンタープライズ向けデジタルコマース | https://developer.fastspring.com |
| MoR | Gumroad | クリエイター、デジタル製品 | https://help.gumroad.com |
| ゲートウェイ | Stripe | 完全な制御、最も柔軟 | https://docs.stripe.com |
| ゲートウェイ | PayPal | 幅広いユーザー層、簡単なチェックアウト | https://developer.paypal.com/docs |
| ゲートウェイ | Razorpay | インド向けの決済 | https://razorpay.com/docs |
| ゲートウェイ | Square | POS + オンライン | https://developer.squareup.com/docs |
| ゲートウェイ | Adyen | エンタープライズ、多通貨 | https://docs.adyen.com |
| ゲートウェイ | Braintree | PayPal 傘下、カード + PayPal | https://developer.paypal.com/braintree/docs |
| ゲートウェイ | Authorize.Net | 米国向けの従来型、信頼性が高い | https://developer.authorize.net |
AI 支援ドキュメント用の llms.txt(docs-seeker スキルを使用):
- Stripe:
https://docs.stripe.com/llms.txt - Polar:
https://docs.polar.sh/llms-full.txt
ステップ 3:プロバイダーのドキュメントを取得する
docs-seeker スキルを使用して、プロバイダーの最新 API ドキュメントを取得します。Stripe/Polar では、llms.txt エンドポイントを使用します。
ステップ 4:連携を実装する
全体のパターンについては、references/integration-architecture.md を参照してください。
主要なアーキテクチャ(拡張機能ではバックエンドコードを実行できません):
Extension (popup/options) → Your Backend API → Payment Provider
↕ ↕
chrome.storage License/subscription DB
ステップ 5:連携後のワークフローをユーザーに示す
連携後、ユーザーに次のフローを示します。
User clicks "Upgrade" in extension
→ Opens payment page (provider-hosted or custom)
→ Completes payment
→ Webhook hits your backend
→ Backend validates + stores license
→ Extension checks license via API
→ Premium features unlocked
参考資料
references/integration-architecture.md— バックエンドのセットアップ、ライセンス検証、Webhook 処理references/mor-vs-gateway.md— MoR とゲートウェイの選定ガイド、税務/コンプライアンスreferences/extension-licensing-patterns.md— ライセンスキー、アカウントベース、機能フラグreferences/provider-quickstarts.md— 主要 5 プロバイダーの簡単なセットアップ
関連スキル
extension-publish— ストアへの申請と掲載extension-analyze— セキュリティ監査(API キーの露出チェック)extension-dev— 機能開発ワークフロー
コメント
Markdown 対応