> ## 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.
# Segment JavaScript トラッカー
> Kameleoon の実験データを Segment に送信し、Segment のペルソナ、トレイト、イベントを Kameleoon でターゲティングやキャンペーン分析に活用します。
この統合を利用すると、Kameleoon と [Segment](https://segment.com/) をシームレスに連携し、次のことが可能になります。
* Kameleoon をソースとして利用し、キャンペーンエクスポージャーイベントデータ（キャンペーン名およびバリエーション名）を [Segment](https://segment.com/) にプッシュします。これにより、[Segment](https://segment.com/catalog/) マーケットプレイスで利用可能な他のプラットフォームでも活用できます。
* Kameleoon を宛先（デスティネーション）として利用し、以下を実現します。
* Segment のイベントをインポートし、Kameleoon の実験や Web パーソナライゼーションで利用します。
* Segment のペルソナ、トレイト、グループをインポートし、カスタムデータを通じて当社の Segment ビルダー全体で利用します。
**主なメリット:**
* KPI を含むあらゆるデータを Segment から Kameleoon に自動送信し、高度にトラッキングされターゲティングされた最適化キャンペーンを作成できます。
* Segment のイベントデータでターゲティングを強化し、A/B/n テストの結果を分析できます。
* テストキャンペーンがカスタマージャーニー全体に与える影響を分析できます。
* Kameleoon が送信する Segment イベントを利用して、オンラインキャンペーンに接触した訪問者に他のチャネル（例: メールマーケティングキャンペーン、モバイルアプリ）でリーチできます。
## Kameleoon のエクスポージャーイベントを Segment にプッシュする
### Kameleoon で Segment 統合を有効化する
1. Kameleoon アプリにログインします。
2. **Admin** > **Integrations** > **Install the tool** をクリックします。
3. Segment を設定したいプロジェクトを選択します。
4. **Validate** をクリックします。
ツールの行の右側に **ON** トグルが表示され、ツールが設定されているプロジェクトの数が表示されます。
Kameleoon は Segment の [JavaScript API](https://segment.com/docs/connections/sources/catalog/libraries/website/javascript/) を使用してキャンペーンエクスポージャーイベントを Segment に送信するため、Segment スクリプト（analytics.js）がページにインストールされていることを確認してください。
### Segment を Kameleoon の実験またはパーソナライゼーションのレポートツールとして関連付ける
Integrations ページで統合を有効化したら、グラフィック/コードエディタの仕上げパネルの **Integrations** タブでレポートツールとして選択できます。
キャンペーンで Segment を有効化しレポートツールとして定義すると、訪問者がアクティブな Kameleoon A/B 実験のバリエーションを表示するたびに、「**Experiment viewed**」というイベントが自動的に送信されます。
フィーチャーフラグのエクスポージャーイベントを送信する必要がある場合は、[ハイブリッド機能](../../../../../developer-docs/feature-experimentation/get-started/hybrid-experimentation)を有効にする必要があります。
### プロジェクトのサイトコードを取得する
Kameleoon アカウントでサイトコードも取得する必要があります。
サイトコードの確認方法については、[こちらのドキュメントをご覧ください](../../../../faq#how-do-i-find-my-sitecode)。
### Segment アプリで Kameleoon をデスティネーションとして設定する際にこの情報を入力する
1. Segment アプリの **Destinations Catalog** から **Add Destination** をクリックします。
2. **Destinations Catalog** で Kameleoon を検索し、Kameleoon デスティネーションを選択します。
3. **Configure Kameleoon** をクリックします。
4. Kameleoon デスティネーションにデータを送信する **Source**（例: アプリまたは Web サイト）を選択します。
5. Segment の Kameleoon デスティネーション設定で、**API Key** および **sitecode** を入力します。
### Kameleoon と Segment 間でユーザーをマッチングする
この統合では、両ツールで同じ識別子のシステムを使用する必要があります。つまり、Segment に渡す **`userId`** の値は、Kameleoon が\*\*「ビジター」\*\*を識別するために使用する値と同じである必要があります。
Kameleoon Web Experiment を使用する場合、Kameleoon は訪問者にランダムに割り当てられる Kameleoon **`visitorCode`** と呼ばれる匿名の一意の識別子を含む Cookie を配置します。この ID はブラウザ内でユーザーを一意に識別するために使用されます。いくつかのオプションがあります。
* [Segment identify call](https://segment.com/docs/connections/spec/identify/) の `userId` プロパティに当社の `visitorCode` を渡すことで、Kameleoon が Segment から受信したすべてのイベントデータを正しいビジターに帰属させることができます。
* 次のように追加の Segment 呼び出しで当社の `visitorCode` を渡すこともできます: `analytics.track('Kameleoon identifier', {'k_visitorCode': Kameleoon.API.Visitor.code})`。Kameleoon は Segment のユーザー ID または匿名 ID を当社の `visitorCode` に自動的にリンクします。セッションごとに 1 回のみ呼び出されるようにしてください。たとえば、Kameleoon Web Experimentation を使用している場合、または[ハイブリッド実験](../../../../../developer-docs/feature-experimentation/get-started/hybrid-experimentation)機能を活用するために Kameleoon アプリケーションファイル（kameleoon.js）を実装している場合は、Kameleoon プロジェクトプロパティの[グローバルカスタムスクリプトセクション](../../../../project-management/manage-your-projects#configuration)で以下のコード例を使用できます。
```javascript theme={null}
Kameleoon.API.Core.runWhenConditionTrue(
() => window.analytics && window.analytics.track && window.analytics.user,
() => {
const kSegmentioIdentifier = window.localStorage.getItem('k_segmentio_identifier');
if(kSegmentioIdentifier && kSegmentioIdentifier === window.analytics.user().anonymousId()) return;
window.localStorage.setItem('k_segmentio_identifier', window.analytics.user().anonymousId());
window.analytics.track('Kameleoon identifier', {'k_visitorCode': Kameleoon.API.Visitor.code})
}
);
```
[Kameleoon Feature Experimentation](https://www.kameleoon.com/platform/feature-experimentation/) を使用している場合は、[Kameleoon SDK ドキュメント](../../../../../developer-docs/feature-experimentation/get-started/overview)を参照してください。生成された Kameleoon Visitor Code を使用する代わりに独自の ID を設定でき、Segment と Kameleoon の間で全く同じ ID を持つことができます。
### サポートされている Segment イベントとペルソナ
Kameleoon は、[Segment Spec](https://segment.com/docs/connections/spec) で指定されている Track、Identify、Page、Screen、および Group の各メソッドをサポートしています。
Segment のイベント名が Kameleoon アカウントに存在する[ゴール](../../../../assets/goals/create-a-goal)の名前と一致する場合、このゴールのコンバージョンがビジターに関連付けられます。ゴールが存在しない場合、Kameleoon は Segment のイベント名を使用して[カスタムゴール](../../../../assets/goals/create-a-goal#custom-goal)を作成し、コンバージョンをビジターに関連付けます。ゴールは **`SegmentIO [eventType] - [eventName]`** という命名規則で Kameleoon の[ゴールページ](../../../../assets/goals/manage-goals)に表示されます。ゴールが作成されると、任意の[キャンペーン](../../../../assets/goals/set-up-a-goal-campaign)で使用できます。
[Audience Entered](https://segment.com/docs/personas/using-personas-data/#event-destinations)、[Audience Exited](https://segment.com/docs/personas/using-personas-data/#event-destinations)、[Identify](https://segment.com/docs/connections/spec/identify/)、および [Group](https://segment.com/docs/connections/spec/group/) タイプの Segment トラックコール。これらは Kameleoon の[カスタムデータ](../../../../assets/custom-data/create-custom-data)として収集されます。
Segment は当社の [Data API map エンドポイント](/api-reference/map/update-data-for-several-keys)を使用して Kameleoon にデータを送信します。
#### ペルソナ、トレイト、グループ
Kameleoon では、[Segment ペルソナ](https://segment.com/docs/personas/)、グループ、または特定のプロパティに基づいてユーザーをターゲティングできます。
当社の Segment ビルダーでペルソナ、トレイト、グループ ID を使用するには、選択したプロジェクト用の Kameleoon アカウントで[カスタムデータを設定する](../../../../assets/custom-data/create-custom-data)必要があります。
##### ペルソナ
ペルソナに名前を付け（例: SegmentIO personas）、カスタムデータの種類は **List of string** にする必要があります。
以下のガイドラインは Web Experimentation のみに適用してください。
カスタムデータ取得メソッドで以下のコードを使用できます。
```javascript theme={null}
window.k_segmentIO = window.k_segmentIO || {};
if(!window.k_segmentIO.runtime)
{
window.k_segmentIO.runtime = true;
```
セットアップに応じて、ユーザー ID を取得するための適切なロジックを決定する必要があります。
当社のビジターコードを送信するためにトラックイベントコールを使用している場合は、次の行を使用します。
`const user_id = Kameleoon.API.Visitor.code;`
または、当社の Visitor Code を Segment のユーザー ID として使用している場合や、Segment の analytics オブジェクトからユーザー ID を取得する必要がある場合は、次のコードを使用します。
```javascript theme={null}
const user_id = window.analytics.user().id() || window.analytics.user().anonymousId();
Kameleoon.API.Data.retrieveDataFromRemoteSource(`COHORTS_${user_id}`, cohorts => { window.k_segmentIO.cohorts = cohorts && cohorts !== '{}' ? Object.keys(cohorts).filter(key => cohorts[key]) : []; });``
}
if(!window.k_segmentIO.cohorts || !window.k_segmentIO.cohorts.length) return;
return {"value": window.k_segmentIO.cohorts, "overwrite": true};
```
サーバーサイド実験やフィーチャーフラグで Segment ペルソナを使用するには、各 SDK のドキュメントに記載されているガイドラインを参照してください。
当社の SDK は `getRemoteData()` メソッドを利用します。このメソッドは、Segment が当社のサーバーに保存したデータを取得し、バックエンドコードからアクセス可能にします。
第 1 パラメータとして使用する「key」値は、次の形式に従う必要があります: `COHORTS_{user_id}`。
##### Kameleoon で Segment ペルソナ名を取得する
**Next** をクリックし、**Save the values for the targeting condition associated with the custom data point** オプションを有効にします。以下の JS コードを追加し、`XXXXXXXXX` を Kameleoon サイトコードに置き換えます。サイトコードを確認するには、[こちらのドキュメントを参照してください](../../../../faq#how-do-i-find-my-sitecode)。
```javascript theme={null}
var xhr = new XMLHttpRequest();
xhr.open("GET", '[https://api-data.kameleoon.com/data?key=common&siteCode=XXXXXXXXX](https://api-data.kameleoon.com/data?key=common&siteCode=XXXXXXXXX)', false);
var SegmentIOPersonas = [];
xhr.onreadystatechange = function() {
if(this.readyState === 4) {
var segmentIOcohorts = JSON.parse(xhr.response);
if (segmentIOcohorts && segmentIOcohorts.cohorts) {
segmentIOcohorts.cohorts.forEach(persona => SegmentIOPersonas.push({value: persona, label: persona}) );
}
}
}
xhr.send();
return SegmentIOPersonas;
```
**Validate** をクリックしてカスタムデータを作成します。
これで完了です！ 当社の Segment ビルダーで [Segment Personas](https://segment.com/docs/personas/) を使用できるようになりました。利用可能なペルソナのリストは、演算子 **is among the values** を選択すると表示されます。
##### トレイト
当社の Segment ビルダーでトレイトを使用するには、トレイトタイプごとに 1 つのカスタムデータを作成する必要があります。たとえば、Web サイトで購読しているプランに基づいてユーザーをターゲティングしたいとします。freemium、scale、enterprise の 3 つの異なるプランがあるとしましょう。「Subscribed Plan」という名前の[カスタムデータを設定する](../../../../assets/custom-data/create-custom-data)必要があり、カスタムデータの種類は「string」にする必要があります。
以下のガイドラインは Web Experimentation のみに適用してください。
カスタムデータ取得メソッドで以下のコードを使用できます。
```javascript theme={null}
window.k_segmentIO = window.k_segmentIO || {};
if(!window.k_segmentIO.runtime)
{
window.k_segmentIO.runtime = true;
```
セットアップに応じて、ユーザー ID を取得するための適切なロジックを決定する必要があります。
当社のビジターコードを送信するためにトラックイベントコールを使用している場合は、次の行を使用します。
`const user_id = Kameleoon.API.Visitor.code;`
または、当社の Visitor Code を Segment のユーザー ID として使用している場合や、Segment の analytics オブジェクトからユーザー ID を取得する必要がある場合は、次の行を使用します。
```javascript theme={null}
const user_id = window.analytics.user().id() || window.analytics.user().anonymousId();
Kameleoon.API.Data.retrieveDataFromRemoteSource(`IDENTIFY_${user_id}`, segment_identify_properties => {
if(segment_identify_properties && segment_identify_properties.traits && segment_identify_properties.traits.plan){
window.k_segmentIO.plan = segment_identify_properties.traits.plan;
}
});
}
if(!window.k_segmentIO.plan) return;
return {"value": window.k_segmentIO.plan, "overwrite": true};
```
サーバーサイド実験やフィーチャーフラグでトレイトを使用するには、各 SDK のドキュメントに記載されているガイドラインを参照してください。
当社の SDK は **`getRemoteData()`** メソッドを利用します。このメソッドは、Segment が当社のサーバーに保存したデータを取得し、バックエンドコードからアクセス可能にします。
第 1 パラメータとして使用する「key」値は、次の形式に従う必要があります: `IDENTIFY_{user_id}`。
Kameleoon の Segment ビルダーで使用したいすべてのトレイトプロパティについて、同じガイドラインに従うことができます。
##### グループ ID
キャンペーンをターゲティングするために当社の Segment ビルダーでグループ ID を使用するには、「Group ID」という名前の[カスタムデータを設定する](../../../../assets/custom-data/create-custom-data)必要があり、カスタムデータは **string** 型にする必要があります。
以下のガイドラインは Web Experimentation のみに適用してください。
カスタムデータ取得メソッドで以下のコードを使用できます。
```javascript theme={null}
window.k_segmentIO = window.k_segmentIO || {};
if(!window.k_segmentIO.runtime)
{
window.k_segmentIO.runtime = true;
```
セットアップに応じて、ユーザー ID を取得するための適切なロジックを決定する必要があります。
当社のビジターコードを送信するためにトラックイベントコールを使用している場合は、次の行を使用します。
`const user_id = Kameleoon.API.Visitor.code;`
または、当社の Visitor Code を Segment のユーザー ID として使用している場合や、Segment の analytics オブジェクトからユーザー ID を取得する必要がある場合は、次の行を使用します。
```javascript theme={null}
const user_id = window.analytics.user().id() || window.analytics.user().anonymousId();
Kameleoon.API.Data.retrieveDataFromRemoteSource(`IDENTIFY_${user_id}`, segment_identify_properties => {
if(segment_identify_properties && segment_identify_properties.groupId){
window.k_segmentIO.groupId = segment_identify_properties.groupId;
}
});
}
if(!window.k_segmentIO.groupId) return;
return {"value": window.k_segmentIO.groupId, "overwrite": true};
```
サーバーサイド実験やフィーチャーフラグでトレイトを使用するには、各 SDK のドキュメントに記載されているガイドラインを参照してください。
当社の SDK は **`getRemoteData()`** メソッドを利用します。このメソッドは、Segment が当社のサーバーに保存したデータを取得し、バックエンドコードからアクセス可能にします。
第 1 パラメータとして使用する「key」値は、次の形式に従う必要があります: `IDENTIFY_{user_id}`。