vue-uv-tracker/dist/index.min.js

用于捕获点击、搜索框回车搜索、路由切换等埋点数据并上报到服务器的Vue插件

!function(){var Axios=require("axios"),VueTracking={productName:"unknown",username:"unknown",reportUrl:"",reportClient:null,disabled:!1,console:!1,router:null,install:function(Vue,options){if(this.productName=options.productName||this.productName,this.username=options.username||this.username,this.reportUrl=options.reportUrl||"",this.disabled=options.disabled||!1,this.console=options.console||!1,this.router=options.router,this.reportClient=Axios.create({baseURL:this.reportUrl,withCredentials:!1,timeout:3e3}),Vue.prototype.$sendTrack=(eventName,eventData)=>{this.reportTrackingData(eventName,eventData)},Vue.directive("track",{bind:function(el,binding,vnode){el.addEventListener(binding.arg||"click",()=>{const{eventName:eventName,eventData:eventData}=binding.value;vnode.context.$sendTrack(eventName,eventData)})}}),Vue.directive("track-search",{inserted:function(el,binding){el.addEventListener("keydown",(function(event){if("Enter"===event.key){const keyword=event.target.value,eventName=binding.value,eventData={keyword:keyword};Vue.prototype.$sendTrack(eventName,eventData)}}))}}),this.router){let router=this.router;router.beforeEach((to,from,next)=>{const timestamp=(new Date).getTime(),previousRoute=router.app.$route;if(previousRoute){const stayDuration=timestamp-router.app.$previousRouteLeaveTime,eventName="routeChange",eventData={from:previousRoute.path,fromName:previousRoute.meta&&previousRoute.meta.title?previousRoute.meta.title:previousRoute.name,to:to.path,toName:to.meta&&to.meta.title?to.meta.title:to.name,stayDuration:stayDuration};Vue.prototype.$sendTrack(eventName,eventData)}router.app.$previousRouteLeaveTime=timestamp,next()})}Vue.prototype.$tracker=this,Vue.prototype.$reportTrackingData=this.reportTrackingData},async reportTrackingData(eventName,eventData){try{const trackingData=this.getTrackingData(eventName,eventData);await this.report(trackingData)}catch(error){console.log("处理埋点数据出错"),console.log(error)}},getTrackingData(eventName,eventData){return{product:this.productName,username:this.username,href:window.location.href,eventName:eventName,eventData:eventData}},async report(trackingData){if(!this.disabled)try{const exceptionStr=JSON.stringify(trackingData);await this.reportClient({method:"post",data:exceptionStr,headers:{"Content-Type":"application/json"}})}catch(error){console.log("上报埋点数据出错"),console.log(error)}},setUserName(username){this.username=username}};"object"==typeof exports?module.exports=VueTracking:"function"==typeof define&&define.amd?define([],(function(){return VueTracking})):window.Vue&&(window.VueExceptionCaptor=VueTracking,Vue.use(VueTracking))}();