zdl
|
5f6b4b083b
|
feat: 修复前的 DAU 数据无法补充（PostHog 未收到事件）
|
2025-11-19 17:17:54 +08:00 |
|
zdl
|
17c04211bb
|
feat: 完善 PostHog 用户生命周期追踪 + 性能优化
新增功能：
1. 首次访问追踪 (first_visit)
- 记录用户来源（referrer、UTM参数）
- 记录落地页
- 使用 localStorage 永久标记
2. 首次登录追踪 (first_login)
- 区分首次登录和后续登录
- 按用户 ID 独立标记
- 用于计算新用户激活率
3. 登录/登出事件追踪
- 登录成功追踪 (user_logged_in)
- 登出事件追踪 (user_logged_out，必须在 resetUser 之前）
- 注册事件追踪 (user_registered)
4. 页面浏览时长追踪 (page_view_duration)
- 路由切换时自动计算停留时长
- 页面关闭时发送最终时长
- 过滤停留时间 < 1秒的快速跳转
性能优化：
1. 新增 trackEventAsync 函数
- 使用 requestIdleCallback 在浏览器空闲时发送非关键事件
- Safari 等旧浏览器降级到 setTimeout
- 超时保护（最多延迟 2秒）
2. 异步追踪非关键事件
- first_visit - 不阻塞首屏渲染
- page_view_duration - 不阻塞页面切换
3. 关键事件保持同步
- user_registered、user_logged_in、first_login、user_logged_out
- 确保数据准确性和完整性
分析能力提升：
- ✅ 营销渠道 ROI 分析（UTM 参数追踪）
- ✅ 新用户激活率分析（首次登录标记）
- ✅ 用户留存率分析（注册→首次登录→后续登录）
- ✅ 页面热度分析（停留时长统计）
- ✅ 流失用户识别（7天未登录，需后端支持）
|
2025-11-18 21:29:33 +08:00 |
|
zdl
|
7f01a391e0
|
feat: 关闭posthog日志
|
2025-11-04 19:51:41 +08:00 |
|
zdl
|
a0d1790469
|
fix: 修复 PostHog AbortError 和重复初始化问题
## 问题
控制台报错：
```
[PostHog.js] AbortError: The user aborted a request.
```
## 根本原因
### 1. 热重载导致重复初始化
- 开发环境频繁热重载
- App.js 每次重载都调用 initPostHog()
- 之前的网络请求被新请求中断 → AbortError
### 2. 缺少初始化状态管理
- 没有防止重复初始化的锁
- 每次组件更新都可能触发新的初始化
## 解决方案
### 方案A: 防止重复初始化
添加初始化状态锁：
```javascript
let isInitializing = false;
let isInitialized = false;
export const initPostHog = () => {
// 防止重复初始化
if (isInitializing || isInitialized) {
console.log('📊 PostHog 已初始化，跳过重复调用');
return;
}
isInitializing = true;
try {
posthog.init(apiKey, {...});
isInitialized = true; // 成功后标记为已初始化
} finally {
isInitializing = false; // 无论成功失败都重置标志
}
};
```
### 方案B: 捕获并忽略 AbortError
在 catch 块中特殊处理：
```javascript
} catch (error) {
// 忽略 AbortError（通常由热重载引起）
if (error.name === 'AbortError') {
console.log('⚠️ PostHog 初始化请求被中断（热重载）');
return; // 静默处理，不报错
}
console.error('❌ PostHog initialization failed:', error);
}
```
## 影响
- ✅ 修复 AbortError 警告
- ✅ 防止热重载时重复初始化
- ✅ 提升开发体验
- ✅ 不影响生产环境
## 验证
重启开发服务器后：
- ✅ 不再有 AbortError
- ✅ PostHog 只初始化一次
- ✅ 热重载正常工作
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-10-30 18:49:03 +08:00 |
|
zdl
|
6506cb222b
|
feat: PostHog 集成\
1. ✅ 安装依赖: posthog-js@^1.280.1
2. ✅ 创建核心文件:
- src/lib/posthog.js - PostHog SDK 封装（271 行）
- src/lib/constants.js - 事件常量定义（AARRR 框架）
- src/hooks/usePostHog.js - PostHog React Hook
- src/hooks/usePageTracking.js - 页面追踪 Hook
- src/components/PostHogProvider.js - Provider 组件
3. ✅ 集成到应用:
- 修改 src/App.js，在最外层添加 <PostHogProvider>
- 自动追踪所有页面浏览
4. ✅ 配置环境变量:
- 在 .env 添加 PostHog 配置项
- REACT_APP_POSTHOG_KEY 留空，需要用户填写
5. ✅ 创建文档: POSTHOG_INTEGRATION.md 包含完整的使用说明
|
2025-10-28 20:09:21 +08:00 |
|