注:以下操作基本需要翻墙,请自备梯子。
登录你的谷歌账户,注册谷歌分析
然后设置自己的账户基本信息
获取跟踪Id,同意协议。
登陆后便有全站跟踪代码,复制带有跟踪Id的代码到你的项目里。 使用入门 给您的网站安装跟踪代码 示例 安装跟踪代码后,你就可以发布你的网站了,在这个管理后台你就可以查看您的网站访问数据了。 本篇完 :)
等等,我只是开个玩笑,以上只是基本操作,完成上述操作,才能继续下面的步骤,让你本地的服务能获取谷歌分析的数据。
如果你想在自己的网站里展示这些数据,每次只用自己本地登录后台查看,该怎么实现呢? 戳这里 谷歌提供了api接口,供你自由配置指标来查询你的网站访问数据,并且提供了各种客户端库的查询支持。
本篇使用的后台技术是NodeJs,使用的是express框架+redis技术实现。 项目目录结构,项目代码放在github上,适当修改配置,安装依赖,就可以应用于自己的网站了。
├── README.md
├── app
│ ├── config
│ │ ├── index.js //配置文件
│ │ └── key.json //查询api的jwt验证key
│ ├── controllers
│ │ └── google.analytics.js //获取数据的api
│ ├── middleware
│ │ └── redis.middleware.js //使用redis作中间存储
│ ├── routes
│ │ ├── google.js //路由文件
│ │ └── index.js
│ └── utils
│ └── index.js //小工具
├── app.js
├── index.js
├── package-lock.json
└── package.json
这个项目里,使用了官方的nodejs api的npm包 googleapis
。
使用redis的部分是为了缓存access_token和部分数据,目前把部分接口的数据先缓存23小时(不想去频繁请求接口)。
项目里需要配置的地方,第一个是数据视图id,这个在创建账户的时候就生成了,在账户管理的数据视图
里可以看到,点击数据视图设置
,就可以获取数据视图id
viewId: 'ga:你的数据视图id'
打开谷歌api控制台,先创建一个项目,然后点击启用API
,搜索google analytics,启用Google Analytics Reporting API
,再启用Analytics API
。
然后创建凭据,点击 凭据
-->创建凭据
-->选择服务账号密钥
-->选择新的服务账号,并设置角色,输入名称,点击创建
,保存您的密钥文件。
将这个key复制到项目的app/config
目录下并修改名称为 key.json
。
打开注册谷歌分析的数据控制台(注册的时候可以查看数据的那个),点击管理
-->媒体资源
-->用户管理
-->添加新用户
,输入api控制台的 凭据
-->列表又上角管理服务账号
,复制这个服务账号id,粘贴到电子邮箱地址栏,并设置权限(可只设置读取和分析的权限)。这个控制台也可以设置过滤规则和白名单之类的,如有需要,可以研究研究。
到这一步,大功告成。去你的网站上点点吧,如果在谷歌分析的数据控制台能看到数据,可以启动我的项目文件,调用api接口,就可以获取json数据。
在这个api参考里,你可以自由设置你想要的数据,修改demo的接口就好。
router.get('/userChart',...);//用户浏览数据
router.get('/cityChart', ...);//用户国家地区分布
router.get('/deviceChart',...);//用户设备分布
router.get('/pageViewData', ...);//单页面访问统计
router.get('/pageTimeData',...);//24小时访问数统计
router.get('/pageAreaData',..);//地区统计
//可以自由设置更多数据
git clone [email protected]:zangse/google-analytics-node.git
cd google-analytics-node
//更换key和viewId和端口号(xxx)
npm install
node index.js
//在浏览器访问
http:localhost:xxx/api/google/userChart
目前由于墙的原因,google服务无法访问,我本地数据,是使用了工具为node进程开了代理。(mac端Proxifier
)
线上部署也同样需要解决墙的问题,最好是把这个小项目托管到可以访问google服务的服务器上。
至于文章开头的图表,来自于接口返回的数据,经过前端处理后使用echart展示的结果。 如有疑问,可以在项目里提issues。如有遗漏或错误的地方,欢迎指正。