接入百度统计

百度统计分为两类：网站统计（百度统计 / 百度联盟）和 移动应用统计（百度移动统计）。下面分别说明在 Flutter 应用 与 VitePress/网站 中的接入方式。

---

一、Flutter 应用接入百度移动统计

适用于 Android / iOS 原生或 Flutter 应用，在 百度移动统计 创建应用后获取 App Key，再在 Flutter 中集成 SDK。

1. 获取 App Key

1. 登录 百度移动统计。
2. 添加应用，选择平台（Android / iOS），填写包名 / Bundle ID。
3. 在应用设置中复制 App Key（约 24 位字符串）。

2. 使用官方 Flutter 插件（推荐）

百度官方维护的 Flutter 插件：BaiduMobileAnalysis/baidumobstat-flutter。

添加依赖

在 pubspec.yaml 中（若使用 Git 依赖）：

dependencies:
  baidumobstat:
    git:
      url: https://github.com/BaiduMobileAnalysis/baidumobstat-flutter.git

若已发布到 pub.dev，则：

dependencies:
  baidumobstat: ^x.x.x  # 以 pub.dev 上版本为准

初始化

在 main.dart 的 main() 中、runApp() 之前完成初始化（需在能拿到 BuildContext 之前调用时，可在根 Widget 的 initState 或 didChangeDependencies 里调用插件提供的初始化 API，具体以插件文档为准）。常见写法示例：

import 'package:baidumobstat/baidumobstat.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  // 初始化百度移动统计（App Key 替换为你在 mtj 后台获取的 key）
  BaiduMobStat.startWithAppId('your_app_key');
  runApp(const MyApp());
}

常用 API（以插件实际为准）

• 页面统计：进入页面时调用页面开始，离开时调用页面结束（若插件支持）。
• 自定义事件：调用插件提供的 onEvent 之类方法，传入事件名、可选参数。

具体方法名、参数以 baidumobstat-flutter 的 README 和 example 为准。

3. Android 额外配置

• 在 百度移动统计-Android 集成文档 中按说明配置 AndroidManifest.xml（如权限、App Key 等），若 Flutter 插件已封装，则按插件文档执行即可。
• 若使用混淆，按官方文档添加 ProGuard 规则。

4. iOS 额外配置

• 在 百度移动统计-iOS 集成文档 中按说明配置 Xcode 工程（如 App Key、权限等），Flutter 插件一般会在 iOS 端封装原生调用，按插件文档操作即可。

---

二、网站接入百度统计（含 VitePress）

适用于文档站、官网等 Web 项目。在 百度统计 创建站点后获取统计代码，在页面中引入 hm.js 并处理 SPA 页面切换。

1. 获取统计代码

1. 登录 百度统计。
2. 添加网站，填写域名等信息。
3. 获取统计代码，形式类似：

<script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?xxxxxxxx";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
})();
</script>

其中 xxxxxxxx 为你的统计 ID。

2. 在 VitePress 中接入

在 VitePress 的配置文件（如 docs/.vitepress/config.mts）中，通过顶层 head 注入百度统计脚本：

import { defineConfig } from "vitepress";

export default defineConfig({
  title: "Flutter教程",
  base: "/flutter/",
  head: [
    [
      "script",
      {
        innerHTML: `
          var _hmt = _hmt || [];
          (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?你的统计ID";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
          })();
        `,
      },
    ],
  ],
  // ... 其余 themeConfig 等
});

将 你的统计ID 替换为百度统计后台中的 ID。

仅生产环境加载（推荐）

避免在本地开发时产生无效访问数据，可只在生产构建时注入：

const baiduAnalyticsId = "你的统计ID";

const head: any[] = [];
if (process.env.NODE_ENV === "production" && baiduAnalyticsId) {
  head.push([
    "script",
    {
      innerHTML: `
        var _hmt = _hmt || [];
        (function() {
          var hm = document.createElement("script");
          hm.src = "https://hm.baidu.com/hm.js?" + "${baiduAnalyticsId}";
          var s = document.getElementsByTagName("script")[0];
          s.parentNode.insertBefore(hm, s);
        })();
      `,
    },
  ]);
}

export default defineConfig({
  head,
  // ...
});

3. SPA 页面切换时上报 PV（VitePress 必做）

VitePress 是单页应用，切换路由不会整页刷新，百度统计默认只会记录首次加载的 PV。需要在路由切换时手动上报一次「页面浏览」。

在 VitePress 中可通过 主题扩展 或 自定义 enhanceApp，在路由变化后执行：

if (typeof window !== 'undefined' && window._hmt) {
  window._hmt.push(['_trackPageview', path]);
}

例如在 .vitepress/theme/index.js（或 theme/index.ts）中：

// .vitepress/theme/index.js
import DefaultTheme from 'vitepress/theme';

export default {
  extends: DefaultTheme,
  enhanceApp({ router }) {
    if (typeof window === 'undefined') return;
    router.onAfterRouteChange = (to) => {
      if (window._hmt) {
        window._hmt.push(['_trackPageview', to]);
      }
    };
  },
};

这样每次切换文档路由都会上报一次 PV，百度统计中的「页面」数据才会完整。

4. 自定义事件（可选）

在页面或组件中需要上报点击、转化等行为时：

window._hmt && window._hmt.push(['_trackEvent', '按钮', '点击', '章节名称']);

按百度统计文档的 _trackEvent 约定传入「类别、动作、标签」等即可。

---

小结

场景	产品	关键步骤
Flutter 应用	百度移动统计	使用 baidumobstat-flutter，在启动时调用 startWithAppId，按文档配置 Android/iOS
网站 / VitePress	百度统计	在 head 中注入 hm.js，SPA 在路由切换时 _hmt.push(['_trackPageview', path])

• Flutter：以 baidumobstat-flutter 和 百度移动统计帮助文档 为准。
• 网站：以 百度统计使用说明 和上述 VitePress head + 路由上报方式即可完成接入。