[add] report log

src/http/configAPI.js

@@ -6,7 +6,11 @@ const api = {
 	development: 'https://testapi.denetme.net'
 }
 
-export const baseAPIUrl = api[process.env.NODE_ENV] + '/denet'
+const logApi = {
+	production: 'https://api.piaoquantv.com',
+	pre: 'https://preapi.piaoquantv.com',
+	development: 'https://testapi.piaoquantv.com'
+}
 
 const page = {
 	production: "https://h5.denetme.net",
@@ -14,4 +18,9 @@ const page = {
 	development: 'https://testh5.denetme.net'
 }
 
-export const pageUrl = page[process.env.NODE_ENV] 
+export const baseAPIUrl = api[process.env.NODE_ENV] + '/denet'
+
+export const logAPIUrl = logApi[process.env.NODE_ENV] + '/log-center'
+
+export const pageUrl = page[process.env.NODE_ENV] 
+

src/http/logApi.js

@@ -0,0 +1,11 @@
+import { service } from "./request";
+import { logAPIUrl } from '@/http/configAPI.js'
+
+export function logApi(params) {
+    return service({
+        url: `${logAPIUrl}/statistics/uploadLogFromFrontend
+        `,
+        method: 'post',
+        data: params
+    })
+}

src/http/request.js

@@ -16,36 +16,54 @@ export const service = axios.create({
 })
 
 function checkParams(config) {
-  const { accessToken: token = '' } = userInfo || {};
-  const { mid } = storage_mid || {}
+  const { accessToken: token = '', uid = '' } = userInfo || {};
+  const { mid } = storage_mid || {};
 
   if (config.method === 'get') {
     let { baseInfo = null } = config.params || {};
+    let params = {
+      ...config.params
+    }
+
+    let {pageSource} = params.params || {};
+    if(pageSource) {
+      delete params.params.pageSource;
+    }
+
     if (!baseInfo || !baseInfo.token) {
-      config['params']['baseInfo'] = {
+      params['baseInfo'] = {
         token: token,
         mid,
-        appVersionCode
+        appVersionCode,
+        loginUid: uid,
+        machineCode: mid,
+        pageSource: pageSource || ''
       }
     }
-    let params = {
-      ...config.params
-    }
     config['params'] = params;
   }
 
   if (config.method === 'post') {
     let { baseInfo = null } = config.data || {};
+    let data = {
+      ...config.data
+    }
+    console.log('data', data)
+    let {pageSource} = data.params || {};
+    if(pageSource) {
+      delete data.params.pageSource;
+    }
+
     if (!baseInfo || !baseInfo.token) {
-      config['data']['baseInfo'] = {
+      data['baseInfo'] = {
         token: token,
         mid,
-        appVersionCode
+        appVersionCode,
+        loginUid: uid,
+        machineCode: mid,
+        pageSource: pageSource || ''
       }
     }
-    let data = {
-      ...config.data
-    }
     config['data'] = data;
   }
   return config

src/logcenter/log.js

@@ -0,0 +1,9 @@
+import * as logger from './logger'
+import * as logEnum from './logEnum'
+
+
+
+export default {
+  ...logger,
+  ...logEnum
+}

src/logcenter/logEnum.js

@@ -0,0 +1,24 @@
+export const logType = {
+    'denet': '150',//denet-logcenter
+}
+
+export const businessType = {
+    buttonView: "buttonView",
+    buttonClick: "buttonClick",
+    pageView: "pageView",
+}
+
+export const objectType = {
+    buttonMain: "button-main",
+    buttonSecond: "button-second",
+    confirmButton: "confirm-button",
+    tweetPostBinded: "TweetPostBinded"
+}
+
+export const pageSource = {
+    mainPage: "main-page",
+    publisherDialog: "publisher-dialog",
+    currencySelectorPage: "currency-selector-page",
+    rechargePage: "recharge-page",
+    previewPage: "preview-page"
+}

src/logcenter/logger.js

@@ -0,0 +1,41 @@
+import {logApi} from '@/http/logApi'
+import { logType } from './logEnum.js';
+
+
+/**
+ * @eventData 以键值对存储，会在最终上报里解开的参数
+ * @extParams 最终上报到阿里云以json字符串存储的参数，如果extparams传入的不是obj会转换成obj
+ */
+export function reportLog(eventData = {}, extParams = {}) {
+    paramsPretreatmentAndRequest(logType.denet, eventData, extParams)
+}
+
+function paramsPretreatmentAndRequest(logType, eventData, extParams) {
+    extParams = wrapObject(extParams)
+    let obj = {};
+    let pageSource = eventData.pageSource;
+    if(eventData.hasOwnProperty('pageSource')) {
+        delete eventData.pageSource;
+    }
+    obj.logType = logType;
+    obj.eventData = JSON.stringify(eventData)
+    obj.extParams = JSON.stringify(extParams)
+    logApi({params: {
+        pageSource,
+        ...obj
+    }})
+}
+
+function wrapObject(extParams) {
+    if (typeDecide(extParams, 'Object')) {
+        return extParams
+    }
+    return { 'defaultExt': extParams }
+}
+
+/**
+ * 检测对象类型
+ */
+function typeDecide(o, type) {
+    return Object.prototype.toString.call(o) === `[object ${type}]`;
+}

src/logic/twitter.js

@@ -2,6 +2,7 @@ import { getChromeStorage, setChromeStorage, LANDING_PAGE } from '@/uilts/chrome
 import { throttle } from '@/uilts/help'
 import { getTtwitterRequestToken, twitterLogin } from '../server/twitter.js'
 import { srcPublishSuccess } from '@/http/publishApi'
+import Report from "@/logcenter/log"
 
 let dom = {};
 
@@ -200,11 +201,23 @@ function _publishTweetEvent(contentStr, cb) {
 function _addDeNetEditBtn(parent, dom, isClick = false) {
     setTimeout(() => {
         if (parent && parent.parentNode) {
+            Report.reportLog({
+                pageSource: Report.pageSource.mainPage,
+                businessType: Report.businessType.buttonView,
+                objectType: Report.objectType.buttonSecond
+            });
             parent.parentNode.insertBefore(dom, parent.nextElementSibling);
         } else {
             setTimeout(() => {
                 parent = _getScheduleDom(isClick);
-                parent && parent.parentNode && parent.parentNode.insertBefore(dom, parent.nextElementSibling);
+                if(parent && parent.parentNode) {
+                    Report.reportLog({
+                        pageSource: Report.pageSource.mainPage,
+                        businessType: Report.businessType.buttonView,
+                        objectType: Report.objectType.buttonSecond
+                    });
+                    parent.parentNode.insertBefore(dom, parent.nextElementSibling);
+                }
             }, 1000)
         }
     })
@@ -385,12 +398,14 @@ function _createBtnDom(port) {
     style.innerHTML = "#de-btn:hover{opacity: .9;};@-webkit-keyframes load{from{ transform: rotate(0deg);} to{transform: rotate(360deg);}}";
     document.getElementsByTagName('head').item(0).appendChild(style);
 
+    // 左侧大屏按钮
     let deBtn = document.createElement('span');
     // const shadowDiv = document.createElement('div');
     deBtn.innerHTML = '<span>DeNet</span>';
     deBtn.id = 'de-btn';
     deBtn.style.cssText = 'width:90%;height: 52px;text-align:center;line-height:52px;margin-bottom: 4px;margin-top: 4px;background: linear-gradient(274.8deg, #FF9900 -3.69%, #BD00FF 69.71%, #00F0FF 122.65%);color:#fff;font-size:17px;font-weight:700;border-radius:100px;cursor: pointer;display: flex;align-items: center;justify-content: center;';
 
+    // 编辑框内按钮
     const deBtn1 = document.createElement('img');
     let src = require("@/assets/img/icon-gift-pack.png");
     const smallDeBtnStyle = 'width:20px;height: 20px;cursor: pointer;marign-left:4px;margin-right:4px';
@@ -403,21 +418,37 @@ function _createBtnDom(port) {
     deBtn2.style.cssText = smallDeBtnStyle;
     deBtn2.src = "@/assets/img/icon-gift-pack.png"
 
+    // 小屏按钮
     const deBtn3 = document.createElement('img');
     deBtn3.id = 'de-btn3'
     deBtn3.src = require("@/assets/logo/128.png");
     deBtn3.style.cssText = 'width:52px;height: 52px;margin-top:20px;cursor: pointer;';
 
     deBtn.addEventListener('click', () => {
+        Report.reportLog({
+            pageSource: Report.pageSource.mainPage,
+            businessType: Report.businessType.buttonClick,
+            objectType: Report.objectType.buttonMain
+        });
         _deNetBtnClick(port);
     })
     deBtn1.addEventListener('click', () => {
+        Report.reportLog({
+            pageSource: Report.pageSource.mainPage,
+            businessType: Report.businessType.buttonClick,
+            objectType: Report.objectType.buttonSecond
+        });
         _deNetBtnClick(port);
     })
     deBtn2.addEventListener('click', () => {
         _deNetBtnClick(port);
     })
     deBtn3.addEventListener('click', () => {
+        Report.reportLog({
+            pageSource: Report.pageSource.mainPage,
+            businessType: Report.businessType.buttonClick,
+            objectType: Report.objectType.buttonMain
+        });
         _deNetBtnClick(port);
     })
     dom.deBtn = deBtn;
@@ -433,12 +464,22 @@ function addSliderNavDeBtn(isSmall = false) {
         let deBtn = document.getElementById('de-btn');
         if (bigDom && !deBtn) {
             bigDom.appendChild(dom.deBtn);
+            Report.reportLog({
+                pageSource: Report.pageSource.mainPage,
+                businessType: Report.businessType.buttonView,
+                objectType: Report.objectType.buttonMain
+            });
         }
     } else {
         let smallDom = document.querySelector('h1[role]').parentNode.parentNode;
         let deBtn3 = document.getElementById('de-btn3');
         if (smallDom && !deBtn3) {
             smallDom.appendChild(dom.deBtn3);
+            Report.reportLog({
+                pageSource: Report.pageSource.mainPage,
+                businessType: Report.businessType.buttonView,
+                objectType: Report.objectType.buttonMain
+            });
         }
     }
 }
@@ -495,6 +536,9 @@ function bindTwitterArtMethod({ postId, twitterId }) {
                 }
             }).then((res) => {
                 if (res.code == 0) {
+                    Report.reportLog({
+                        objectType: Report.objectType.tweetPostBinded
+                    });  
                     bindTwitterArt.needBind = false;
                     bindTwitterArt.postId = '';
                     bindTwitterArt.isBindIng = false;

src/manifest.json

@@ -1,7 +1,7 @@
 {
     "manifest_version": 3,
     "name": "DeNet",
-    "description": "chrome extension",
+    "description": "Growing more twitter followers with Denet",
     "version": "1.0.2",
     "background": {
         "service_worker": "/js/background.js"

src/view/components/give-dialog.vue

@@ -290,6 +290,7 @@ import { payCalcFee, getPayConfig } from "@/http/pay";
 import { getFrontConfig } from "@/http/account";
 import {setChromeStorage, getChromeStorage} from "@/uilts/chromeExtension"
 import { throttle } from "@/uilts/help"
+import Report from "@/logcenter/log"
 import { ElMessage, ElLoading } from "element-plus";
 import "element-plus/es/components/message/style/css";
 
@@ -449,6 +450,10 @@ watch(
         console.log("watch", newVal);
         visible.value = newVal;
         if (newVal) {
+            Report.reportLog({
+                pageSource: Report.pageSource.publisherDialog,
+                businessType: Report.businessType.pageView,
+            });
             getLocalCurrencyInfoByCode();
             setTimeout(() => {
                 setDialogHeight();
@@ -490,6 +495,10 @@ const setDialogHeight = (resize = false) => {
 };
 
 const selectCurrencyPopHandle = () => {
+    Report.reportLog({
+        pageSource: Report.pageSource.currencySelectorPage,
+        businessType: Report.businessType.pageView,
+    });
     showCurrencyPop.value = true;
     nextTick(() => {
         if(currencyListDom.value) {
@@ -596,7 +605,7 @@ const messageBoxBlock = ({ title = "", content = "" }) => {
  */
 const messageBoxConfirm = () => {
     showMessageBox.value = false;
-    showComType.value = "topUp";
+    goTopUp();
 };
 
 /**
@@ -616,6 +625,10 @@ const messageBoxCancel = () => {
  * 去充值
  */
 const goTopUp = () => {
+    Report.reportLog({
+        pageSource: Report.pageSource.rechargePage,
+        businessType: Report.businessType.pageView,
+    });
     showComType.value = 'topUp';
 }
 
@@ -728,6 +741,10 @@ const submitRequest = async () => {
         if (res.code == 0) {
             publishRes = res.data;
             postId.value = res.data.postId;
+            Report.reportLog({
+                pageSource: Report.pageSource.previewPage,
+                businessType: Report.businessType.pageView,
+            });
             showComType.value = "preview";
             previewFontSize.value = calcFontSize(baseFormData.amountValue, 238, 56);
             isBack.value = false;

src/view/components/paypal-button.vue

@@ -30,11 +30,14 @@
             </div>
         </div>
         <div class="pay-btn">
-            <iframe
+            <div class="iframe-pay"
                 v-show="currentCurrencyInfo.currencyCode == 'USD'"
-                class="iframe-pay"
-                ref="iframe"
-                :src="`${payConfig.paypalHtml}?paypalClientId=${payConfig.paypalClientId}&amount=${props.finalAmountData.finalAmountValue}`"></iframe>
+                 @click="paypalPay">
+                <iframe
+                    class="iframe-pay"
+                    ref="iframe"
+                    :src="`${payConfig.paypalHtml}?paypalClientId=${payConfig.paypalClientId}&amount=${props.finalAmountData.finalAmountValue}`"></iframe>
+            </div>
             <div class="token-pay" 
                 v-if="currentCurrencyInfo.currencyCode != 'USD'"
                 @click="tokenPay">
@@ -48,6 +51,7 @@
 import { onMounted, ref, defineProps, defineEmits, watch } from "vue";
 
 import {payTaskLuckdropWithBalance} from "@/http/publishApi"
+import Report from "@/logcenter/log"
 
 const props = defineProps({
     finalAmountData: {
@@ -97,7 +101,24 @@ watch(
 
 const emits = defineEmits(["payPalFinsh"]);
 
-const tokenPay = () => {    
+const paypalPay = () => {
+    Report.reportLog({
+        pageSource: Report.pageSource.previewPage,
+        businessType: Report.businessType.buttonClick,
+        objectType: Report.objectType.confirmButton
+    }, {
+        type: 'paypal'
+    });  
+};
+
+const tokenPay = () => {  
+    Report.reportLog({
+        pageSource: Report.pageSource.previewPage,
+        businessType: Report.businessType.buttonClick,
+        objectType: Report.objectType.confirmButton
+    }, {
+        type: 'confirm'
+    });  
     if(payIng) {
         return;
     }
@@ -204,6 +225,11 @@ onMounted(() => {
             cursor: pointer;
         }
 
+        .iframe-pay {
+            width: 100%;
+            height: 100%;
+        }
+
         iframe {
             border: medium none;
             width: 100%;