keeson-web-report-sdk 1.1.1 → 1.1.5

package/README.md

@@ -0,0 +1,37 @@
+```javascript
+export const REPORT_TYPE = {
+  ERROR: "error",
+  PERFORMANCE: "performance",
+  REQUEST: "request",
+  USER: "user",
+};
+
+export const ERROR_TYPE = {
+  MAIN: "main",
+  RESOURCE_ERROR: "resourceError",
+  PROMISE_REJECTION: "PromiseRejection",
+  VUE_ERROR: "VueError",
+};
+
+export const REQUEST_ERROR_TYPE = {
+  ERROR: "error",
+};
+
+export const PERFORMANCE_TYPE = {
+  LOADED: "loaded",
+  FP: "paint",
+  FCP: "first-contentful-paint",
+  LCP: "largest-contentful-paint",
+  CLS: "layout-shift",
+  FID: "first-input",
+  LONGTASK: "longTask",
+  RESOURCE: "resource",
+  PAGE_RESOURCE: "pageResource",
+};
+
+export const USER_TYPE = {
+  LOCATION_CHANGE: "LocationChange",
+  ROUTE_CHANGE: "RouteChange",
+};
+
+```

package/bundle.esm.js

@@ -0,0 +1 @@
+const e="error",t="performance",r="user",s="main",o="resourceError",a="PromiseRejection",n="VueError",i="error",p="loaded",u="paint",c="first-contentful-paint",l="largest-contentful-paint",d="layout-shift",m="first-input",h="longTask",g="resource",f="pageResource",y="LocationChange",T="RouteChange";function v(e,t){if(window.PerformanceObserver){const r=new PerformanceObserver(function(r){const s=function(e,t){const r=t.getEntries(),s=[];return r.forEach(t=>{if("paint"===t.entryType&&("first-paint"===t.name&&s.push({type:u,message:`白屏时间 (FP): ${t.startTime+t.duration}ms`,extra:{value:t.startTime+t.duration},value:t.startTime+t.duration}),"first-contentful-paint"===t.name&&s.push({type:c,message:`首屏时间 (FCP): ${t.startTime+t.duration}ms`,extra:{value:t.startTime+t.duration},value:t.startTime+t.duration})),"largest-contentful-paint"===t.entryType){const{renderTime:e,startTime:r,duration:o}=t.renderTime,a=e||r+o;a>2500&&s.push({type:l,message:`元素 ${t.element.outerHTML} LCP 时间${a}毫秒，超过了 2.5 秒`,extra:{element:t.element.outerHTML,value:a},value:a})}if("first-input"===t.entryType&&t.processingStart-t.startTime>100&&s.push({type:m,message:"主线程阻塞时长超过 100 毫秒，用户体验不佳",extra:{value:t.processingStart-t.startTime},value:t.processingStart-t.startTime}),"layout-shift"!==t.entryType||t.hadRecentInput||t.value>.1&&s.push({type:d,message:"CLS 值超过 0.1，用户体验不佳",extra:{value:t.value},value:t.value}),"navigation"===t.entryType){s.push({type:p,message:`加载完成时间 (Load): ${t.loadEventEnd}ms`,value:t.loadEventEnd,extra:{value:t.loadEventEnd}});const r=t.domainLookupEnd-t.domainLookupStart,o=t.responseEnd-t.startTime;o>e.longTimeRequestThreshold&&s.push({type:f,message:`页面${t.name}请求耗时 ${o} 毫秒，超过了 ${e.longTimeRequestThreshold} 毫秒`,extra:{dnsTime:r,value:o,resourceName:t.name},value:o})}if("resource"===t.entryType){const r=t.domainLookupEnd-t.domainLookupStart,o=t.duration;o>e.longTimeRequestThreshold&&s.push({type:g,message:`资源${t.name}请求耗时 ${o} 毫秒，超过了 ${e.longTimeRequestThreshold} 毫秒`,extra:{dnsTime:r,value:o,resourceName:t.name},value:o})}if("longtask"===t.entryType){const e=t.duration-50>0?t.duration-50:0;e>50&&s.push({type:h,message:`检测到长任务，总耗时: ${t.duration} ms, 阻塞时间约: ${e} ms，大于建议的50ms内，请使用控制台performance（性能）进行性能分析`,extra:{duration:t.duration,blockingTime:e,resourceName:t.name},value:e})}}),s}(e,r);return"function"==typeof t&&t(s),s});r.observe({entryTypes:["paint","first-contentful-paint","largest-contentful-paint","first-input","layout-shift","interaction-to-next-paint","navigation","resource","longtask"],buffered:!0})}}function $(e){const t=[];return t.push(function(e){const t=history.pushState,r=history.replaceState;history.pushState=function(...r){const s=window.location.href,o=t.apply(this,r),a=window.location.href;return s!==a&&e({to:a,from:s}),o},history.replaceState=function(...t){const s=window.location.href,o=r.apply(this,t),a=window.location.href;return s!==a&&e({to:a,from:s}),o};const s=()=>{e({to:window.location.href,from:window.location.href})};return window.addEventListener("popstate",s),()=>{window.removeEventListener("popstate",s),history.pushState=t,history.replaceState=r}}(e)),()=>{t.forEach(e=>e())}}const w={reportUrl:"",appId:"",appVersion:"",appUrl:window.location.origin,appEnv:"prod",userAgent:window.navigator.userAgent,reportPath:"",reportError:!0,reportPromiseReject:!0,reportVueError:!0,vueInstance:null,reportPerformance:!0,listenPerformance:!0,longTimeRequestThreshold:2e3,reportErrorReqest:!0,errorRequestFunc:null,reportUserNavigate:!0,appSecretKey:""};class R{records=[];timer=null;options={};constructor(e){this.options={...w,...e}}init(){const p=localStorage.getItem("report-store-date"),u=`${(c=new Date).getFullYear()}-${c.getMonth()+1}-${c.getDate()}`;var c;p!==u&&(localStorage.setItem("report-store-date",u),localStorage.setItem("report-store-list","[]"));const l=JSON.parse(localStorage.getItem("report-store-list"));var d,m,h,g;if(this.options.reportError&&(d=t=>{l.includes(t.message)||(this.addReportRecord({reportType:e,...t}),l.push(t.message),localStorage.setItem("report-store-list",JSON.stringify(l)))},window.addEventListener("error",function(e){if(e.target){if(e.target&&("IMG"===e.target.tagName||"SCRIPT"===e.target.tagName||"LINK"===e.target.tagName||"VIDEO"===e.target.tagName||"AUDIO"===e.target.tagName||"SOURCE"===e.target.tagName)){const t=e.target,r={tagName:t.tagName,src:t.src||t.href,outerHTML:t.outerHTML,time:(new Date).toISOString()};e.preventDefault(),d&&d({type:o,message:`资源加载失败,${r.tagName}: ${r.src}`,extra:r})}}else{const t={message:e.error.stack,filename:e.filename,line:e.lineno,col:e.colno};e.preventDefault(),d&&d({type:s,message:t.message,extra:t})}},!0)),this.options.reportPromiseReject&&function(e){window.addEventListener("unhandledrejection",function(t){e&&e(t)})}(t=>{l.includes(t.reason?.stack)||(this.addReportRecord({reportType:e,type:a,message:t.reason?.stack}),l.push(t.reason?.stack),localStorage.setItem("report-store-list",JSON.stringify(l)))}),this.options.reportVueError&&this.options.vueInstance&&function(e,t){e.config.errorHandler=function(e,r,s){t&&t({err:e,vm:r,info:s})}}(this.options.vueInstance,({err:t})=>{l.includes(t.message)||(this.addReportRecord({reportType:e,type:n,message:t.message}),l.push(t.message),localStorage.setItem("report-store-list",JSON.stringify(l)))}),this.options.listenPerformance&&v(this.options,e=>{e.forEach(e=>{e.extra.resourceName!==this.options.reportUrl&&this.addReportRecord({reportType:t,...e})})}),this.options.reportErrorReqest&&(m=t=>{const{status:r,url:s,method:o,statusText:a}=t,n=`请求报错接口：${s}，方法：${o}，状态码：${r}，状态信息：${a}`;l.includes(n)||(this.addReportRecord({reportType:e,type:i,message:n}),l.push(n),localStorage.setItem("report-store-list",JSON.stringify(l)))},h=this.options,g=XMLHttpRequest.prototype.open,XMLHttpRequest.prototype.open=function(e,t,r,s,o){let a=Date.now();this.addEventListener("load",function(){const r=Date.now()-a;if(200===this.status){if("string"==typeof this.response)try{const s=JSON.parse(this.response);if("function"==typeof h.errorRequestFunc&&h.errorRequestFunc(s))return void(m&&m({message:`请求成功接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}， 请求耗时：${r}ms；服务器处理错误`,extra:{response:s,headers:this.getAllResponseHeaders()}}))}catch(e){}}else m&&m({message:`请求报错接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}`,extra:{headers:this.getAllResponseHeaders()}})}),this.addEventListener("error",function(){m&&m({message:`请求报错接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}`})}),g.call(this,e,t,r,s,o)},function(e,t,r){var s=window.fetch;window.fetch=function(e,o){let a=Date.now();return s(e,o).then(async s=>{const n=Date.now()-a,i=[...s.headers.entries()].map(e=>e.join(": ")).join("\n");if(200===s.status)try{const o=await s.json();if("function"==typeof r.errorRequestFunc&&r.errorRequestFunc(o))return void(t&&t({message:`请求成功接口：${e}，方法：${method}，状态码：${s.status}，状态信息：${s.statusText}， 请求耗时：${n}ms\n服务器处理错误`,extra:{response:o,headers:i}}))}catch(e){}else t&&t({message:`请求报错接口：${e}，方法：${o.method}，状态码：${s.status}，状态信息：${s.statusText}， 耗时：${n}ms`,extra:{headers:i}});return s}).catch(r=>{t&&t({message:`请求报错接口：${e}，方法：${o.method},错误信息\n${r.stack}`})})}}(0,t=>{const{url:r,method:s,statusText:o}=t,a=`请求报错接口：${r}，方法：${s}，状态信息：${o}`;l.includes(a)||(this.addReportRecord({reportType:e,type:i,message:a}),l.push(a),localStorage.setItem("report-store-list",JSON.stringify(l)))},this.options)),this.options.reportUserNavigate){const e=window.location.href;this.addReportRecord({reportType:r,type:y,message:`请求地址：${e}`,extra:JSON.stringify({url:e})}),$(e=>{this.addReportRecord({reportType:r,type:T,message:`路由变化：${e.to}`,extra:JSON.stringify({route:e.to})})})}}addReportRecord(e){this.timer&&clearTimeout(this.timer),this.timer=setTimeout(()=>{try{this.sendReport(JSON.parse(JSON.stringify(this.records))),this.records=[]}catch(e){}},1e3),this.records.push({appId:this.options.appId,appUrl:this.options.appUrl,reportPath:window.location.pathname,userAgent:window.navigator.userAgent,...e,extra:e.extra&&"object"==typeof e.extra?JSON.stringify(e.extra):void 0})}sendReport(e){const t={appSecretKey:this.options.appSecretKey,appId:this.options.appId,data:e},r=new Blob([JSON.stringify(t)],{type:"application/json; charset=UTF-8"});navigator.sendBeacon(this.options.reportUrl,r)}}let S;function x(e={}){S||(S=new R(e)),S.init()}var E={init:x};export{E as default,x as init};

package/bundle.iife.min.js

@@ -0,0 +1 @@
+var reportSdk=function(e){"use strict";const t="error",r="performance",s="user",o="main",n="resourceError",a="PromiseRejection",i="VueError",p="error",u="loaded",c="paint",l="first-contentful-paint",d="largest-contentful-paint",m="layout-shift",h="first-input",g="longTask",f="resource",y="pageResource",T="LocationChange",v="RouteChange";function $(e,t){if(window.PerformanceObserver){const r=new PerformanceObserver(function(r){const s=function(e,t){const r=t.getEntries(),s=[];return r.forEach(t=>{if("paint"===t.entryType&&("first-paint"===t.name&&s.push({type:c,message:`白屏时间 (FP): ${t.startTime+t.duration}ms`,extra:{value:t.startTime+t.duration},value:t.startTime+t.duration}),"first-contentful-paint"===t.name&&s.push({type:l,message:`首屏时间 (FCP): ${t.startTime+t.duration}ms`,extra:{value:t.startTime+t.duration},value:t.startTime+t.duration})),"largest-contentful-paint"===t.entryType){const{renderTime:e,startTime:r,duration:o}=t.renderTime,n=e||r+o;n>2500&&s.push({type:d,message:`元素 ${t.element.outerHTML} LCP 时间${n}毫秒，超过了 2.5 秒`,extra:{element:t.element.outerHTML,value:n},value:n})}if("first-input"===t.entryType&&t.processingStart-t.startTime>100&&s.push({type:h,message:"主线程阻塞时长超过 100 毫秒，用户体验不佳",extra:{value:t.processingStart-t.startTime},value:t.processingStart-t.startTime}),"layout-shift"!==t.entryType||t.hadRecentInput||t.value>.1&&s.push({type:m,message:"CLS 值超过 0.1，用户体验不佳",extra:{value:t.value},value:t.value}),"navigation"===t.entryType){s.push({type:u,message:`加载完成时间 (Load): ${t.loadEventEnd}ms`,value:t.loadEventEnd,extra:{value:t.loadEventEnd}});const r=t.domainLookupEnd-t.domainLookupStart,o=t.responseEnd-t.startTime;o>e.longTimeRequestThreshold&&s.push({type:y,message:`页面${t.name}请求耗时 ${o} 毫秒，超过了 ${e.longTimeRequestThreshold} 毫秒`,extra:{dnsTime:r,value:o,resourceName:t.name},value:o})}if("resource"===t.entryType){const r=t.domainLookupEnd-t.domainLookupStart,o=t.duration;o>e.longTimeRequestThreshold&&s.push({type:f,message:`资源${t.name}请求耗时 ${o} 毫秒，超过了 ${e.longTimeRequestThreshold} 毫秒`,extra:{dnsTime:r,value:o,resourceName:t.name},value:o})}if("longtask"===t.entryType){const e=t.duration-50>0?t.duration-50:0;e>50&&s.push({type:g,message:`检测到长任务，总耗时: ${t.duration} ms, 阻塞时间约: ${e} ms，大于建议的50ms内，请使用控制台performance（性能）进行性能分析`,extra:{duration:t.duration,blockingTime:e,resourceName:t.name},value:e})}}),s}(e,r);return"function"==typeof t&&t(s),s});r.observe({entryTypes:["paint","first-contentful-paint","largest-contentful-paint","first-input","layout-shift","interaction-to-next-paint","navigation","resource","longtask"],buffered:!0})}}function w(e){const t=[];return t.push(function(e){const t=history.pushState,r=history.replaceState;history.pushState=function(...r){const s=window.location.href,o=t.apply(this,r),n=window.location.href;return s!==n&&e({to:n,from:s}),o},history.replaceState=function(...t){const s=window.location.href,o=r.apply(this,t),n=window.location.href;return s!==n&&e({to:n,from:s}),o};const s=()=>{e({to:window.location.href,from:window.location.href})};return window.addEventListener("popstate",s),()=>{window.removeEventListener("popstate",s),history.pushState=t,history.replaceState=r}}(e)),()=>{t.forEach(e=>e())}}const R={reportUrl:"",appId:"",appVersion:"",appUrl:window.location.origin,appEnv:"prod",userAgent:window.navigator.userAgent,reportPath:"",reportError:!0,reportPromiseReject:!0,reportVueError:!0,vueInstance:null,reportPerformance:!0,listenPerformance:!0,longTimeRequestThreshold:2e3,reportErrorReqest:!0,errorRequestFunc:null,reportUserNavigate:!0,appSecretKey:""};class S{records=[];timer=null;options={};constructor(e){this.options={...R,...e}}init(){const e=localStorage.getItem("report-store-date"),u=`${(c=new Date).getFullYear()}-${c.getMonth()+1}-${c.getDate()}`;var c;e!==u&&(localStorage.setItem("report-store-date",u),localStorage.setItem("report-store-list","[]"));const l=JSON.parse(localStorage.getItem("report-store-list"));var d,m,h,g;if(this.options.reportError&&(d=e=>{l.includes(e.message)||(this.addReportRecord({reportType:t,...e}),l.push(e.message),localStorage.setItem("report-store-list",JSON.stringify(l)))},window.addEventListener("error",function(e){if(e.target){if(e.target&&("IMG"===e.target.tagName||"SCRIPT"===e.target.tagName||"LINK"===e.target.tagName||"VIDEO"===e.target.tagName||"AUDIO"===e.target.tagName||"SOURCE"===e.target.tagName)){const t=e.target,r={tagName:t.tagName,src:t.src||t.href,outerHTML:t.outerHTML,time:(new Date).toISOString()};e.preventDefault(),d&&d({type:n,message:`资源加载失败,${r.tagName}: ${r.src}`,extra:r})}}else{const t={message:e.error.stack,filename:e.filename,line:e.lineno,col:e.colno};e.preventDefault(),d&&d({type:o,message:t.message,extra:t})}},!0)),this.options.reportPromiseReject&&function(e){window.addEventListener("unhandledrejection",function(t){e&&e(t)})}(e=>{l.includes(e.reason?.stack)||(this.addReportRecord({reportType:t,type:a,message:e.reason?.stack}),l.push(e.reason?.stack),localStorage.setItem("report-store-list",JSON.stringify(l)))}),this.options.reportVueError&&this.options.vueInstance&&function(e,t){e.config.errorHandler=function(e,r,s){t&&t({err:e,vm:r,info:s})}}(this.options.vueInstance,({err:e})=>{l.includes(e.message)||(this.addReportRecord({reportType:t,type:i,message:e.message}),l.push(e.message),localStorage.setItem("report-store-list",JSON.stringify(l)))}),this.options.listenPerformance&&$(this.options,e=>{e.forEach(e=>{e.extra.resourceName!==this.options.reportUrl&&this.addReportRecord({reportType:r,...e})})}),this.options.reportErrorReqest&&(m=e=>{const{status:r,url:s,method:o,statusText:n}=e,a=`请求报错接口：${s}，方法：${o}，状态码：${r}，状态信息：${n}`;l.includes(a)||(this.addReportRecord({reportType:t,type:p,message:a}),l.push(a),localStorage.setItem("report-store-list",JSON.stringify(l)))},h=this.options,g=XMLHttpRequest.prototype.open,XMLHttpRequest.prototype.open=function(e,t,r,s,o){let n=Date.now();this.addEventListener("load",function(){const r=Date.now()-n;if(200===this.status){if("string"==typeof this.response)try{const s=JSON.parse(this.response);if("function"==typeof h.errorRequestFunc&&h.errorRequestFunc(s))return void(m&&m({message:`请求成功接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}， 请求耗时：${r}ms；服务器处理错误`,extra:{response:s,headers:this.getAllResponseHeaders()}}))}catch(e){}}else m&&m({message:`请求报错接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}`,extra:{headers:this.getAllResponseHeaders()}})}),this.addEventListener("error",function(){m&&m({message:`请求报错接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}`})}),g.call(this,e,t,r,s,o)},function(e,t,r){var s=window.fetch;window.fetch=function(e,o){let n=Date.now();return s(e,o).then(async s=>{const a=Date.now()-n,i=[...s.headers.entries()].map(e=>e.join(": ")).join("\n");if(200===s.status)try{const o=await s.json();if("function"==typeof r.errorRequestFunc&&r.errorRequestFunc(o))return void(t&&t({message:`请求成功接口：${e}，方法：${method}，状态码：${s.status}，状态信息：${s.statusText}， 请求耗时：${a}ms\n服务器处理错误`,extra:{response:o,headers:i}}))}catch(e){}else t&&t({message:`请求报错接口：${e}，方法：${o.method}，状态码：${s.status}，状态信息：${s.statusText}， 耗时：${a}ms`,extra:{headers:i}});return s}).catch(r=>{t&&t({message:`请求报错接口：${e}，方法：${o.method},错误信息\n${r.stack}`})})}}(0,e=>{const{url:r,method:s,statusText:o}=e,n=`请求报错接口：${r}，方法：${s}，状态信息：${o}`;l.includes(n)||(this.addReportRecord({reportType:t,type:p,message:n}),l.push(n),localStorage.setItem("report-store-list",JSON.stringify(l)))},this.options)),this.options.reportUserNavigate){const e=window.location.href;this.addReportRecord({reportType:s,type:T,message:`请求地址：${e}`,extra:JSON.stringify({url:e})}),w(e=>{this.addReportRecord({reportType:s,type:v,message:`路由变化：${e.to}`,extra:JSON.stringify({route:e.to})})})}}addReportRecord(e){this.timer&&clearTimeout(this.timer),this.timer=setTimeout(()=>{try{this.sendReport(JSON.parse(JSON.stringify(this.records))),this.records=[]}catch(e){}},1e3),this.records.push({appId:this.options.appId,appUrl:this.options.appUrl,reportPath:window.location.pathname,userAgent:window.navigator.userAgent,...e,extra:e.extra&&"object"==typeof e.extra?JSON.stringify(e.extra):void 0})}sendReport(e){const t={appSecretKey:this.options.appSecretKey,appId:this.options.appId,data:e},r=new Blob([JSON.stringify(t)],{type:"application/json; charset=UTF-8"});navigator.sendBeacon(this.options.reportUrl,r)}}let x;function E(e={}){x||(x=new S(e)),x.init()}var N={init:E};return e.default=N,e.init=E,Object.defineProperty(e,"__esModule",{value:!0}),e}({});

package/bundle.min.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).umd={})}(this,function(e){"use strict";function t(e,t,o){return t&&function(e,t){for(var o=0;o<t.length;o++){var n=t[o];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,i(n.key),n)}}(e.prototype,t),Object.defineProperty(e,"prototype",{writable:!1}),e}function o(e,t,o){return(t=i(t))in e?Object.defineProperty(e,t,{value:o,enumerable:!0,configurable:!0,writable:!0}):e[t]=o,e}function n(e,t){var o=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),o.push.apply(o,n)}return o}function r(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?n(Object(r),!0).forEach(function(t){o(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):n(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}function i(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var o=e[Symbol.toPrimitive];if(void 0!==o){var n=o.call(e,t);if("object"!=typeof n)return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return String(e)}(e,"string");return"symbol"==typeof t?t:t+""}function s(e){var t=[];return t.push(function(e){var t=history.pushState,o=history.replaceState;history.pushState=function(){for(var o=window.location.href,n=arguments.length,r=new Array(n),i=0;i<n;i++)r[i]=arguments[i];var s=t.apply(this,r),a=window.location.href;return o!==a&&e({to:a,from:o}),s},history.replaceState=function(){for(var t=window.location.href,n=arguments.length,r=new Array(n),i=0;i<n;i++)r[i]=arguments[i];var s=o.apply(this,r),a=window.location.href;return t!==a&&e({to:a,from:t}),s};var n=function(){e({to:window.location.href,from:window.location.href})};return window.addEventListener("popstate",n),function(){window.removeEventListener("popstate",n),history.pushState=t,history.replaceState=o}}(e)),function(){t.forEach(function(e){return e()})}}var a,c={appId:"",env:"production",appUrl:window.location.origin,reportError:!0,reportPromiseReject:!0,reportVueError:!0,vueInstance:null,reportPerformance:!0,reportLongTimeRequest:!0,longTimeRequestThreshold:2e3,reportErrorReqest:!0,reportUserNavigate:!0},u=function(){return t(function e(t){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,e),o(this,"records",[]),o(this,"timer",null),o(this,"options",{}),this.options=r(r({},c),t)},[{key:"init",value:function(){var e,t,o,n;if(this.options.reportError&&(e=function(e){var t=e.msg,o=e.url,n=e.line,r=e.col,i=e.error;console.log({msg:t,url:o,line:n,col:r,error:i})},window.onerror=function(t,o,n,r,i){e&&e({msg:t,url:o,line:n,col:r,error:i})}),this.options.reportPromiseReject&&function(e){window.addEventListener("unhandledrejection",function(t){e&&e(t)})}(function(e){console.log("Unhandled Promise Rejection:",e,e.reason)}),this.options.reportVueError&&this.options.vueInstance&&function(e,t){e.config.errorHandler=function(e,o,n){console.error("Error in ".concat(n,":"),e),t&&t({err:e,vm:o,info:n})}}(this.options.vueInstance,function(e){var t=e.err,o=e.vm,n=e.info;console.log("Vue error:",t,o,n)}),this.options.reportPerformance&&function(e){if(PerformanceNavigationTiming){var t=PerformanceNavigationTiming.loadEventEnd-PerformanceNavigationTiming.navigationStart;console.log("Page load time: "+t+"ms");var o=PerformanceNavigationTiming.getEntriesByType("largest-contentful-paint")[0];console.log("Largest Contentful Paint:",o.startTime);var n=PerformanceNavigationTiming.getEntriesByType("first-contentful-paint")[0];console.log("First Contentful Paint:",n.startTime);var r=PerformanceNavigationTiming.getEntriesByType("layout-shift")[0];console.log("Cumulative Layout Shift:",r.value);var i=PerformanceNavigationTiming.getEntriesByType("first-input-delay")[0];console.log("First Input Delay:",i.startTime),console.log("Total Blocking Time:",i.value);var s=PerformanceNavigationTiming.getEntriesByType("first-input")[0];console.log("First Input:",s.startTime);var a=PerformanceNavigationTiming.domainLookupEnd-PerformanceNavigationTiming.domainLookupStart;console.log("DNS查询时间:",a),e&&e({time:t,lcp:o,fcp:n,cls:r,fmp:i,FID:s,dnsTime:a})}}(function(e){var t=e.time,o=e.lcp,n=e.fcp,r=e.cls,i=e.fmp,s=e.FID,a=e.dnsTime;console.log({time:t,lcp:o,fcp:n,cls:r,fmp:i,FID:s,dnsTime:a})}),this.options.reportLongTimeRequest&&(t=function(e){console.log(e)},o=function(e){console.log(e)},n=XMLHttpRequest.prototype.open,XMLHttpRequest.prototype.open=function(e,r,i,s,a){var c=Date.now();this.addEventListener("load",function(){var o=Date.now();t&&t({url:r,method:e,duration:o-c,status:this.status,statusText:this.statusText,response:this.responseText}),console.log("Response:",this.responseText)}),this.addEventListener("error",function(){console.log("Error:",this.statusText),o&&o({url:r,method:e,duration:duration,status:this.status,statusText:this.statusText,response:this.responseText})}),console.log("Request URL:",r),console.log("Request Method:",e),n.call(this,e,r,i,s,a)},function(e,t){var o=window.fetch;window.fetch=function(n,r){console.log("Fetch URL:",n),console.log("Fetch Options:",r),r&&r.headers&&(r.headers["X-Custom-Header"]="Value");var i=Date.now();return o(n,r).then(function(t){var o=Date.now();return e&&e({url:n,method:method,duration:o-i,status:t.status,statusText:t.statusText,response:t.responseText}),console.log("Response:",t),t}).catch(function(e){console.log("Error:",e),t&&t({url:n,method:method,duration:duration})})}}(function(e){console.log(e)},function(e){console.log(e)})),this.options.reportUserNavigate){var r=window.location.href;console.log("current href:",r),s(function(e){console.log("route change:",e)})}}},{key:"addReportRecord",value:function(e){var t=this;this.timer&&clearTimeout(this.timer),this.timer=setTimeout(function(){try{t.sendReport(JSON.parse(JSON.stringify(t.records))),t.records=[]}catch(e){console.log(e)}},1e3),this.records.push(e)}},{key:"sendReport",value:function(e){this.apiDo(this.records)}}])}();e.init=function(){a||(a=new u(arguments.length>0&&void 0!==arguments[0]?arguments[0]:{})),a.init()}});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).reportSdk={})}(this,function(e){"use strict";const t="error",r="performance",s="user",o="main",n="resourceError",a="PromiseRejection",i="VueError",p="error",u="loaded",c="paint",l="first-contentful-paint",d="largest-contentful-paint",m="layout-shift",h="first-input",f="longTask",g="resource",y="pageResource",T="LocationChange",v="RouteChange";function $(e,t){if(window.PerformanceObserver){const r=new PerformanceObserver(function(r){const s=function(e,t){const r=t.getEntries(),s=[];return r.forEach(t=>{if("paint"===t.entryType&&("first-paint"===t.name&&s.push({type:c,message:`白屏时间 (FP): ${t.startTime+t.duration}ms`,extra:{value:t.startTime+t.duration},value:t.startTime+t.duration}),"first-contentful-paint"===t.name&&s.push({type:l,message:`首屏时间 (FCP): ${t.startTime+t.duration}ms`,extra:{value:t.startTime+t.duration},value:t.startTime+t.duration})),"largest-contentful-paint"===t.entryType){const{renderTime:e,startTime:r,duration:o}=t.renderTime,n=e||r+o;n>2500&&s.push({type:d,message:`元素 ${t.element.outerHTML} LCP 时间${n}毫秒，超过了 2.5 秒`,extra:{element:t.element.outerHTML,value:n},value:n})}if("first-input"===t.entryType&&t.processingStart-t.startTime>100&&s.push({type:h,message:"主线程阻塞时长超过 100 毫秒，用户体验不佳",extra:{value:t.processingStart-t.startTime},value:t.processingStart-t.startTime}),"layout-shift"!==t.entryType||t.hadRecentInput||t.value>.1&&s.push({type:m,message:"CLS 值超过 0.1，用户体验不佳",extra:{value:t.value},value:t.value}),"navigation"===t.entryType){s.push({type:u,message:`加载完成时间 (Load): ${t.loadEventEnd}ms`,value:t.loadEventEnd,extra:{value:t.loadEventEnd}});const r=t.domainLookupEnd-t.domainLookupStart,o=t.responseEnd-t.startTime;o>e.longTimeRequestThreshold&&s.push({type:y,message:`页面${t.name}请求耗时 ${o} 毫秒，超过了 ${e.longTimeRequestThreshold} 毫秒`,extra:{dnsTime:r,value:o,resourceName:t.name},value:o})}if("resource"===t.entryType){const r=t.domainLookupEnd-t.domainLookupStart,o=t.duration;o>e.longTimeRequestThreshold&&s.push({type:g,message:`资源${t.name}请求耗时 ${o} 毫秒，超过了 ${e.longTimeRequestThreshold} 毫秒`,extra:{dnsTime:r,value:o,resourceName:t.name},value:o})}if("longtask"===t.entryType){const e=t.duration-50>0?t.duration-50:0;e>50&&s.push({type:f,message:`检测到长任务，总耗时: ${t.duration} ms, 阻塞时间约: ${e} ms，大于建议的50ms内，请使用控制台performance（性能）进行性能分析`,extra:{duration:t.duration,blockingTime:e,resourceName:t.name},value:e})}}),s}(e,r);return"function"==typeof t&&t(s),s});r.observe({entryTypes:["paint","first-contentful-paint","largest-contentful-paint","first-input","layout-shift","interaction-to-next-paint","navigation","resource","longtask"],buffered:!0})}}function w(e){const t=[];return t.push(function(e){const t=history.pushState,r=history.replaceState;history.pushState=function(...r){const s=window.location.href,o=t.apply(this,r),n=window.location.href;return s!==n&&e({to:n,from:s}),o},history.replaceState=function(...t){const s=window.location.href,o=r.apply(this,t),n=window.location.href;return s!==n&&e({to:n,from:s}),o};const s=()=>{e({to:window.location.href,from:window.location.href})};return window.addEventListener("popstate",s),()=>{window.removeEventListener("popstate",s),history.pushState=t,history.replaceState=r}}(e)),()=>{t.forEach(e=>e())}}const R={reportUrl:"",appId:"",appVersion:"",appUrl:window.location.origin,appEnv:"prod",userAgent:window.navigator.userAgent,reportPath:"",reportError:!0,reportPromiseReject:!0,reportVueError:!0,vueInstance:null,reportPerformance:!0,listenPerformance:!0,longTimeRequestThreshold:2e3,reportErrorReqest:!0,errorRequestFunc:null,reportUserNavigate:!0,appSecretKey:""};class S{records=[];timer=null;options={};constructor(e){this.options={...R,...e}}init(){const e=localStorage.getItem("report-store-date"),u=`${(c=new Date).getFullYear()}-${c.getMonth()+1}-${c.getDate()}`;var c;e!==u&&(localStorage.setItem("report-store-date",u),localStorage.setItem("report-store-list","[]"));const l=JSON.parse(localStorage.getItem("report-store-list"));var d,m,h,f;if(this.options.reportError&&(d=e=>{l.includes(e.message)||(this.addReportRecord({reportType:t,...e}),l.push(e.message),localStorage.setItem("report-store-list",JSON.stringify(l)))},window.addEventListener("error",function(e){if(e.target){if(e.target&&("IMG"===e.target.tagName||"SCRIPT"===e.target.tagName||"LINK"===e.target.tagName||"VIDEO"===e.target.tagName||"AUDIO"===e.target.tagName||"SOURCE"===e.target.tagName)){const t=e.target,r={tagName:t.tagName,src:t.src||t.href,outerHTML:t.outerHTML,time:(new Date).toISOString()};e.preventDefault(),d&&d({type:n,message:`资源加载失败,${r.tagName}: ${r.src}`,extra:r})}}else{const t={message:e.error.stack,filename:e.filename,line:e.lineno,col:e.colno};e.preventDefault(),d&&d({type:o,message:t.message,extra:t})}},!0)),this.options.reportPromiseReject&&function(e){window.addEventListener("unhandledrejection",function(t){e&&e(t)})}(e=>{l.includes(e.reason?.stack)||(this.addReportRecord({reportType:t,type:a,message:e.reason?.stack}),l.push(e.reason?.stack),localStorage.setItem("report-store-list",JSON.stringify(l)))}),this.options.reportVueError&&this.options.vueInstance&&function(e,t){e.config.errorHandler=function(e,r,s){t&&t({err:e,vm:r,info:s})}}(this.options.vueInstance,({err:e})=>{l.includes(e.message)||(this.addReportRecord({reportType:t,type:i,message:e.message}),l.push(e.message),localStorage.setItem("report-store-list",JSON.stringify(l)))}),this.options.listenPerformance&&$(this.options,e=>{e.forEach(e=>{e.extra.resourceName!==this.options.reportUrl&&this.addReportRecord({reportType:r,...e})})}),this.options.reportErrorReqest&&(m=e=>{const{status:r,url:s,method:o,statusText:n}=e,a=`请求报错接口：${s}，方法：${o}，状态码：${r}，状态信息：${n}`;l.includes(a)||(this.addReportRecord({reportType:t,type:p,message:a}),l.push(a),localStorage.setItem("report-store-list",JSON.stringify(l)))},h=this.options,f=XMLHttpRequest.prototype.open,XMLHttpRequest.prototype.open=function(e,t,r,s,o){let n=Date.now();this.addEventListener("load",function(){const r=Date.now()-n;if(200===this.status){if("string"==typeof this.response)try{const s=JSON.parse(this.response);if("function"==typeof h.errorRequestFunc&&h.errorRequestFunc(s))return void(m&&m({message:`请求成功接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}， 请求耗时：${r}ms；服务器处理错误`,extra:{response:s,headers:this.getAllResponseHeaders()}}))}catch(e){}}else m&&m({message:`请求报错接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}`,extra:{headers:this.getAllResponseHeaders()}})}),this.addEventListener("error",function(){m&&m({message:`请求报错接口：${t}，方法：${e}，状态码：${this.status}，状态信息：${this.statusText}`})}),f.call(this,e,t,r,s,o)},function(e,t,r){var s=window.fetch;window.fetch=function(e,o){let n=Date.now();return s(e,o).then(async s=>{const a=Date.now()-n,i=[...s.headers.entries()].map(e=>e.join(": ")).join("\n");if(200===s.status)try{const o=await s.json();if("function"==typeof r.errorRequestFunc&&r.errorRequestFunc(o))return void(t&&t({message:`请求成功接口：${e}，方法：${method}，状态码：${s.status}，状态信息：${s.statusText}， 请求耗时：${a}ms\n服务器处理错误`,extra:{response:o,headers:i}}))}catch(e){}else t&&t({message:`请求报错接口：${e}，方法：${o.method}，状态码：${s.status}，状态信息：${s.statusText}， 耗时：${a}ms`,extra:{headers:i}});return s}).catch(r=>{t&&t({message:`请求报错接口：${e}，方法：${o.method},错误信息\n${r.stack}`})})}}(0,e=>{const{url:r,method:s,statusText:o}=e,n=`请求报错接口：${r}，方法：${s}，状态信息：${o}`;l.includes(n)||(this.addReportRecord({reportType:t,type:p,message:n}),l.push(n),localStorage.setItem("report-store-list",JSON.stringify(l)))},this.options)),this.options.reportUserNavigate){const e=window.location.href;this.addReportRecord({reportType:s,type:T,message:`请求地址：${e}`,extra:JSON.stringify({url:e})}),w(e=>{this.addReportRecord({reportType:s,type:v,message:`路由变化：${e.to}`,extra:JSON.stringify({route:e.to})})})}}addReportRecord(e){this.timer&&clearTimeout(this.timer),this.timer=setTimeout(()=>{try{this.sendReport(JSON.parse(JSON.stringify(this.records))),this.records=[]}catch(e){}},1e3),this.records.push({appId:this.options.appId,appUrl:this.options.appUrl,reportPath:window.location.pathname,userAgent:window.navigator.userAgent,...e,extra:e.extra&&"object"==typeof e.extra?JSON.stringify(e.extra):void 0})}sendReport(e){const t={appSecretKey:this.options.appSecretKey,appId:this.options.appId,data:e},r=new Blob([JSON.stringify(t)],{type:"application/json; charset=UTF-8"});navigator.sendBeacon(this.options.reportUrl,r)}}let x;function E(e={}){x||(x=new S(e)),x.init()}var N={init:E};e.default=N,e.init=E,Object.defineProperty(e,"__esModule",{value:!0})});

package/package.json

@@ -1,8 +1,16 @@
 {
   "name": "keeson-web-report-sdk",
-  "version": "1.1.1",
+  "version": "1.1.5",
   "description": "for web/h5",
-  "main": "bundle.min.js",
+  "main": "src/index.js",
+  "module": "src/index.js",
+  "exports": {
+    ".": {
+      "require": "./src/index.js",
+      "import": "./src/index.js",
+      "browser": "./src/index.js"
+    }
+  },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "build": "rollup --config rollup.config.js"
@@ -16,12 +24,15 @@
     "@rollup/plugin-node-resolve": "^16.0.3",
     "@rollup/plugin-terser": "^0.4.4",
     "core-js": "^3.47.0",
+    "regenerator-runtime": "^0.14.1",
     "rollup": "^4.55.1"
   },
   "files": [
-    "bundle.min.js"
+    "bundle.cjs.js",
+    "bundle.esm.js",
+    "bundle.min.js",
+    "bundle.iife.min.js"
   ],
   "dependencies": {
-    "regenerator-runtime": "^0.14.1"
   }
 }

package/src/index.js

@@ -0,0 +1,323 @@
+import * as reportError from "./report-error";
+import * as reportPerformance from "./report-performance";
+import * as reportRequest from "./report-request";
+import * as reportUser from "./report-user";
+import {
+  REPORT_TYPE,
+  ERROR_TYPE,
+  REQUEST_ERROR_TYPE,
+  USER_TYPE,
+} from "./consts";
+function formatDate(date) {
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
+  return `${year}-${month}-${day}`;
+}
+const defaultOptions = {
+  reportUrl: "", // 上报请求地址
+
+  // app基本信息
+  appId: "", // appId
+  appVersion: "",
+  appUrl: window.location.origin, // 站点地址, 对应应用配置网站站点地址
+  appEnv: "prod",
+  userAgent: window.navigator.userAgent,
+
+  reportPath: "", // 上报页面路径
+
+  // 上报记录
+  reportError: true,
+  reportPromiseReject: true,
+  reportVueError: true,
+  vueInstance: null,
+
+  reportPerformance: true, // 是否上报性能数据
+  listenPerformance: true, // 是否监听性能数据
+
+  longTimeRequestThreshold: 2000, // 长请求时间阈值，单位毫秒
+  reportErrorReqest: true, // 是否上报报错请求
+  errorRequestFunc: null, // 错误请求过滤函数
+  //  response => {
+  //   return response.data.code !== 0
+  // },
+
+  reportUserNavigate: true, // 是否上报用户导航行为
+
+  // repeatRequestTime: 2000, // todo: 2s调用同一接口，同一参数，上报
+  appSecretKey: "", // 应用密钥
+  // 级别：错误、性能信息、用户导航行为、重复请求
+};
+
+class Report {
+  records = [];
+  timer = null;
+  options = {};
+  constructor(options) {
+    this.options = { ...defaultOptions, ...options };
+  }
+  init() {
+    const storeDate = localStorage.getItem("report-store-date");
+
+    const today = formatDate(new Date());
+    if (storeDate !== today) {
+      localStorage.setItem("report-store-date", today);
+      localStorage.setItem("report-store-list", "[]");
+    }
+
+    const reportStoreList = JSON.parse(localStorage.getItem("report-store-list"));
+
+    // type	 类型 (string) Required
+    // errorType	 错误类型 (string)
+    // performanceType	 性能上报指标 (string)
+    // requestType	 请求上报指标 (string)
+    // navigationType	 导航上报指标 (string)
+    // message	 上报信息 (string)
+    // extra	 额外信息 (string)
+    // originData	 原始数据 (string)
+
+    // todo: 重复的上报太多，需要过滤
+
+    // listen and callback
+    if (this.options.reportError) {
+      // 错误上报
+      // 包含：资源加载错误，全局代码错误
+      reportError.globalErrorHandler((res) => {
+        if(reportStoreList.includes(res.message)) {
+          return;
+        }
+        this.addReportRecord({
+          reportType: REPORT_TYPE.ERROR,
+          ...res,
+        });
+        reportStoreList.push(res.message);
+        localStorage.setItem("report-store-list", JSON.stringify(reportStoreList));
+      });
+    }
+    if (this.options.reportPromiseReject) {
+      // 未处理的 Promise 错误上报
+      reportError.promiseErrorHandler((event) => {
+        if(reportStoreList.includes(event.reason?.stack)) {
+          return;
+        }
+        this.addReportRecord({
+          reportType: REPORT_TYPE.ERROR,
+          type: ERROR_TYPE.PROMISE_REJECTION,
+          message: event.reason?.stack,
+        });
+        reportStoreList.push(event.reason?.stack);
+        localStorage.setItem("report-store-list", JSON.stringify(reportStoreList));
+      });
+    }
+    if (this.options.reportVueError && this.options.vueInstance) {
+      // vue错误上报
+      reportError.vueErrorHandler(this.options.vueInstance, ({ err }) => {
+        if(reportStoreList.includes(err.message)) {
+          return;
+        }
+        this.addReportRecord({
+          reportType: REPORT_TYPE.ERROR,
+          type: ERROR_TYPE.VUE_ERROR,
+          message: err.message,
+        });
+        reportStoreList.push(err.message);
+        localStorage.setItem("report-store-list", JSON.stringify(reportStoreList));
+      });
+    }
+
+    // if (this.options.reportPerformance) {
+    //   // 性能上报
+    //   reportPerformance.reportPerformance(options, (performanceList) => {
+    //     this.addReportRecord({
+    //       reportType: REPORT_TYPE.PERFORMANCE,
+    //       type: "performance",
+    //       message: "",
+    //       extra: JSON.stringify(performanceList),
+    //     });
+    //   });
+    // }
+
+    if (this.options.listenPerformance) {
+      console.log("加载性能：fp, fcp, lcp, tbt, cls,等");
+      console.log("资源加载性能：dns, tcp, ssl, firstByte, download,等");
+      console.log("接口调用时间，需要剔除上报接口！");
+
+      // reportPerformance.loadedTimestamp((item) => {
+      //   this.addReportRecord({
+      //     reportType: REPORT_TYPE.PERFORMANCE,
+      //     ...item,
+      //   });
+      // });
+
+      // console.log(this.options,)
+      reportPerformance.listenPerformance(this.options, (performanceList) => {
+        // 加载性能：fp, fcp, lcp, tbt, cls,等
+        // 资源加载性能：dns, tcp, ssl, firstByte, download,等
+        // console.log('=============["performanceList"]:',performanceList)
+        performanceList.forEach((item) => {
+          if (item.extra.resourceName !== this.options.reportUrl) {
+            this.addReportRecord({
+              reportType: REPORT_TYPE.PERFORMANCE,
+              ...item,
+            });
+          }
+        });
+        // this.addReportRecord({
+        //   reportType: REPORT_TYPE.PERFORMANCE,
+        //   type: "performance",
+        //   message: "",
+        //   extra: JSON.stringify(performanceList),
+        // });
+      });
+    }
+
+    if (this.options.reportErrorReqest) {
+      // 请求性能上报
+      reportRequest.xhrReportHandle(
+        null,
+        // (res) => {
+        //   if (
+        //     !!this.options.longTimeRequestThreshold &&
+        //     res.duration > this.options.longTimeRequestThreshold
+        //   ) {
+        //     const { duration, url, method } = res;
+        //     this.addReportRecord({
+        //       reportType: REPORT_TYPE.REQUEST,
+        //       type: REQUEST_ERROR_TYPE.LONG,
+        //       message: `长请求时间接口：${url}，方法：${method}，耗时：${duration}ms`,
+        //       extra: JSON.stringify({ duration }),
+        //     });
+        //   }
+        // },
+        (error) => {
+          const { status, url, method, statusText } = error;
+          const message = `请求报错接口：${url}，方法：${method}，状态码：${status}，状态信息：${statusText}`
+          if(reportStoreList.includes(message)) {
+            return;
+          }
+          this.addReportRecord({
+            reportType: REPORT_TYPE.ERROR,
+            type: REQUEST_ERROR_TYPE.ERROR,
+            message: message,
+          });
+          reportStoreList.push(message);
+          localStorage.setItem("report-store-list", JSON.stringify(reportStoreList));
+        },
+        this.options,
+      );
+      reportRequest.fetchReportHandle(
+        // (res) => {
+        //   if (
+        //     !!this.options.longTimeRequestThreshold &&
+        //     res.duration > this.options.longTimeRequestThreshold
+        //   ) {
+        //     const { duration, url, method } = res;
+        //     this.addReportRecord({
+        //       reportType: REPORT_TYPE.REQUEST,
+        //       type: REQUEST_ERROR_TYPE.LONG,
+        //       message: `长请求时间接口：${url}，方法：${method}，耗时：${duration}ms`,
+        //       extra: JSON.stringify({ duration }),
+        //     });
+        //   }
+        // },
+        null,
+        (error) => {
+          const { url, method, statusText } = error;
+          const message = `请求报错接口：${url}，方法：${method}，状态信息：${statusText}`
+          if(reportStoreList.includes(message)) {
+            return;
+          }
+          this.addReportRecord({
+            reportType: REPORT_TYPE.ERROR,
+            type: REQUEST_ERROR_TYPE.ERROR,
+            message: message,
+          });
+          reportStoreList.push(message);
+          localStorage.setItem("report-store-list", JSON.stringify(reportStoreList)); 
+        },
+        this.options,
+      );
+    }
+
+    if (this.options.reportUserNavigate) {
+      const href = window.location.href;
+      this.addReportRecord({
+        reportType: REPORT_TYPE.USER,
+        type: USER_TYPE.LOCATION_CHANGE,
+        message: `请求地址：${href}`,
+        extra: JSON.stringify({
+          url: href,
+        }),
+      });
+      reportUser.initRouteListener((record) => {
+        this.addReportRecord({
+          reportType: REPORT_TYPE.USER,
+          type: USER_TYPE.ROUTE_CHANGE,
+          message: `路由变化：${record.to}`,
+          extra: JSON.stringify({
+            route: record.to,
+          }),
+        });
+      });
+    }
+  }
+  addReportRecord(record) {
+    this.timer && clearTimeout(this.timer);
+    this.timer = setTimeout(() => {
+      try {
+        this.sendReport(JSON.parse(JSON.stringify(this.records)));
+        this.records = [];
+      } catch (error) {
+        console.log(error);
+      }
+    }, 1000);
+
+    this.records.push({
+      appId: this.options.appId,
+      appUrl: this.options.appUrl,
+      reportPath: window.location.pathname,
+      userAgent: window.navigator.userAgent,
+      ...record,
+      extra:
+        record.extra && typeof record.extra === "object"
+          ? JSON.stringify(record.extra)
+          : undefined,
+    });
+  }
+  sendReport(records) {
+    const analyticsData = {
+      appSecretKey: this.options.appSecretKey,
+      appId: this.options.appId,
+      data: records,
+    };
+    const blob = new Blob(
+      [JSON.stringify(analyticsData)], // 将JavaScript对象转换为JSON字符串
+      { type: "application/json; charset=UTF-8" }, // 在这里设置Content-Type
+    );
+    const success = navigator.sendBeacon(this.options.reportUrl, blob);
+    if (success) {
+      console.log("数据已成功加入发送队列。");
+      console.log(analyticsData);
+    } else {
+      console.log("数据入队失败，需要降级方案。");
+    }
+  }
+}
+
+let report;
+export function init(options = {}) {
+  if (!report) report = new Report(options);
+  report.init();
+}
+
+// // 导出所有模块
+// export {
+//   reportError,
+//   reportPerformance,
+//   reportRequest,
+//   reportUser,
+//   init
+// };
+export default {
+  init,
+};