メインコンテンツへスキップ
Dodo Paymentsは、支払い統合を簡素化する公式のフレームワークアダプタを提供しています。各アダプタは、フレームワークの慣習にシームレスに対応するように設計されており、チェックアウト、カスタマーポータル、Webhook処理をすぐに利用できます。
フレームワークアダプタを使用すると、10行未満のコードでDodo Paymentsを統合できます。認証、リクエスト解析、レスポンスフォーマットを自動的に処理します。

​
利用可能なフレームワークアダプタ

あなたのフレームワークに合ったアダプタを選択してください：

Next.js

チェックアウト、ポータル、Webhook用のルートハンドラを持つApp Routerサポート

Nuxt

サーバールート統合を持つVueベースのフルスタックフレームワーク

Express

人気のNode.jsフレームワーク用のミドルウェアベースのハンドラ

Fastify

プラグインアーキテクチャを持つ高性能Node.jsフレームワーク

Hono

エッジ、Cloudflare Workersなどのための超高速ウェブフレームワーク

Astro

サーバーエンドポイントサポートを持つコンテンツ重視のフレームワーク

SvelteKit

サーバーフック統合を持つフルスタックSvelteフレームワーク

Remix

ローダーとアクションハンドラを持つフルスタックReactフレームワーク

TanStack Start

サーバー関数を持つ型安全なフルスタックReactフレームワーク

Better Auth

シームレスな認証 + 支払いのための認証フレームワークプラグイン

Convex

リアルタイム支払い同期のためのBackend-as-a-Serviceコンポーネント

​
コア機能

すべてのフレームワークアダプタは、以下の組み込み機能を提供します：
機能説明
チェックアウトハンドラ静的、動的、セッションベースのチェックアウトフローをサポート
カスタマーポータルサブスクリプションと請求管理のための事前構築されたハンドラ
Webhookハンドラ型付きイベントハンドラによる安全な署名検証
環境設定環境変数を介した簡単なセットアップ
型安全性型付きペイロードを持つ完全なTypeScriptサポート

​
クイックスタート

任意のフレームワークアダプタを3つのステップで始めましょう：
1

アダプタをインストール

パッケージマネージャを使用して、フレームワーク固有のアダプタをインストールします：
npm install @dodopayments/nextjs
2

環境変数を設定

Dodo Paymentsの認証情報を環境に追加します：
DODO_PAYMENTS_API_KEY=your-api-key
DODO_PAYMENTS_WEBHOOK_KEY=your-webhook-secret
DODO_PAYMENTS_RETURN_URL=https://yourdomain.com/checkout/success
DODO_PAYMENTS_ENVIRONMENT="test_mode" # or "live_mode"
決してあなたの .env ファイルやシークレットをバージョン管理にコミットしないでください。
3

ルートハンドラを作成

チェックアウト、カスタマーポータル、Webhookのルートを設定します：
// app/checkout/route.ts
import { Checkout } from "@dodopayments/nextjs";

export const GET = Checkout({
  bearerToken: process.env.DODO_PAYMENTS_API_KEY,
  returnUrl: process.env.DODO_PAYMENTS_RETURN_URL,
  environment: process.env.DODO_PAYMENTS_ENVIRONMENT,
});
あなたは今、支払いを処理する準備ができました！詳細なガイドとすべての利用可能なオプションについては、各アダプタページを訪れてください。

​
チェックアウトフローの種類

すべてのアダプタは、3つのチェックアウトフローの種類をサポートしています：
シンプルで共有可能な支払いリンクのために静的チェックアウトを使用します。製品IDをクエリパラメータとして渡します：
/api/checkout?productId=pdt_xxx&quantity=1
オプションの顧客プリフィルとクエリパラメータを介したカスタマイズをサポートします。
カスタム詳細を持つ支払いをプログラム的に作成するために動的チェックアウトを使用します：
{
  "product_id": "pdt_xxx",
  "customer": {
    "email": "customer@example.com",
    "name": "John Doe"
  },
  "quantity": 1
}
一回限りの支払いとサブスクリプションの両方をサポートします。
カートサポートを持つ最も柔軟なチェックアウト体験のためにチェックアウトセッションを使用します：
{
  "product_cart": [
    { "product_id": "pdt_xxx", "quantity": 1 },
    { "product_id": "pdt_yyy", "quantity": 2 }
  ],
  "customer": {
    "email": "customer@example.com"
  }
}
チェックアウトセッションガイドで詳細を学びましょう。

​
Webhookイベント処理

すべてのアダプタは、詳細なイベントコールバックを持つ型安全なWebhook処理を提供します： 
Webhooks({
  webhookKey: process.env.DODO_PAYMENTS_WEBHOOK_KEY,
  onPayload: async (payload) => {
    // Handle any webhook event
  },
  onPaymentSucceeded: async (payload) => {
    // Handle successful payments
  },
  onSubscriptionActive: async (payload) => {
    // Handle new subscriptions
  },
  // ... 20+ event types supported
});
すべてのWebhookハンドラは、自動的に署名を検証し、Zodスキーマを使用してペイロードを検証します。無効なリクエストは適切なエラーコードで拒否されます。

​
適切なアダプタの選択

フレームワーク最適ランタイム
Next.jsApp Routerを持つフルスタックReactアプリNode.js, Edge
NuxtフルスタックVue.jsアプリケーションNode.js
ExpressREST APIと従来のNode.jsアプリNode.js
Fastify高性能APINode.js
Honoエッジデプロイメント、Cloudflare WorkersEdge, Node.js
Astroサーバーエンドポイントを持つコンテンツサイトNode.js, Edge
SvelteKitフルスタックSvelteアプリケーションNode.js
Remixネストされたルーティングを持つフルスタックReactNode.js
TanStack Start型安全なフルスタックReactNode.js
Better AuthすでにBetter Authを使用しているアプリ様々
ConvexConvexをバックエンドに使用しているアプリConvex Runtime

​
ヘルプを得る

フレームワークアダプタに関して支援が必要ですか？