M
SAAS权限管理系统| vue、nuxt 添加百度统计
# vue、nuxt添加百度统计功能73.03% 首页我用的nuxt,优化访问速度和支持seo,其他的一些功能页面用的vue ## 1 先到百度统计网站注册登录,添加好域名后,获取到统计代码,如下图 68.42% ## 2 vue项目添加百度统计 index.html 添加代码 ```html ``` ```html ``` 完整如下 ```html ``` 加入路由跳转监听代码: ```js router.beforeEach((to, from, next) => { if (to.path) { if (window._hmt) { window._hmt.push(['_trackPageview', to.fullPath]) } } next() }) ``` ## 3 nuxt添加百度统计63.25% 在 /plugins/文件夹内添加 baidu.js文件 ```js /* ** 只在生产模式的客户端中使用 */ if (process.client && process.env.NODE_ENV === 'production') { /* ** baidu 统计分析脚本 */ var _hmt = _hmt || []; (function () { var hm = document.createElement('script') hm.src = 'https://hm.baidu.com/hm.js?*****************' hm.id = 'baidu_tj' var s = document.getElementsByTagName('script')[0] s.parentNode.insertBefore(hm, s) })() } export default ({ app: { router }, store }) => { /* ** 每次路由变更时进行pv统计 */ if (process.client && process.env.NODE_ENV === 'production') { router.afterEach((to, from) => { var _hmt = _hmt || []; (function () { document.getElementById('baidu_tj') && document.getElementById('baidu_tj').remove() var hm = document.createElement('script') hm.src = 'https://hm.baidu.com/hm.js?*****************' hm.id = 'baidu_tj' var s = document.getElementsByTagName('script')[0] s.parentNode.insertBefore(hm, s) })() }) } } ``` 在/nuxt.config.js文件中添加链接 ``` plugins: [ { src: '@/plugins/baidu.js', ssr: false } ], ``` 分别打包进行部署 ## 4 验证 我首页使用nuxt,相关代码都打包到js文件里去了,所以百度统计的代码检查一直过不去,但是功能的确已经生效了 77.90% 70.30%