Quick Tracking:SDK の導入と設定

基本的な SDK 情報

操作手順

1. クイック統合

QuickTracking のバックグラウンドでは、ミニプログラムごとに専用の統合コードが生成され、製品のガイダンスに従って統合できます。

製品パス

Quick Tracking の [ホーム] - [管理コンソール] に移動します。[管理コンソール] で [組織リスト] 機能を選択します。組織リストには現在作成されている組織が表示されます。アプリケーションが属する組織を見つけ、[アプリケーションの管理] 機能をクリックして [アプリケーション管理] ページに移動します。作成したアプリケーションをクリックして [統合] に進みます。

「統合解除」ボタンをクリックして新しいページにジャンプし、専用の統合コードを取得します。「次へ」をクリックし、ガイドに従って「統合検証」に入り、統合が成功したかどうかを確認します。

2 統合コードの詳細

特定の理由により上記のページにアクセスできない場合は、ドキュメントを確認してから統合する必要があります。具体的な統合コードは次のとおりです。

2.1 パラメーターの準備

appkey: アプリケーションリストから取得します

コレクションドメイン名: [管理コンソール] - [情報収集] モジュールで取得

SDK リンク: [管理コンソール] - [収集情報] モジュールで取得

2.2 SDK の導入

SDK リンクをクリックして、リンク内の JS ファイルをプロジェクトにインポートします。(推奨インポートパスは src/utils です)

const aplusConfig = {
  metaInfo: {
    'appKey': "", // プラットフォームシステムでアプリケーションを作成するときに入力する Appkey。このパラメーターは必須です。
    'trackDomain': "", // 必須。ログ収集およびレポート用のドメイン名。
    'DEBUG': true, // 収集ログを表示するかどうかを指定します。
  },
};
// initQTSDK 関数が実行されると、SDK は WeChat wx、byte tt、Alipay my などのミニプログラムのコンテキストにマウントされます。
// aplus および aplus_queue 環境変数
import { initQTSDK } from "./utils/qt_mini.umd.js";
initQTSDK(aplusConfig);

注: 初期化コードは、ライフサイクル関数ではなく、エントリファイルに配置してください。

2.3 デバイス ID の設定

ミニプログラム フレームワークの制限により、QuickTracking SDK は自動的にデバイス ID を生成しません。開発者に openid を自動的に取得する権限を付与するか、openid/unionid などの公式ミニプログラム ID をデバイス ID として手動でアップロードする必要があります。そうしないと、QT SDK はログを報告できません。

次のいずれかの方法を使用して、データを手動でアップロードできます。

注: サンプルコードは、WeChat ミニプログラムを呼び出すために使用されます。他のミニプログラムも同様のプラットフォームロジックを備えています。

const aplusConfig = {
  metaInfo: {
  ... // SDK を設定します。
  '_hold': 'BLOCK' // openid と unionid を取得した後に、ブロックされたログがレポートされます。
  ... // SDK を設定します。
  }
};
// initQTSDK 関数を実行すると、SDK は WeChat の wx、ByteDance の tt、Alipay の my など、ミニプログラムのコンテキストにマウントされます。
// aplus および aplus_queue 環境変数
import { initQTSDK } from "./utils/qt_mini.umd.js";
initQTSDK(aplusConfig);

wx.login({
  success: (res) => {
    // コードを使用して OpenID を交換します。
    if (res.code) {
      wx.request({
        url: 顧客側のバックエンドで openid を取得するために使用されるインターフェイス,
        method: "post",
        data: {
          code: res.code,
        },
        success: (res) => {
          if (res.data && res.data.openid) {
            // 取得した OpenID を後で使用するためにストレージに保存します。
            wx.setStorageSync("openId", res.data.openid);
            wx.setStorageSync("unionId", res.data.unionid);

            wx.aplus_queue.push({
              action: "aplus.setMetaInfo",
              arguments: ["_anony_id", res.data.openid],
            });
          } else {
            wx.aplus_queue.push({
              action: "aplus.setMetaInfo",
              arguments: ["_anony_id", ビジネス側で実装される擬似 ID],
            });
          }
        },
      });
    }
  },
  fail: () => {
    // 失敗メッセージ。
  },
  complete: () => {
    wx.aplus_queue.push({
      action: "aplus.setMetaInfo",
      arguments: ["_hold", "START"],
    });
  },
});

次の例は、WeChat ミニプログラムの OpenID を自動的に取得する方法を示しています：

現在、QuickTracking は WeChat ミニプログラムの openid の自動収集をサポートしています。これにはプロダクトでの権限付与が必要です。権限付与の方法は以下の通りです。クリックして、要件に従って内容を入力してください。

承認後、デバイス ID コードモードを次のように設定します。

const aplusConfig = {
  metaInfo: {
  ... // SDK を設定します。
  'autoGetOpenid': true // OpenID の自動収集を有効にします  
  ... // SDK を設定します。
  }
};

// initQTSDK 関数が実行されると、SDK は WeChat wx、byte tt、Alipay my などのミニプログラムのコンテキストにマウントされます。
// aplus および aplus_queue 環境変数
import { initQTSDK } from './utils/qt_mini.umd.js';
initQTSDK(aplusConfig);

以前に手動で openid を使用していて、上記の QuickTracking に変更して WeChat ミニプログラムの openid を自動的に収集したい場合は、次の点にも注意する必要があります。

1. メタ情報内の SDK レポートブロックロジック (with_hold=BLOCK) を削除します。

2. 以前に "_anony_id=openid" を手動で設定するためのロジックコードをコメントアウトします。つまり、wx.login から openid を取得するためのコードを削除します。

3. appKey の設定とドメイン名の受信に関するコンテンツが影響を受けないようにすることが重要です。

サンプルコードは次のとおりです。

// app.js 内
const aplusConfig = {
  metaInfo: {
  ... // SDK を設定します。
  
  //1. _hold=BLOCK による SDK ブロッキングレポートロジックを削除します
  //'_hold: 'BLOCK' // openid と unionid を取得した後に、ブロックされたログがレポートされます。
  
  ... // SDK を設定します。
  }
};
// initQTSDK 関数を実行すると、SDK は WeChat の wx、ByteDance の tt、Alipay の my など、ミニプログラムのコンテキストにマウントされます。
// aplus および aplus_queue 環境変数
import { initQTSDK } from './utils/qt_mini.umd.js';
initQTSDK(aplusConfig);

/**
2. wx.login で openid を取得する関連コードを削除します。
wx.login({
  success: (res) => {
  // コードを使用して OpenID を交換します。
  if (res.code) {
  wx.request({
  url: 顧客側のバックエンドで openid を取得するために使用されるインターフェイス,
  method: "post",
  data: {
  code: res.code,
  },
  success: (res) => {
  if (res.data && res.data.openid) {
  // 取得した OpenID を後で使用するためにストレージに保存します。
  wx.setStorageSync("openId", res.data.openid);
  wx.setStorageSync("unionId", res.data.unionid);

  wx.aplus_queue.push({
  action: 'aplus.setMetaInfo',
  arguments: ['_anony_id', res.data.openid]
  });

  } else {
  wx.aplus_queue.push({
  action: 'aplus.setMetaInfo',
  arguments: ['_anony_id', ビジネス側で実装される擬似 ID]
  });
  }
  },
  });
  }
  },
  fail: () => {
  // 失敗メッセージ。
  },
  complete: () => {
  wx.aplus_queue.push({
  action: 'aplus.setMetaInfo',
  arguments: ['_hold', 'START']
  });
  },
});
*/

2.4 ドメイン名 ホワイトリスト

WeChat ミニプログラムを例にとります。ミニプログラムのバックグラウンドにログオンし、[開発設定] > [サーバー ドメイン名ホワイトリスト] に移動し、ドメイン名をホワイトリストに追加します

3 よくある質問

3.1 オフライン SDK を取得するにはどうすればよいですか?

QuickTracking のバックグラウンドの [管理コンソール] - [情報収集] モジュールで SDK リンクを取得した後、SDK リンクをクリックし、「ctrl + s」または「command + s」でダウンロードして保存します。