Flutter视觉追踪与分析插件visenze_tracking_sdk的使用

Flutter视觉追踪与分析插件visenze_tracking_sdk的使用

Visenze Analytics 是您分析解决方案的重要组成部分，允许您跟踪关键事件并查看由此产生的分析和性能数据。

ViSenze 跟踪 SDK 是一个开源软件，便于将 ViSearch 跟踪 API 集成到您的 Flutter 应用程序中。有关源代码和参考，请访问 GitHub 仓库。

目录

• 安装
• 导入
• 设置用户ID
• 获取跟踪数据
• 发送事件
• 事件参数
• 示例

概述

Visenze Analytics 是您分析解决方案的重要组成部分，允许您跟踪关键事件并查看由此产生的分析和性能数据。

ViSenze 跟踪 SDK 是一个开源软件，便于将 ViSearch 跟踪 API 集成到您的 Flutter 应用程序中。有关源代码和参考，请访问 GitHub 仓库。

使用

安装

运行以下命令：

flutter pub add visenze_tracking_sdk

导入

import 'package:visenze_tracking_sdk/visenze_tracker.dart';

Future<void> init() async {
  var tracker = await VisenzeTracker.create('MY_APP_KEY:MY_PLACEMENT_ID');
}

设置用户ID

userId（用户标识符）驱动诸如 A/B 测试和个人化等功能。默认情况下，我们根据用户的浏览器/设备信息生成 userId。但是，为了与您的内部记录更好地同步数据，您可以设置自己的 userId。通过使用自己的 userId，可以增强数据集成并与其系统对齐。这种灵活性使跟踪和分析无缝进行，最大化平台在现有基础设施中的效益。

要设置自己的 userId，请使用以下代码：

tracker.userId = 'MY_UID';

获取跟踪数据

您还可以选择检索自动生成的用户ID和会话ID。要获取用户ID和会话ID，请使用以下代码：

String uid = tracker.userId;
String sid = tracker.sessionId;

发送事件

所有发送到 Visenze Analytics 服务器的事件都需要在搜索结果响应中找到的搜索查询ID（即 reqid）作为请求参数的一部分。

某些事件（例如 product_click 或 product_view）可能需要额外的参数，如 pid（产品ID）。

单个事件

用户操作可以通过事件处理器发送。注册事件处理器以供用户交互的元素使用。

// 发送产品点击事件
tracker.sendEvent('product_click', {
  'queryId': '<搜索 reqid>',
  'pid': '<你的产品ID>', // 对于产品点击事件是必需的
  'pos': 1, // 产品在搜索结果中的位置，从1开始
});

// 发送产品印象事件
tracker.sendEvent('product_view', {
  'queryId': '<搜索 reqid>',
  'pid': '<你的产品ID>', // 对于产品印象事件是必需的
  'pos': 1, // 产品在搜索结果中的位置，从1开始
});

// 发送交易事件（例如订单购买300元）
tracker.sendEvent('transaction', {
  'queryId': "<搜索 reqid>",
  'transId': "<你的交易ID>",
  'value': 300
});

// 发送添加到购物车事件
tracker.sendEvent('add_to_cart', {
  'queryId': '<搜索 reqid>',
  'pid': '<你的产品ID>',
  'pos': 1, // 产品在搜索结果中的位置，从1开始
});

// 发送自定义事件
tracker.sendEvent('favourite', {
  'queryId': '<搜索 reqid>',
  'pid': '自定义事件标签',
  'cat': '<产品类别>'
});

// 处理成功或错误
try {
  await tracker.sendEvent('product_view', {
    'queryId': '1234',
    'pid': '产品ID',
    'pos': 1
  });
  onRequestSuccess() // 处理成功情况
} catch (errResponse) {
  onRequestError(errResponse) // 处理错误情况
}

批量事件

批量操作可以通过批处理事件处理器发送。

此批处理事件方法的一个常见用例是通过批量发送来组合所有交易。此 SDK 将自动生成一个 transId 来将交易分组为一个订单。

const transactions = [
  {'queryId': '1234', 'pid': 'Pid 1', 'value': 50},
  {'queryId': '1234', 'pid': 'Pid 2', 'value': 100}
];
tracker.sendEvents('transactions', transactions);

事件参数

有关事件参数的详细列表，请参阅此 文档。

示例

import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:visenze_tracking_sdk/visenze_tracker.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  [@override](/user/override)
  MyAppState createState() => MyAppState();
}

class MyAppState extends State<MyApp> {
  String _trackerSid = '<未知>';
  String _trackerUid = '<未知>';
  String _requestResult = '<未知>';

  final TextEditingController _eventController =
      TextEditingController(text: 'product_click');
  final TextEditingController _paramsController =
      TextEditingController(text: '{"pid": "Test PID", "queryId": "1234"}');

  late VisenzeTracker tracker;

  [@override](/user/override)
  void initState() {
    super.initState();
    initTracker();
  }

  // 工厂方法是异步的，所以我们将其放在异步方法中。
  Future<void> initTracker() async {
    tracker = await VisenzeTracker.create('APP_KEY:PLACEMENT_ID');

    setState(() {
      _trackerSid = tracker.sessionId;
      _trackerUid = tracker.userId;
    });
  }

  void onRequestSuccess() {
    setState(() {
      _requestResult = '请求成功';
    });
  }

  void onRequestError(dynamic err) {
    setState(() {
      _requestResult = '请求失败: $err';
    });
  }

  Future<void> sendEvent() async {
    try {
      await tracker.sendEvent(
          _eventController.text, jsonDecode(_paramsController.text));
      onRequestSuccess();
    } catch (err) {
      onRequestError(err);
    }
  }

  Future<void> resetSession() async {
    tracker.resetSession();
    setState(() {
      _trackerSid = tracker.sessionId;
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
          appBar: AppBar(
            title: const Text('跟踪SDK演示'),
          ),
          body: SingleChildScrollView(
            child: Container(
                height: 800,
                padding: EdgeInsets.all(15),
                child: ListView(
                  children: <Widget>[
                    Text('会话ID: $_trackerSid'),
                    Text('用户ID: $_trackerUid'),
                    const Padding(padding: EdgeInsets.all(4)),
                    TextButton(
                        onPressed: resetSession,
                        child: const Text('重置会话')),
                    const Padding(padding: EdgeInsets.all(4)),
                    TextField(
                      decoration: const InputDecoration(
                        labelText: "事件名称",
                      ),
                      controller: _eventController,
                    ),
                    TextField(
                      decoration: const InputDecoration(
                        labelText: "事件参数",
                      ),
                      controller: _paramsController,
                    ),
                    const Padding(padding: EdgeInsets.all(4)),
                    TextButton(
                        onPressed: sendEvent, child: const Text('发送事件')),
                    Text(_requestResult),
                  ],
                )),
          )),
    );
  }
}