Flutter视频质量监控插件conviva_tracker的使用

Flutter视频质量监控插件conviva_tracker的使用

Conviva Flutter Tracker概述

Conviva Flutter Tracker允许你在使用Conviva管道时为你的Flutter应用程序添加分析功能。

通过此追踪器,你可以收集用户与你的Flutter应用程序交互时的详细事件级别数据。它基于Conviva的原生iOS、Android和Web追踪器构建,以支持全套现成的Conviva事件和跟踪功能。

功能

特性 Android iOS Web
手动跟踪事件:屏幕视图、按钮点击、自描述、结构化、计时、同意授予和撤回
自动跟踪Navigator API的视图事件
向事件添加自定义上下文实体
支持多个追踪器
可配置的主题属性 部分
在事件中添加会话上下文实体
添加地理位置上下文实体
添加移动平台上下文实体
添加网页上下文实体
可配置的GDPR上下文实体

快速开始

安装

在你的Flutter应用中添加Conviva追踪器作为依赖项:

flutter pub add conviva_tracker

这将在你的pubspec.yaml文件中添加如下依赖行:

dependencies:
    conviva_tracker: ^0.3.9

将包导入到你的Dart代码中:

import 'package:conviva_tracker/conviva_tracker.dart';
Web安装

如果在Web应用中使用追踪器,还需要在index.html文件中导入Conviva JavaScript追踪器。请使用Conviva标签加载JS追踪器,并且不要更改用于访问追踪器的全局函数名conviva——Flutter API假定该名称保持默认值,如文档所示。

确保使用JavaScript追踪器版本0.3.14或更新版本。你也可以参考Conviva Flutter追踪器存储库中的示例项目来了解实际操作。

使用追踪器

使用Conviva.createConvivaTracker函数实例化一个追踪器。你可以在主小部件的initState()方法中创建追踪器。该函数需要两个必需参数:appNamecustomerKey,这两个参数由Conviva提供。

ConvivaTracker tracker = await Conviva.createConvivaTracker(
    appName: '{{YOUR_APP_NAME_ADVISED_BY_Conviva}}',
    customerKey: '{{YOUR_CUSTOMER_KEY_ADVISED_BY_Conviva}}'
);

要跟踪自定义事件,只需按上述方式实例化追踪器并调用tracker.trackCustomEvent方法。请参阅文档以了解事件属性的规范。

// 跟踪自定义事件
final String name = "CustomEventName";
final String data = "{\"key\": \"value\"}"; // 包含键值对的字符串化JSON
tracker.trackCustomEvent(name, data);

要报告页面视图事件(仅限Web),只需按上述方式实例化追踪器并调用tracker.trackPageView方法。

// 跟踪页面视图事件 - 仅在Web上受支持
tracker.track(PageView(title: 'Page Title'));

要报告按钮点击事件,只需按上述方式实例化追踪器并调用tracker.track方法。请参阅文档以了解事件属性的规范。

// 跟踪按钮点击事件
const event = ButtonClick(
    elementType: 'Element Type',
    elementId: 'Element Id',
    elementName: 'Element Name',
    elementClasses: 'Element Class',
    elementText: 'Element Text',
    elementValue: 'Element Value'
);
tracker.track(event);

要报告屏幕视图事件,只需按上述方式实例化追踪器并调用tracker.track方法。请参阅文档以了解事件属性的规范。

// 跟踪屏幕视图事件
const event = ScreenView(
    id: 'Screen Id',
    name: 'Screen Name',
    type: 'Screen Type',
    transitionType: 'Transition Type'
);
tracker.track(event);

更多信息

技术文档 设置指南
[技术文档][techdocs] [设置指南][setup]

维护者

贡献
[贡献][contributing]

维护者快速入门

假设已安装Flutter SDK

克隆仓库

git clone https://github.com/Conviva/conviva-flutter-tracker.git

更多关于Flutter视频质量监控插件conviva_tracker的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter视频质量监控插件conviva_tracker的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


conviva_tracker 是一个用于在 Flutter 应用中集成 Conviva 视频质量监控的插件。Conviva 是一个强大的视频分析平台,能够帮助开发者监控视频播放的性能和质量,包括缓冲时间、播放错误、视频启动时间等关键指标。

以下是如何在 Flutter 项目中使用 conviva_tracker 插件的基本步骤:

1. 添加依赖

首先,在 pubspec.yaml 文件中添加 conviva_tracker 插件的依赖:

dependencies:
  flutter:
    sdk: flutter
  conviva_tracker: ^1.0.0  # 请使用最新版本

然后运行 flutter pub get 来安装依赖。

2. 初始化 Conviva

在你的 Flutter 应用中,首先需要初始化 Conviva。通常在 main.dart 文件中进行初始化:

import 'package:conviva_tracker/conviva_tracker.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();

  // 初始化 Conviva
  ConvivaTracker.initialize(
    customerKey: 'YOUR_CUSTOMER_KEY',  // 替换为你的 Conviva 客户密钥
    gatewayUrl: 'https://YOUR_GATEWAY_URL',  // 替换为你的 Conviva Gateway URL
    logLevel: ConvivaLogLevel.debug,  // 设置日志级别
  );

  runApp(MyApp());
}

3. 创建 Conviva 会话

在开始播放视频时,创建一个 Conviva 会话。会话用于跟踪视频播放的各个阶段。

import 'package:conviva_tracker/conviva_tracker.dart';

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

class _VideoPlayerScreenState extends State<VideoPlayerScreen> {
  ConvivaSession? convivaSession;

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

    // 创建 Conviva 会话
    convivaSession = ConvivaSession.createSession(
      assetName: 'My Video',  // 视频名称
      viewerId: 'user123',  // 用户 ID
      streamType: StreamType.live,  // 视频类型:直播或点播
    );
  }

  @Override
  void dispose() {
    // 结束 Conviva 会话
    convivaSession?.endSession();
    super.dispose();
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Video Player'),
      ),
      body: Center(
        child: VideoPlayerWidget(),  // 你的视频播放器组件
      ),
    );
  }
}

4. 发送事件

在视频播放的不同阶段,发送事件以监控视频播放的质量。例如,在视频开始播放时发送 play 事件,在视频暂停时发送 pause 事件。

void onVideoPlay() {
  convivaSession?.sendEvent(ConvivaEventType.play);
}

void onVideoPause() {
  convivaSession?.sendEvent(ConvivaEventType.pause);
}

void onVideoError(String errorMessage) {
  convivaSession?.sendEvent(ConvivaEventType.error, errorMessage: errorMessage);
}

5. 监控视频质量

Conviva 会自动收集视频播放的质量数据,并将其发送到 Conviva 平台。你可以在 Conviva 仪表板中查看这些数据,分析视频播放的性能和质量。

6. 结束会话

在视频播放结束时,记得结束 Conviva 会话:

void onVideoEnd() {
  convivaSession?.endSession();
}

7. 处理错误

如果视频播放过程中出现错误,可以通过 Conviva 会话发送错误事件:

void onVideoError(String errorMessage) {
  convivaSession?.sendEvent(ConvivaEventType.error, errorMessage: errorMessage);
}

8. 高级配置

conviva_tracker 还支持更多高级配置,如自定义元数据、设置用户 ID、调整日志级别等。你可以根据需要进行配置。

ConvivaTracker.setMetadata({
  'custom_key': 'custom_value',
});

ConvivaTracker.setUserId('user123');

9. 调试与日志

在开发过程中,你可以通过设置日志级别来查看详细的日志信息,以便调试和排查问题。

ConvivaTracker.setLogLevel(ConvivaLogLevel.debug);

10. 集成视频播放器

conviva_tracker 可以与任何视频播放器集成,如 video_playerchewie 等。你只需要在视频播放器的回调中发送相应的事件即可。

VideoPlayerController _controller;

[@override](/user/override)
void initState() {
  super.initState();
  _controller = VideoPlayerController.network('https://www.example.com/video.mp4')
    ..initialize().then((_) {
      setState(() {});
    });

  _controller.addListener(() {
    if (_controller.value.isPlaying) {
      convivaSession?.sendEvent(ConvivaEventType.play);
    } else {
      convivaSession?.sendEvent(ConvivaEventType.pause);
    }
  });
}
回到顶部