浏览代码

精细化网络请求事件统计

Michael Wang 6 年之前
父节点
当前提交
8a5394c9db
共有 2 个文件被更改,包括 28 次插入15 次删除
  1. 22 10
      src/plugins/axios.js
  2. 6 5
      src/plugins/networkInformationHint.js

+ 22 - 10
src/plugins/axios.js

@@ -128,15 +128,32 @@ _$http.interceptors.request.use(
   }
 );
 
-// Add a response interceptor
-_$httpWith500Msg.interceptors.response.use(
-  response => {
+const recordRequest = response => {
+  let matchedRoutePath;
+  try {
+    const matched = router.resolve(location).route.matched;
+    const exactMatched = matched[matched.length - 1];
+    matchedRoutePath = exactMatched.path;
+  } catch (error) {
+    console.log(error);
     window._hmt.push([
       "_trackEvent",
       `页面-${location.pathname}`,
       "网络请求-响应",
-      new URL(response.config.url, "http://www.qmth.com.cn").pathname
+      "解析出错"
     ]);
+  }
+  window._hmt.push([
+    "_trackEvent",
+    `页面-${matchedRoutePath || location.pathname}`,
+    "网络请求-响应",
+    new URL(response.config.url, "http://www.qmth.com.cn").pathname
+  ]);
+};
+// Add a response interceptor
+_$httpWith500Msg.interceptors.response.use(
+  response => {
+    recordRequest(response);
     return response;
   },
   error => {
@@ -213,12 +230,7 @@ _$httpWith500Msg.interceptors.response.use(
 _$http.interceptors.response.use(
   // no auto 500 error UI
   response => {
-    window._hmt.push([
-      "_trackEvent",
-      `页面-${location.pathname}`,
-      "网络请求-响应",
-      new URL(response.config.url, "http://www.qmth.com.cn").pathname
-    ]);
+    recordRequest(response);
     return response;
   },
   error => {

+ 6 - 5
src/plugins/networkInformationHint.js

@@ -5,12 +5,13 @@ const sessionNoNetworkHint = "networkInformationHint-nohint";
 
 export default function networkInformationHint() {
   if (navigator.connection && navigator.connection.downlink) {
-    window._hmt.push([
-      "_trackEvent",
-      "网络状况不佳",
-      "下载小于2Mb,延迟大于1000ms"
-    ]);
     if (navigator.connection.downlink < 2 || navigator.connection.rtt > 1000) {
+      window._hmt.push([
+        "_trackEvent",
+        "网络状况不佳",
+        "下载小于2Mb,延迟大于1000ms"
+      ]);
+
       if (
         Date.now() - ___networkInformationHintLastTime > 3000 &&
         !sessionStorage.getItem(sessionNoNetworkHint)