1.安裝firebase
npm i --save firebase
2.添加項目在firebase
https://console.firebase.google.com/
3.在main.js中配置firebase
firebase項目的配置信息
main.js中:
import firebase from "@firebase/app";
import "@firebase/firestore";
import "@firebase/analytics";
const firebaseConfig = {
apiKey: "AIzaSyDFTrBvYPsuDZopXYnM3yRSJJoJvBtkgbo",
authDomain: "earth-angel-pc.firebaseapp.com",
projectId: "earth-angel-pc",
storageBucket: "earth-angel-pc.appspot.com",
messagingSenderId: "989647602026",
appId: "1:989647602026:web:b187be8e42e586d12fa513",
measurementId: "G-2L079Q8PQG"
};
// alias (配置別名方便使用)
Vue.prototype.$analytics = firebase.analytics();
我安裝的時候:firebase版本
"dependencies": {
"axios": "^0.21.1",
"core-js": "^3.6.5",
"firebase": "^8.5.0",
"vue": "^2.6.11",
"vue-i18n": "^8.24.3",
"vue-router": "^3.2.0"
},
4.組件中使用監(jiān)聽用戶行為
this.$analytics.logEvent("toList",{name: 'Details_photo'});
5.chrome安裝插件Google Analytics Debugger
安裝Google Analytics Debugger插件并打開開關,然后去到firebase控制臺
點擊DebugView欄目式撼,同時刷新自己的項目頁面检眯,然后在DebugView欄目選擇自己的設備:
選擇自己的設備王财,成功后去項目觸發(fā)自己綁定的事件就會發(fā)送數(shù)據(jù)到debugview滴劲,紅框可以看到
有紅框的tool就成功了
整個思路就是這樣簡單。