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

# SDK セットアップとフィーチャーフラグチュートリアル

> SDK 連携、Kameleoon アプリのセットアップ、オプションのハイブリッドモードを網羅したステップバイステップのチェックリストを使用して、Kameleoon SDK のセットアップとフィーチャーフラグの設定を行います。

<Warning>
  メソッド名が正しいか確認するため、必ず [SDK ドキュメント](../../feature-experimentation/get-started/overview) を確認してください。以下のメソッドは **Node.js SDK** のものです。一部の機能やメソッドはすべての SDK で利用できるとは限りません。
</Warning>

***

## SDK チェックリストの概要

このガイドでは、[Kameleoon SDK のセットアップと使用](#一回限りのセットアップ（sdk-内）)、[フィーチャーフラグの設定](#一回限りのセットアップ（kameleoon-アプリ-内）)、およびオプションで [ハイブリッドモードの有効化](#2-ハイブリッドモード（任意）)（SDK + `engine.js`）を行うためのステップバイステップのチェックリストを提供します。

***

## 1. 基本

### 一回限りのセットアップ（SDK 内）

#### ステップ 1 – SDK のインストール、設定、初期化

* SDK をインストールし、以下に注意して設定します。
  * `updateInterval`: SDK が Kameleoon から最新の設定を取得する頻度を定義します。
  * `trackingInterval`: SDK が Kameleoon にトラッキングデータを送信する頻度を定義します。
* 新しい `KameleoonClient` を作成し、`initialize()` を呼び出して設定を読み込みます。
* **PHP SDK のみ:** データを収集するための [cron ジョブ](../../sdks/web-sdks/php-sdk#using-the-php-sdk-without-a-cron-job) をインストールします。

***

#### ステップ 2 – 訪問者コードを設定する

* `getVisitorCode()` またはカスタムメソッドを使用して、`kameleoonVisitorCode` Cookie を設定します。

***

#### ステップ 3（任意）– [クロスデバイス実験](../../cross-device-experimentation) と [カスタムバケットキー](../../sdks/web-sdks/nodejs-sdk#using-a-custom-bucketing-key) を有効化する

* **クロスデバイス実験:** 複数のデバイスで同じ `kameleoonVisitorCode` を共有します。
* **カスタムバケットキー:** 定義された訪問者グループ（例：同じ組織のユーザー）に同じバリエーションを表示します。

***

#### ステップ 4 – 同意を処理する

* 実験で同意が必要な場合は、`setLegalConsent()` を呼び出します。*（フィーチャーフラグタイプが Delivery ルールを使用する場合は不要です。）*

***

#### ステップ 5 – 事前定義済みデータを送信する

* `addData()` を使用して、以下をターゲット化します。

  * デバイス
  * ブラウザ
  * ページ URL
  * その他の事前定義済み条件

* `flush()` を呼び出してデータを Kameleoon に送信します。*（注：`flush` は `isFeatureActive`、`getVariation`、`trackConversion` によって暗黙的にも呼び出されます。）*

***

#### ステップ 6 – ボットを除外しタグ付けする

* `userAgent` タイプを指定した `addData()` を使用して、結果からボットを除外します。
* 内部ボットをタグ付けするには、`addData()` の `userAgent` に `curl/8.0` を渡します。

***

### 一回限りのセットアップ（[Kameleoon アプリ](https://app.kameleoon.com) 内）

#### ステップ 7 – フィーチャーフラグを作成する

* Kameleoon アプリで新しいフィーチャーフラグを作成します。
* **ロールアウトプランナー** に少なくとも 1 つの **ルール**（Delivery または Experiment）を追加します。

***

#### ステップ 8 – セグメントを定義する

* **オプション 1:** Kameleoon アプリですべての訪問者をターゲット化し、SDK でカスタムロジックを実装します。
* **オプション 2（推奨）:** Kameleoon アプリで Kameleoon セグメントを使用します。
  * SDK で `addData()` を使用して、ターゲティングに使用するデータ（ページ URL、デバイス、ブラウザなど）を送信していることを確認してください。

***

#### ステップ 9 – フラグに目標を関連付ける

* コンバージョンをトラッキングするため、少なくとも 1 つの目標を関連付けます。

***

#### ステップ 10 – フラグを有効化する

* Kameleoon アプリでフラグを **オン** にして、バリエーションの配信を開始します。

***

### 各フラグのセットアップ（SDK 内）

#### ステップ 11 – 機能の有効化を確認する

* `isFeatureActive()` を呼び出して訪問者がターゲットになっているかを確認します。

  * バリエーションが「off」の場合は `false` を返します。
  * 有効な場合は `true` を返します。

* `getVariation()` を呼び出してバリエーションキーを取得します。

***

#### ステップ 12 – コンバージョンをトラッキングし、カスタムデータを設定する

* 関連するパラメーターで `trackConversion()` を呼び出して目標を追跡します。
* オプションで、カスタムターゲティングおよびセグメンテーションに `addData()` を使用します。

***

#### ステップ 13（任意）– [以前に収集したデータ](../targeting-and-segmentation/native-segmentation#when-is-getremotevisitordata-required) または [外部データ](../targeting-and-segmentation/use-external-data-to-target-users) を使用する

* **以前に収集したデータ:** `getRemoteVisitorData()` を呼び出して、収集済みまたは事前ロード済みの条件を再利用します。
* **外部データ:** **Data API** を使用して外部データを収集し、`getRemoteData()` を介して SDK で取得します。

***

## 2. ハイブリッドモード（任意）

[**ハイブリッドモード**](./hybrid-experimentation)（クライアントサイド SDK + `engine.js`）を使用する場合のみ、以下の手順に従ってください。

### 一回限りのセットアップ（SDK 内）

#### ステップ 1 – engine.js をインストールする

* フロントエンドに `engine.js` スクリプトを追加します。

***

#### ステップ 2 – フロントエンドの同意を処理する

同意が必要な場合は、以下を使用して処理します。

* **Activation API**
* タグマネージャー経由の `kameleoonQueue`
* 直接のコードスニペット:

```js theme={null}
window.kameleoonQueue.push(['Kameleoon.API.Core.enableLegalConsent', 'BOTH']); 
// または
window.kameleoonQueue.push(['Kameleoon.API.Core.disableLegalConsent', 'BOTH']);
```

***

#### ステップ 3 – 訪問者コードを同期する

同意が **必要** な場合、SDK とフロントエンドの間で訪問者コード Cookie を同期します。

```js theme={null}
window.kameleoonQueue.push({
  level: "IMMEDIATE",
  command: () => Kameleoon.API.Visitor.setVisitorCode("<USER_ID>")
});
```

***

### 任意：外部ツールへのデータ送信（ハイブリッドモード）

#### 一回限りのセットアップ（[Kameleoon アプリ](https://app.kameleoon.com) 内）

##### ステップ 1 – サードパーティ連携を有効化する

* Kameleoon アプリの **連携** セクションで、使用したい分析ツール（例：GA4）を有効化します。

***

#### 各フラグのセットアップ（Kameleoon アプリ内）

##### ステップ 2 – 連携をオンにする

* **フィーチャーフラグダッシュボード** で、選択したルールタイプ（Experiment または Delivery）のツールを有効化します。
* 連携が正しい環境（Production、Development、Staging）で有効化されていることを確認してください。

***

#### 各フラグのセットアップ（SDK 内）

##### ステップ 3 – トラッキングコードを取得する

* 機能（`isFeatureActive` または `getVariation`）を有効化してから **5 秒以内** に、SDK コード内で `getEngineTrackingCode()` を呼び出します。

***

##### ステップ 4 – ページにトラッキングコードを挿入する

返されたコードを HTML に挿入します。

```js theme={null}
window.kameleoonQueue = window.kameleoonQueue || [];
window.kameleoonQueue.push(['Experiments.assignVariation', 244200, 962266]);
window.kameleoonQueue.push(['Experiments.trigger', 244200, true]);
```

***

##### ステップ 5 – イベント送信を確認する

* ターゲットページでページ要素を検査し、コードの挿入を確認します。
* GA4 の場合、イベントが `dataLayer` にプッシュされていることを確認します。
* **ネットワークタブ** で、イベントが正しい分析ツールに送信されていることを確認します（GA4 では「collect」イベントが表示されるはずです）。