> ## Documentation Index
> Fetch the complete documentation index at: https://docs.dodopayments.com/llms.txt
> Use this file to discover all available pages before exploring further.

# チェックアウト機能

> コンバージョン最適化された、グローバルに準拠したチェックアウトで、複数通貨、複数言語のサポート、自動税計算、割引コード、アドオン、スマート住所収集を提供します。

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/cover.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=2dc0a0db8e021e39fb17e84fc12eb5f9" alt="チェックアウトページ" style={{ maxHeight: '500px', width: 'auto' }} width="2844" height="1556" data-path="images/checkout/cover.png" />
</Frame>

<Info>
  Dodo Paymentsのチェックアウトは、デジタル製品やSaaSビジネス向けに設計された、コンバージョン最適化かつグローバルコンプライアンス対応のチェックアウトです。複数通貨、言語、税金、割引、アドオン、およびビジネスに優しいコンプライアンスワークフローをサポートします。
</Info>

<CardGroup cols={2}>
  <Card title="Checkout Sessions API" icon="code" href="/api-reference/checkout-sessions/create">
    ホスト型チェックアウトセッションをプログラム的に作成します。
  </Card>

  <Card title="Preview Checkout" icon="eye" href="/api-reference/checkout-sessions/preview">
    セッションを作成する前に価格と税金を計算します。
  </Card>

  <Card title="Payment Methods" icon="credit-card" href="/features/payment-methods">
    サポートされている支払い方法や設定オプション。
  </Card>
</CardGroup>

## 適応通貨

適応通貨により、顧客は好みの現地通貨で支払うことができ、信頼性とコンバージョン率が向上します。

### 仕組み

1. **有効化**: **設定 → ビジネス** からアダプティブ通貨を有効にする
2. **選択**: お客様はチェックアウトで直接通貨を切り替えることができます
3. **変換**: 価格はリアルタイムの為替レートを使用して動的に変換されます
4. **表示**: 支払い前に最終支払額が透明に表示されます

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c1.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=c2f9ee4b1748448d4ab7ab23954dcc64" alt="チェックアウトでの通貨セレクタ" style={{ maxHeight: '500px', width: '70%' }} width="794" height="858" data-path="images/checkout/c1.png" />
</Frame>

<Card title="Adaptive Currency" icon="money-bill-transfer" href="/features/adaptive-currency">
  対応通貨、換算手数料、払い戻しの取り扱いについて詳しくはこちら。
</Card>

## 多言語チェックアウト

Dodo Paymentsはチェックアウトページで複数の言語をサポートしており、顧客は快適な言語で支払いを完了できます。

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c2.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=ecc6eb8db604e37433d8797c51768577" alt="チェックアウトでの言語セレクタ" style={{ maxHeight: '500px', width: '70%' }} width="794" height="858" data-path="images/checkout/c2.png" />
</Frame>

### 主なハイライト

* チェックアウト時に直接利用可能な言語セレクター
* UIテキスト、ラベル、システムメッセージがローカライズされています
* アクセシビリティと国際的なコンバージョンを向上させます

### サポートされている言語

チェックアウトページは21言語に対応しています：

| Language   | Code |
| ---------- | ---- |
| Arabic     | `ar` |
| Catalan    | `ca` |
| Chinese    | `zh` |
| Dutch      | `nl` |
| English    | `en` |
| French     | `fr` |
| German     | `de` |
| Hebrew     | `he` |
| Indonesian | `id` |
| Italian    | `it` |
| Japanese   | `ja` |
| Korean     | `ko` |
| Malay      | `ms` |
| Polish     | `pl` |
| Portuguese | `pt` |
| Romanian   | `ro` |
| Russian    | `ru` |
| Spanish    | `es` |
| Swedish    | `sv` |
| Thai       | `th` |
| Turkish    | `tr` |

<Tip>
  チェックアウトセッションを作成する際に`force_language`パラメータを設定すると、特定の言語を強制できます。詳細は[Checkout Sessions API](/developer-resources/checkout-session#14-forcing-a-language)をご覧ください。
</Tip>

## 自動税額計算

税額は顧客の請求先所在地に基づいて自動的に計算され、GST、VAT、売上税の要件に手動設定なしで準拠します。

### 税額計算の仕組み

<Steps>
  <Step title="Location Detection">
    税ルールは、顧客の国（該当する場合は地域）に基づいて適用されます。
  </Step>

  <Step title="Dynamic Updates">
    税額は以下のタイミングで自動更新されます：

    * 国が変更されたとき
    * 住所が更新されたとき
  </Step>

  <Step title="Transparent Display">
    支払い前に最終的な税内訳が明確に表示されます。
  </Step>
</Steps>

<Tip>
  税額計算は完全に自動化されています。標準的なデジタル商品およびSaaS製品には手動設定は不要です。
</Tip>

## 法人税IDのサポート

登録法人の場合、チェックアウトで顧客が法人税ID（例：VAT/GST番号）を入力できます。

### 税ID入力時の動作

* 税の適格性がリアルタイムで検証されます
* 該当する税の免除またはリバースチャージルールが適用されます
* チェックアウトの税額が即時更新されます

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c3.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=76451fed5636a6ef3e5c3ec7f6a96c9f" alt="チェックアウトでの事業者税ID入力" style={{ maxHeight: '500px', width: '70%' }} width="1440" height="1716" data-path="images/checkout/c3.png" />
</Frame>

<Info>
  これは主にB2B SaaSやデジタルサービスに有効で、法人顧客が税の免除対象となる場合に役立ちます。
</Info>

## 割引コード

顧客はダッシュボードで作成した割引またはプロモコードをチェックアウトページ上で直接適用できます。

### チェックアウト体験

1. 顧客が割引コードを入力する
2. 割引が即時に検証される
3. 更新された価格と節約額が明確に表示される

<Frame>
  <img src="https://mintcdn.com/dodopayments/Vafy52417ELLVDIx/images/checkout/c4.png?fit=max&auto=format&n=Vafy52417ELLVDIx&q=85&s=639dcc94ddd1b41fdd6ff200c2a28e47" alt="チェックアウトでの割引コード入力" style={{ maxHeight: '500px', width: '70%' }} width="794" height="858" data-path="images/checkout/c4.png" />
</Frame>

### API統合

1つ以上の積み重ね可能なディスカウントコードを事前適用するか、ディスカウント入力フィールドを有効にします:

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  discount_codes: ['WELCOME20'], // Pre-apply one or more codes (max 20, applied in order)
  feature_flags: {
    allow_discount_code: true // Show discount input field
  },
  return_url: 'https://yoursite.com/return'
});
```

<Info>
  `discount_codes` は最大20個のコードの配列を受け入れ、順に積み重ねられます。単一の `discount_code` フィールドは廃止されていますが、既存の統合ではすぐに変更する必要はありません。積み重ねとより豊かな応答形式を使用する際には、便利なときに `discount_codes` に移行してください。
</Info>

<Card title="Discount Codes" icon="percent" href="/features/discount-codes">
  割引コードの作成と管理方法を学びます。
</Card>

<Card title="Validate Discount by Code" icon="tag" href="/api-reference/discounts/get-discount-by-code">
  コード名を使用して割引を検索および検証します。
</Card>

## スマートアドレス収集

チェックアウトは、迅速な完了のために柔軟な住所入力をサポートしています。

### 利用可能なオプション

| オプション              | 説明                  |
| ------------------ | ------------------- |
| **Googleアドレス自動入力** | 自動補完による迅速な選択        |
| **手動入力**           | 完全なアドレスの完全管理        |
| **国の選択**           | 税金とコンプライアンスのロジックを駆動 |

<Tip>
  アドレス収集は、変換を最大化しつつ、速度、正確性、およびグローバルなカバレッジのバランスを取ります。
</Tip>

## 電話番号収集

チェックアウト中に電話番号フィールドを表示するかどうか、またその必須性を、チェックアウトセッションの機能フラグを使用して制御します。

| フラグ                             | デフォルト   | 動作                                    |
| ------------------------------- | ------- | ------------------------------------- |
| `allow_phone_number_collection` | `true`  | チェックアウトフォームで電話番号フィールドを表示します           |
| `require_phone_number`          | `false` | 電話番号フィールドを必須にします（フォーム検証により非空の値を強制します） |

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [{ product_id: 'prod_abc', quantity: 1 }],
  feature_flags: {
    allow_phone_number_collection: true,
    require_phone_number: true
  },
  return_url: 'https://yoursite.com/return'
});
```

<Warning>
  `require_phone_number: true` は `allow_phone_number_collection: true` を必要とします。電話収集が無効化されているのに電話番号が必要とされているセッションは API が拒否します。
</Warning>

<Tip>
  B2B SaaS、規制された業界、またはサポート、不正確認、コンプライアンスのための検証済みの連絡チャネルが必要なフローには `require_phone_number` を使用してください。
</Tip>

## カスタムフィールド

チェックアウト中にカスタムフォームフィールドを定義して、顧客から追加情報を収集します。これは、会社名、チームサイズ、紹介元、その他のビジネス固有の情報を収集するのに役立ちます。

### 利用可能なフィールドタイプ

| タイプ        | 説明                  |
| ---------- | ------------------- |
| `text`     | シングルラインテキスト入力       |
| `number`   | 数値入力                |
| `email`    | 検証付きメールアドレス         |
| `url`      | 検証付きURL             |
| `date`     | 日付ピッカー              |
| `dropdown` | あらかじめ定義されたオプションから選択 |
| `boolean`  | はい/いいえのトグル          |

### 例

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  custom_fields: [
    {
      key: 'company_name',
      label: 'Company Name',
      field_type: 'text',
      required: true
    },
    {
      key: 'team_size',
      label: 'Team Size',
      field_type: 'dropdown',
      required: true,
      options: ['1-10', '11-50', '51-200', '200+']
    }
  ],
  return_url: 'https://yoursite.com/return'
});
```

<Info>
  顧客の回答は、webhook ペイロード (`payment.succeeded`, `subscription.active`) と、`custom_field_responses` 配列を介した API 応答に自動的に含まれます。1つのチェックアウトセッションで最大5つのカスタムフィールドを定義できます。
</Info>

<Card title="Custom Fields Guide" icon="input-text" href="/developer-resources/checkout-session#15-collecting-custom-fields">
  カスタムフィールドの設定と回答のアクセスについて詳しく学びます。
</Card>

## プライバシーポリシーと利用規約の受諾

法的およびコンプライアンスの透明性を確保するために:

* [プライバシーポリシー](https://dodopayments.com/privacy-policy) と [購入者向け利用規約](https://dodopayments.com/buyer-terms) のリンクがチェックアウトに明示的に表示されます
* 顧客はこれらを明確に認識した上で支払いを完了します

<Info>
  これは、GDPR準拠を含む世界的な消費者保護およびデータプライバシー要件を満たすのに役立ちます。
</Info>

## コレクションチェックアウト

プロダクトコレクションは、複数の関連した製品（例：スターター、プロ、エンタープライズプラン）を単一のチェックアウトで閲覧および選択できる統一されたチェックアウト体験を提供します。

### 仕組み

1. **すべての製品を表示**: 顧客はコレクション内のすべてのアクティブ製品を目にします
2. **最初の製品が事前選択される**: コレクション内の最初の製品が自動的に選択されます
3. **オプションを比較**: 顧客は選択する前に価格と機能を比較できます
4. **単一選択**: 製品を選択した後、標準の支払いフローでチェックアウトが行われます

### コレクションチェックアウトの作成

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_collection_id: 'pdc_abc123',
  product_cart: [], // Required: pass an empty array for collection checkout
  return_url: 'https://yoursite.com/return'
});
```

<Warning>
  `product_collection_id` を使用する場合、空の `product_cart` 配列を渡します。ディスカウントコードはセッション作成時に事前適用できません。
</Warning>

<Card title="Product Collections" icon="layer-group" href="/features/product-collections">
  統一されたチェックアウト体験のためのプロダクトコレクションの作成と管理方法を学びます。
</Card>

## チェックアウトセッション設定

Checkout Sessions API を使用してチェックアウトの動作を操作します:

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  customer: {
    email: 'customer@example.com',
    name: 'Jane Doe'
  },
  billing_currency: 'EUR', // Set specific currency
  discount_codes: ['PROMO10'],
  feature_flags: {
    allow_discount_code: true
  },
  return_url: 'https://yoursite.com/return',
  cancel_url: 'https://yoursite.com/pricing', // Optional: where to redirect on cancel
  metadata: {
    order_ref: 'ORD-12345'
  }
});
```

<Info>
  支払い後、顧客は自動的にクエリパラメータを付加されたあなたの `return_url` にリダイレクトされます -- `payment_id` または `subscription_id`、`status`、`email`、`license_key`（該当する場合）を含みます。完全なリストについては [Checkout Sessions ガイド](/developer-resources/checkout-session#request-body) を参照してください。
</Info>

<CardGroup cols={2}>
  <Card title="Checkout Sessions API" icon="code" href="/api-reference/checkout-sessions/create">
    チェックアウトセッションに関する完全なAPIリファレンス。
  </Card>

  <Card title="Checkout Integration Guide" icon="book" href="/developer-resources/checkout-session">
    チェックアウトを統合するためのステップバイステップガイド。
  </Card>
</CardGroup>

## チェックアウトテーマのカスタマイズ

APIを介してチェックアウトセッションを作成する際に、`customization.theme_config` パラメータを使用して、ブランドに合わせたチェックアウトページの外観をカスタマイズします。色、フォント、ボーダーラディウス、ボタンテキストをライトモードとダークモードの両方で設定します。

<Frame>
  <img src="https://mintcdn.com/dodopayments/rTHkQICkStFgSdh-/images/checkout/theme-example.png?fit=max&auto=format&n=rTHkQICkStFgSdh-&q=85&s=5277b69d67c90fd87e7c5d9c125fee12" alt="カスタムテーマのチェックアウトページ" style={{ maxHeight: '500px', width: 'auto' }} width="2856" height="1490" data-path="images/checkout/theme-example.png" />
</Frame>

<Card title="Design & Theme Customization" icon="palette" href="/features/design">
  ダッシュボードからプリビルドのテーマ、タイポグラフィ、カラー、ライブプレビューを使用してテーマを視覚的に設定します。
</Card>

<Info>
  このセクションでは、**サーバーサイドAPI** テーマ設定を `customization.theme_config` を使用してカバーします。**Checkout SDK** （オーバーレイまたはインラインチェックアウト）を使用している場合は、[Overlay Checkout](/developer-resources/overlay-checkout#theme-customization) または [Inline Checkout](/developer-resources/inline-checkout#theme-customization) のテーマカスタマイズセクションを参照してください。これにはキャメルケースプロパティ（例： `bgPrimary` ではなく `bg_primary`）が使用されている。
</Info>

### テーマ設定オプション

| プロパティ                | 説明                                                |
| -------------------- | ------------------------------------------------- |
| `light`              | ライトモードのカラー設定                                      |
| `dark`               | ダークモードのカラー設定                                      |
| `font_primary_url`   | プライマリフォントのURL                                     |
| `font_secondary_url` | セカンダリフォントのURL                                     |
| `font_size`          | フォントサイズ: `xs`, `sm`, `md`, `lg`, `xl`, `2xl`      |
| `font_weight`        | フォントウェイト: `normal`, `medium`, `bold`, `extraBold` |
| `radius`             | UI要素のボーダーラディウス（例： `4px`, `0.5rem`, `8px`）         |
| `pay_button_text`    | 支払いボタンのカスタムテキスト（例：「購入を完了」「今すぐ登録」）                 |

### カラー設定（ライト/ダークモード）

それぞれのモード（`light` と `dark`）は、次のカラープロパティをサポートしています:

| プロパティ                    | 説明               |
| ------------------------ | ---------------- |
| `bg_primary`             | 背景のプライマリカラー      |
| `bg_secondary`           | 背景のセカンダリカラー      |
| `text_primary`           | テキストのプライマリカラー    |
| `text_secondary`         | テキストのセカンダリカラー    |
| `text_placeholder`       | テキストのプレースホルダーカラー |
| `text_error`             | テキストのエラーカラー      |
| `text_success`           | テキストの成功カラー       |
| `border_primary`         | ボーダーのプライマリカラー    |
| `border_secondary`       | ボーダーのセカンダリカラー    |
| `button_primary`         | プライマリボタンの背景色     |
| `button_primary_hover`   | プライマリボタンのホバーカラー  |
| `button_secondary`       | セカンダリボタンの背景色     |
| `button_secondary_hover` | セカンダリボタンのホバーカラー  |
| `button_text_primary`    | プライマリボタンのテキストカラー |
| `button_text_secondary`  | セカンダリボタンのテキストカラー |
| `input_focus_border`     | 入力のフォーカスボーダーカラー  |

<Info>
  すべてのカラー項目は標準のCSSカラー形式を受け入れます:

  * Hex: `#fff`, `#ffffff`, `#ffffffff`
  * RGB/RGBA: `rgb(255, 255, 255)`, `rgba(255, 255, 255, 0.5)`
  * HSL/HSLA: `hsl(120, 100%, 50%)`, `hsla(120, 100%, 50%, 0.5)`
  * 名前付きカラー: `red`, `blue`, `transparent`
</Info>

### 例

```typescript theme={null}
const session = await client.checkoutSessions.create({
  product_cart: [
    { product_id: 'prod_abc', quantity: 1 }
  ],
  customization: {
    theme_config: {
      // Custom fonts
      font_primary_url: 'https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap',
      font_size: 'md',
      font_weight: 'medium',
      radius: '8px',
      pay_button_text: 'Complete Purchase',
      
      // Light mode colors
      light: {
        bg_primary: '#ffffff',
        bg_secondary: '#f5f5f5',
        text_primary: '#1a1a1a',
        text_secondary: '#666666',
        button_primary: '#0066ff',
        button_primary_hover: '#0052cc',
        button_text_primary: '#ffffff',
        border_primary: '#e0e0e0'
      },
      
      // Dark mode colors
      dark: {
        bg_primary: '#1a1a1a',
        bg_secondary: '#2d2d2d',
        text_primary: '#ffffff',
        text_secondary: '#a0a0a0',
        button_primary: '#3385ff',
        button_primary_hover: '#4d99ff',
        button_text_primary: '#ffffff',
        border_primary: '#404040'
      }
    }
  },
  return_url: 'https://yoursite.com/return'
});
```

<Tip>
  すべてのカラープロパティを指定する必要はありません。指定されていないプロパティはデフォルトのテーマ値が使用されます。
</Tip>
