Demo发布- ClkLog客户端集成 uni-app

简介: 在上一期推文中,我们与大家分享了 React Native 的集成 demo。本期,我们将继续介绍 ClkLog 集成 uni-app 的 demo。 uni-app 允许开发者编写一套代码,然后可以编译到 iOS、Android、H5 以及各种小程序等多个平台。因此,本次 demo 中将涵盖上述所有平台,并且我们会详细说明集成过程中遇到的难点及解决方案。

前言
在上一期推文中【Demo发布- ClkLog客户端集成-React Native】,我们与大家分享了 React Native 的集成 demo。本期,我们将继续介绍 ClkLog 集成 uni-app 的 demo。 uni-app 允许开发者编写一套代码,然后可以编译到 iOS、Android、H5 以及各种小程序等多个平台。因此,本次 demo 中将涵盖上述所有平台,并且我们会详细说明集成过程中遇到的难点及解决方案。

uni-app-demo说明
本demo支持IOS、Android、h5、微信小程序,并实现了相关功能点的示例。
●示例包含的内容:
1、uni-app在h5、微信小程序、Android/iOS端的sdk集成和初始化
2、会话的实现与接入示例
3、浏览页面事件的手动接入示例
4、页面标题的手动接入示例
●其他更多内容的接入请参考神策 uni-app sdk 官方文档。

在集成神策 uni-app 相关 sdk 之前,请根据以下情况进行 sdk 的选择

1、如果打包包含 h5 ,由于 uni-app-js 会话未实现需要自己实现,建议采用神策 web js sdk 的方式引入 sa-sdk-javascript 插件。
2、如果打包包含 微信小程序 ,需要引入 uni-app-js 插件。
3、如果打包包含 Android/iOS ,需要引入 uni-app-native(Android & iOS) 插件, 插件集成过程中建议使用离线打包模式(云打包在测试中无法正常采集数据)。

在使用 ClkLog 作为 uni-app 的数据采集服务端时,需要要注意以下内容
1、ClkLog的统计数据基于神策 sdk 的浏览页面事件和会话ID($event_session_id), 由于神策 uni-app sdk 的会话未实现,所以需要自己实现会话ID并配置为全局属性,同时关闭全埋点的浏览页面事件并手动跟踪浏览页面事件。
2、神策web、小程序、iOS、Android端的sdk浏览页面事件名称不同,请根据uni-app打包的版本去跟踪浏览页面事件,各端的浏览页面事件如下:
Web:$pageview
Android&iOS:$AppViewScreen
微信小程序:$MPViewScreen。
3、由于 uni-app 属于单页面应用,开启自动采集浏览页面事件会出现页面标题和页面URL不匹配的问题,在各端的浏览页面事件注册时请根据实际情况手动采集页面标题。
4、demo中分别使用App.h5.vue、App.minprogram.vue、App.androd-ios.vue三个文件对web端、小程序端和移动端做了sdk的引用、初始化和自定义集成示例,请根据实际情况选择对应集成参考示例在App.vue入口页进行sdk的初始化。

demo源码地址
我们分别在gitee和github中上传了demo,欢迎大家前来围观。
https://gitee.com/clklog/clklog-uniapp-demo
https://github.com/clklog/clklog-uniapp-demo
结束语.png


相关文章
|
2月前
|
数据采集 前端开发 开发工具
Demo发布- ClkLog客户端集成-React Native
ClkLog是一款支持开源和商业付费的用户行为分析软件系统,通过采集客户端行为日志数据,在开源的OLAP数据库上进行模型分析。常见的客户端有Web JS、IOS、Andriod 、小程序等,以及react-native 、uni-app等。Clklog方案选用了\神策提供的开源SDK来进行数据采集。
117 48
|
25天前
|
数据采集 开发工具 图形学
Demo发布 | ClkLog成功集成Unity3D
在Clklog完成 React Native 和 uni-app 集成 Demo 后,一个游戏行业新客户提出了使用 Unity3D 开发的集成问题。对此,我们与客户分别进行了测试。 客户使用神策Andriod原生SDK在Android 端暴露接口给 Unity3D的方式,验证了使用ClkLog进行数据采集的可行性。
59 12
|
3月前
|
数据采集 前端开发 项目管理
ClkLog常见问题-埋点集成篇Sec. 2
本篇将继续解答ClkLog使用过程中【埋点集成】阶段的常见问题。
|
3月前
|
搜索推荐 JavaScript BI
ClkLog常见问题-埋点集成篇Sec. 1
本篇主要解答ClkLog使用过程中【埋点集成】阶段的常见问题。
|
3月前
|
Java Maven Docker
gitlab-ci 集成 k3s 部署spring boot 应用
gitlab-ci 集成 k3s 部署spring boot 应用
|
2月前
|
消息中间件 监控 Java
您是否已集成 Spring Boot 与 ActiveMQ?
您是否已集成 Spring Boot 与 ActiveMQ?
56 0
|
6月前
|
监控 druid Java
spring boot 集成配置阿里 Druid监控配置
spring boot 集成配置阿里 Druid监控配置
324 6
|
6月前
|
Java 关系型数据库 MySQL
如何实现Springboot+camunda+mysql的集成
【7月更文挑战第2天】集成Spring Boot、Camunda和MySQL的简要步骤: 1. 初始化Spring Boot项目,添加Camunda和MySQL驱动依赖。 2. 配置`application.properties`,包括数据库URL、用户名和密码。 3. 设置Camunda引擎属性,指定数据源。 4. 引入流程定义文件(如`.bpmn`)。 5. 创建服务处理流程操作,创建控制器接收请求。 6. Camunda自动在数据库创建表结构。 7. 启动应用,测试流程启动,如通过服务和控制器开始流程实例。 示例代码包括服务类启动流程实例及控制器接口。实际集成需按业务需求调整。
441 4
|
6月前
|
消息中间件 Java 测试技术
【RocketMQ系列八】SpringBoot集成RocketMQ-实现普通消息和事务消息
【RocketMQ系列八】SpringBoot集成RocketMQ-实现普通消息和事务消息
405 1
|
7月前
|
消息中间件 Java Kafka
springboot集成kafka
springboot集成kafka
193 2