uniapp网站和微信小程序添加百度统计

Geng0520

于 2024-09-03 12:12:09 发布

阅读量367

点赞数 15

分类专栏：微信小程序 uniapp 文章标签： uni-app 微信小程序 notepad++

本文链接：https://blog.csdn.net/qq_43659075/article/details/141856762

版权

uniapp 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

微信小程序

2 篇文章 0 订阅

订阅专栏

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

一、首先，需要在百度统计平台注册一个账户或登录现有的账户
二、新建站点(应用)、添加代码
三、代码获取与安装
- 1.在官方网站新增应用，根据官方指引步骤新增应用即可
总结

一、首先，需要在百度统计平台注册一个账户或登录现有的账户

百度统计官网

二、新建站点(应用)、添加代码

具体步骤参考官方文档

三、代码获取与安装

1、代码获取：
在这里插入图片描述
2、代码安装（uniapp开发的h5网页里）

参考站： uniapp H5 百度统计（基础篇）
新建baidu_statistics.html文件

在这里插入图片描述

修改manifest.json文件web配置

在这里插入图片描述

引入你复制过来的代码

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
        <title>
            <%= htmlWebpackPlugin.options.title %>
        </title>
        <script>
			// <!-- 百度统计---------------------------------------- -->
			var _hmt = _hmt || [];
			(function() {
				var hm = document.createElement("script");
				hm.src = "https://hm.baidu.com/hm.js?这里是你复制过来的百度统计的appkey";
				var s = document.getElementsByTagName("script")[0];
				s.parentNode.insertBefore(hm, s);
			})();
			// <!-- ---------------------------------------- -->
        </script>
        <link rel="stylesheet" href="<%= BASE_URL %>static/index.css" />
    </head>
    <body>
        <noscript>
            <strong>Please enable JavaScript to continue.</strong>
        </noscript>
        <div id="app"></div>
    </body>
</html>

本地通过浏览器的网络hm.js文件检查代码安装(有这个文件说明安装好了)

官网上的数据更新可能有延时，可以过半个小时再查看安装情况

---------------------------分割---------------------------------------------------------------------------------------------------

下面是微信小程序通过微信开发者工具引入百度统计
参考站：微信小程序接入百度统计

1.在官方网站新增应用，根据官方指引步骤新增应用即可

这里需要提前准备你需要添加的微信小程序的appid
跟着步骤创建应用，点击创建会得到sdk的包，下载下来，之后会让集成sdk

集成之前，把下载的微信小程序统计SDK解压后的mtj-wx-sdk.js和mtj-wx-sdk.config.js复制到小程序项目的utils文件夹中去
在这里插入图片描述
修改mtj-wx-sdk.config.js文件，将上边复制的appkey填写进去：

编辑app.js,最顶部添加以下代码：

const mtjwxsdk = require('./utils/mtj-wx-sdk.js');

在这里插入图片描述登录微信公众平台，进入小程序的设置->开发设置->服务器域名，把https://hmma.baidu.com加入request合法域名，配置好后可在开发者工具中查看到即可

以上全部完成可查看百度统计的sdk集成，检查代码安装，点击完成即可，此时或等待20分钟左右即可在应用列表查看到刚刚创建的应用