【Unity】WebGLでGoogle Analytics(GA4)へカスタムイベントを送信する

はじめに

WebGL以外のプラットフォームであればFirebaseUnitySDKを使うことができるので、公式ドキュメントに従うことでGoogle Analyticsを利用することができるのですが、WebGLプラットフォームには非対応のため、Jslib側からイベントを発行する必要があります。

実装方法

先ずは、以下スクリプトを適当なゲームオブジェクトをアタッチし、InspectorでGoogleAnalyticsの計測IDを入力しておきます。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Runtime.InteropServices;
using Newtonsoft.Json;
using UnityEngine;
using UnityEngine.UI;

public class GA4Manager : MonoBehaviour
{
    [DllImport("__Internal")]
    private static extern void InitializeGoogleAnalytics(string measurementId);

    [DllImport("__Internal")]
    private static extern void LogGA4Event(string eventName, string eventParams);

    [SerializeField] private Button[] _eventButtons;
    [SerializeField] private string _measurementId;
    private void Start()
    {
        // GoogleAnalyticsイベント送信準備
        InitializeGoogleAnalytics(_measurementId);

        // ボタン押下でLogEvent(ボタン番号)が実行されるようにイベント登録
        _eventButtons.ToList()
            .ForEach(button => button.onClick.AddListener(
                () => LogEvent(Array.IndexOf(_eventButtons, button)
                )));
    }


    private void LogEvent(int buttonNo)
    {
        Dictionary<string, string> eventParams = new()
        {
            { "button_no", buttonNo.ToString() },
            { "send_to", _measurementId }
        };
        string jsonString = JsonConvert.SerializeObject(eventParams);

#if UNITY_WEBGL && !UNITY_EDITOR
        LogGA4Event("EventButtonClick", jsonString);
#endif
    }
}

{ "button_no", buttonNo.ToString() },の様に{パラメータ名,パラメータ値}を設定することができます。

次にPluginsフォルダに以下のjslibファイルを格納します。

var GoogleAnalytics = {
    // Google Analyticsを初期化する
    InitializeGoogleAnalytics: function(measureIdPtr) {
        // 渡されたポインターから文字列に変換
        var measureId = UTF8ToString(measureIdPtr);
        var scriptTag = document.createElement('script');
        scriptTag.async = true;
        // Google Analyticsのスクリプトを読み込むURLを設定
        scriptTag.src = 'https://www.googletagmanager.com/gtag/js?id=' + measureId;

        // Google Analyticsスクリプトがロードされたときに実行される関数
        scriptTag.onload = function () {
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', measureId);
        };
        document.head.appendChild(scriptTag);
    },

    // イベントの送信
    LogGA4Event: function(eventNamePtr, eventParamsPtr) {
        var eventName = UTF8ToString(eventNamePtr);
        var eventParams = UTF8ToString(eventParamsPtr);
        var eventParamsObj = eventParams ? JSON.parse(eventParams) : {};
        gtag('event', eventName, eventParamsObj);
    }
};

// GoogleAnalyticsオブジェクトをLibraryManagerのライブラリに追加します
mergeInto(LibraryManager.library, GoogleAnalytics);

これでC#スクリプトにアタッチしたボタンに応じて、パラメータ名"button_no"がボタン番号として設定されたEventButtonClickイベントが発行されます。

以上