> ## 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.

# Google Analytics 4 Audiences

> Google Analytics 4のオーディエンスをKameleoonに同期し、GA4セグメントに基づいて実験やパーソナライゼーションで訪問者をターゲティングできます。

この記事では、KameleoonとGoogle Analytics 4（GA4）の間にブリッジを作成し、GA4オーディエンス内の訪問者を識別してターゲティングする方法について説明します。

## 前提条件

この連携が機能するためには、Kameleoonアカウントにブリッジをセットアップする際に必要となる、以下の情報をカスタマーサクセスマネージャーに送付する必要があります：

* JSON形式のサービスアカウントの認証情報。**圧縮ツールを使用してこのファイルをパスワード保護し、ファイルとパスワードは別々に送付してください。**
* プロジェクトの[プロパティID](https://developers.google.com/analytics/devguides/reporting/data/v1/property-id)。
* Kameleoonプロジェクトの[サイトコード](../../../faq#how-do-i-find-my-sitecode)。

## ステップ1：サービスレベルアカウントによる認証をセットアップする

技術的なユーザーアカウントにGoogle Analyticsアカウントへのアクセス権と、利用可能なAPI経由でデータを取得する権限を付与するためには、以下が必要です：

* プロジェクトとサービスアカウントを生成するために使用する、Google Analyticsへの管理者アクセス権を持つメールアカウント。
* このアカウントに対する、すべての必要なオーディエンス（GA4内）へのアクセス権。

### Google Cloud Consoleでプロジェクトを作成する

APIを有効化してトークンを作成するためには、Google Cloud Consoleで新しいプロジェクトを作成する必要があります。

[こちら](https://console.cloud.google.com/home)のURLにアクセスします。管理者のメールアカウントでログインし、新しいプロジェクトを作成します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/0.png)
</Frame>

プロジェクトに名前を付け、組織と場所を選択します。

### 適切なAPIを有効化する

特定のメールアドレスでAPIを利用するためには、Google Cloud Consoleでそれらを有効化する必要があります。まず **Library** をクリックします。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/1.png)
</Frame>

検索バーで以下の3つのAPIを検索して有効化します：

* Google Analytics Reporting API
* Google Analytics Data API
* Google Analytics API

### サービスレベルアカウントを作成する

GA4 Reporting APIリクエストを完全に自動化するために、認証コールバックを回避するサービスレベルアカウントを作成する必要があります。

このアカウントを作成するには、**IAM & Admin** > **Service accounts** をクリックします。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/2.png)
</Frame>

次に、**Create service account** をクリックします。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/3.png)
</Frame>

次に、アカウントの名前を入力します。サービスメールは自動的に生成されます。アカウントの目的が明確になるように説明を追加することを推奨します。

そして、サービスアカウントのロールを選択します。Kameleoonのブリッジはプロジェクトリソース自体ではなくGoogle APIの利用のみを必要とするため、**viewer** を選択することを推奨します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/4.png)
</Frame>

アカウントが作成されたら、**Keys** をクリックします。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/5.png)
</Frame>

次に、**Add key** > **Create a new key** をクリックしてダウンロード可能なキーを生成します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/6.png)
</Frame>

**JSON** 形式を選択し、**Create** をクリックしてキーを生成します。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/7.png)
</Frame>

キーがマシンにダウンロードされます。

次に、これらの認証情報をJSON形式でKameleoonカスタマーサクセスマネージャーに送付します。**圧縮ツールを使用してこのファイルをパスワード保護し、パスワードはファイルとは別に送付してください**。

### プロパティに対するサービスアカウントのViewer権限を付与する

Google Analytics 4のプロパティアクセス管理ページにアクセスするには：

1. GA4アカウントにサインインします。
2. 管理する特定のGA4プロパティを選択します。
3. 管理設定にアクセスします。
4. **Property User Management** または **Property Access Management** オプションを探します。
5. **+** > **Add user** をクリックします。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/8.png)
</Frame>

6. **Email addresses** フィールドに、アクセスが必要なサービスアカウントに関連付けられたメールアドレスを入力します。
7. **Standard roles** セクションで **Viewer** を選択します。
8. **Add** をクリックします。

## ステップ2：GA4カスタムディメンションへKameleoon visitorcodeをプッシュする

次に、各訪問者のKameleoon `visitorCode` をカスタムディメンションを介してGA4に送信するようにブリッジを構成する必要があります。

### gtag.jsを使用する

#### 1. visitorCodeをGA4にプッシュする

以下のコードを [Kameleoonのグローバルカスタムスクリプト](../../../project-management/manage-your-projects#configuration) セクションに追加する必要があります：

```javascript theme={null}
      if (Kameleoon.API.CurrentVisit.pageViews === 1) {
    Kameleoon.API.Core.runWhenConditionTrue(
      function () {
        return typeof window.google_tag_data !== "undefined";
      },
      function () {
        gtag.push({ 'event': 'Kameleoon Visitor Code', 'kameleoon_visitor_code': Kameleoon.API.Visitor.code });
      },
      500
    );
  }
```

#### 2. GA4でカスタムディメンションを作成する

各訪問者のKameleoon `visitorCode` を受け取るために使用するカスタムディメンションを作成する必要があります。ディメンションスコープを **User** に設定し、**Kameleoon Visitor Code** と名付け、User propertyとして **`kameleoon_visitor_code`** を入力します。

### Google Tag Managerを使用する

#### 1. visitorCodeをdataLayerにプッシュする

以下のコードを [Kameleoonのグローバルカスタムスクリプト](../../../project-management/manage-your-projects#configuration) セクションに追加する必要があります。

```javascript theme={null}
 if (Kameleoon.API.CurrentVisit.pageViews === 1) {
   Kameleoon.API.Core.runWhenConditionTrue(
     function () {
       return typeof window.google_tag_manager !== "undefined";
     },
     function () {
       dataLayer.push({ 'event': 'Kameleoon Visitor Code', 'kameleoon_visitor_code': Kameleoon.API.Visitor.code });
     },
     500
   );
 }
```

#### 2. GTM変数を追加する

まず、GTMでKameleoon `visitorCode` のための変数を作成する必要があります。**Variables** へ移動し、新しい Data Layer Variable を作成します。

* **Name：** `kameleoon_visitor_code`
* **Variable configuration：**
  * **Type：** Data Layer Variable
  * **Data Layer Variable Name：** Kameleoon Visitor Code

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-source/analytics/google-analytics-4-audiences/Capture-decran-2024-07-22-a-12.03.17.png)
</Frame>

変数はData Layerから値を取得するように設定する必要があります。

#### 3. GTMでタグを作成する

次に、タグを作成し、このデータをGA4にプッシュする必要があります。

##### 1. 変数を作成する

1. **GTMへ移動：** Google Tag Managerを開き、コンテナへ移動します。
2. **Variablesへ移動：** 左側のメニューで **Variables** をクリックします。
3. **新しい変数を作成：** **User-Defined Variables** の下で **New** をクリックします。
4. **変数の種類を選択：** **Variable Configuration** をクリックし、**Data Layer Variable** を選択します。
5. **変数を構成：**
   * **Name：** `kameleoon_visitor_code`
   * **Variable type：** Data Layer Variable
   * **Data Layer Variable Name：** Kameleoon Visitor Code
6. 変数を **Save** します。

##### 2. トリガーを作成する

1. **Triggersへ移動：** 左側のメニューで **Triggers** をクリックします。
2. **新しいトリガーを作成：** **New** をクリックします。
3. **トリガーの種類を選択：** **Trigger Configuration** をクリックし、**Custom Event** を選択します。
4. **トリガーを構成：**
   * **Trigger name：** トリガーにわかりやすい名前を付けます（例：「Page Type is Product」）。
   * **Event name：** トリガーの基にしたいイベント名を入力します。任意のイベントで起動させたい場合は空のままにしておきます。
   * **This trigger fires on：** **Some Custom Events** を選択します。
   * **Conditions：** `dataLayer` 変数の条件を設定します。

訪問者コードに対応する正規表現： `/^[a-z0-9]{16}$/`

5. **トリガーを保存：** **Save** をクリックします。

##### 3. トリガーをタグに添付する

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-source/analytics/google-analytics-4-audiences/step4-1536x988.png)
</Frame>

1. **Tagsへ移動：** 左側のメニューで **Tags** をクリックします。
2. **タグを作成または編集：** タグを作成するか、既存のタグを編集します。
3. **トリガーを添付：**
   * タグの構成で **Triggering** セクションまでスクロールします。
   * **Triggering** をクリックし、作成したトリガーを選択します。
4. **タグを保存：** **Save** をクリックします。

## ステップ3：KameleoonでGA4オーディエンスを使用するためのカスタムデータを作成する

KameleoonでGA4オーディエンスを使用するためには、Kameleoonで[カスタムデータ](../../../assets/custom-data/create-custom-data)をセットアップする必要があります。

カスタムデータを **GA4 Audiences** と名付け、取得方法 **Custom JavaScript code** を選択します。

カスタムデータは **list of** および **strings** タイプに設定し、スコープは **visit** または **page** に設定できます（**page** に設定した場合、ページが読み込まれるたびに再評価されます）。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/9.png)
</Frame>

カスタムデータの取得方法に以下のコードを使用します：

```javascript theme={null}
 Kameleoon.API.Data.retrieveDataFromRemoteSource(Kameleoon.API.Visitor.code, function(data) {
     for (const [key, value] of Object.entries(data)) {
         Kameleoon.API.Data.setCustomData('GA4 Audiences',key)
     }
 });
 return { "value": null} 
```

**Next** をクリックして、**Save the values for the targeting condition associated with the custom data point** オプションを有効化します。以下のJavaScriptコードを追加し、`[SITECODE]` をKameleoonのサイトコードに置き換えます。サイトコードの見つけ方については、[こちら](../../../faq#how-do-i-find-my-sitecode)の記事を参照してください。

また、`[WEB_PROPERTY]` を正しい [GA4プロパティID](https://developers.google.com/analytics/devguides/reporting/data/v1/property-id) に置き換えてください。

```javascript theme={null}
var xhr = new XMLHttpRequest();

xhr.open(
  "GET",
    "https://integrations.kameleoon.com/ga4-audience?sitecode=[SITECODE]&web_property=[WEB_PROPERTY]",
  false
);

var GA4Audiences = [];

xhr.onreadystatechange = function () {
  if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
    var audiences = JSON.parse(xhr.response);

    audiences.map(function (audience) {
      if (audience) {
        GA4Audiences.push({ value: audience, label: audience });
      }
    });
  }
};

xhr.send();

return GA4Audiences;
```

**Save** をクリックしてカスタムデータを作成します。

これで、セグメントビルダーでカスタムデータを選択し、**is among the values** を選択することで、GA4のすべてのオーディエンス名のリストが表示され、KameleoonキャンペーンでGA4オーディエンスを利用して訪問者をターゲティングできるようになります。

<Frame>
  ![](https://storage.googleapis.com/kameleoon-storage-documentation/user-manual/images/integrations/as-a-destination/analytics/google-analytics-4/google-analytics-4-audiences/10.png)
</Frame>

### サーバーサイド用の外部セグメント同期

KameleoonのSDKの1つでGA4オーディエンスを使用したい場合は、各SDKのドキュメントのガイドラインに従い、[`getRemoteData()`](../../../../developer-docs/sdks/mobile-sdks/ios-sdk#getremotedata) メソッドを使用する必要があります。
