vue项目接入百度统计分析

@vue项目接入百度统计分析

vue项目接入百度统计分析

安装vue-ba
npm install vue-ba --save
main.js设置
import ba from 'vue-ba'
Vue.use(ba, { siteId: '310023f8d944c8142473e377c77010e0' })

登录百度统计，进行网站相关配置

• 设置完之后启动项目，F12观察network下是否成功引入hm.js，引入成功则说明接入成功，如下图所示：
  

获取百度统计统计的数据

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-6O2XG4bf-1606453037820)(./images/tjToken.png)]

const params = {
  'header': {
    'username': 'xxx', //百度账号
    'password': 'xxx', //百度密码
    'token': 'xxxxxxxxx', // 数据导出需要的token值，每个账号固定一个
    'account_type': 1
  },
  'body': {
    'site_id': 'xxxxx', // 改网站统计的site_id   https://tongji.baidu.com/sc-web/27958256/home/dataapi?siteId=xxxxxx
    'start_date': '',
    'end_date': '',
    'metrics': 'pv_count', // 获取数据统计的类型
    'method': 'overview/getTimeTrendRpt' // 对应数据统计类型的获取方法
  }
}

• 接口路径 https://api.baidu.com/json/tongji/v1/ReportService/getData 前端调用会存在跨域，通过后端获取到数据，前端再调取后端接口来取得百度分析对应的数据