IBM Tealeaf UI Capture SDK Release 5.6.0 の作成方法

この記事では2019年9月にリリースされたIBM Tealeaf (Acoustic Experience Analytics) UI Capture SDK Release 5.6.0 の構成手順について記載します。
なお当リリースからこれまで提供されていたJQuery版は無くなり、w3c版のみとなりました。

1. UI Capture SDKの入手

以下のURLからUI Capture SDK 5.6.0 (cxUICaptureJS.zip)をダウンロードし解凍します。

2. JSファイルの作成

解凍したディレクトリ内のW3C/tealeaf.jsをコピーし、適当なファイル名（ここではtealeaf_5.6.0.js）を指定して保存します。
そのファイルの最後に解凍ディレクトリ内のdefaultconfiguration.jsファイルの内容を追加します。

3. Pakoライブラリーの入手と設定

以下のURLからPakoライブラリーを入手します。
https://github.com/nodeca/pako/blob/master/dist/pako_deflate.min.js

入手したライブラリーのコードを#2で作成したJSファイルの先頭に追加します。

4. JSファイルの編集

JSファイルのパラメーターを設定します。

①TLCookieモジュールを有効化（enabledをfalseからtrueに変更）

tealeaf_5.6.0.js

TLCookie: {
    enabled: true
}

②endpoint：データポスト先のURLを指定。以下はAustraliaデータセンターの例。
③encoder: "gzip" を追加

tealeaf_5.6.0.js

queues: [
    {
        qid: "DEFAULT",
        endpoint: "https://aucollector.tealeaf.ibmcloud.com/collector/collectorPost",
        maxEvents: 50,
        timerInterval: 300000,
        maxSize: 0,
        checkEndpoint: false,
        endpointCheckTimeout: 3000,
        encoder: "gzip"
    }

④domCaptureを有効化（enabledをfalseからtrueに変更）

tealeaf_5.6.0.js

replay: {
    // DOM Capture configuration
    domCapture: {
        /**
         * NOTE: Enabling DOM Capture has significant implications on data transmission and infrastructure.
         * Hence this feature should be enabled judiciously. If enabled, it requires further configuration
         * to only perform the DOM Capture based on specific events and elements. Please refer to the
         * documentation for more details.
         */
        enabled: true,

⑤tlAppKeyを設定（アプリケーション固有の値を指定）

tealeaf_5.6.0.js

TLCookie: {
    appCookieWhitelist: [
        { regex: ".*" }
    ],
    tlAppKey: "xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
}

基本的な構成手順は以上になります。
後は要件に応じてマスキング設定やパラメーター調整を行います。