## 讓你的聊天機器人也能看 <span style="color: orange">Google Analytics</span> ## &nbsp; ##### 簡報: `https://lihi1.com/PGYr0` --- ## Who am I? <table class="about-me"> <tr> <td><img src="https://www.gravatar.com/avatar/8d9b432d861e4ac0e40954a800ae90a1?s=2048" class="avatar"></td> <td> <ul> <li>戴均民</li> <li>現職 <span style="color: #e2231a">微程式資訊</span></li> <li>後端工程師</li> <li><a href="https://github.com/taichunmin/" target="_blank"><i class="fa fa-fw fa-github"></i>taichunmin</a></li> </ul> </td> </tr> </table> <style> img.avatar { border-radius: 50%; width: 300px; } </style> --- <table class="about-me"> <tr> <td><img src="https://i.imgur.com/VJac4FR.png" style="height: 600px"></td> <td> <h4>YouBike 小幫手</h4> <ul> <li>站點查詢</li> <li>行程規劃</li> <li>最愛場站</li> </ul> <img src="https://i.imgur.com/BCviB4l.png" style="height: 250px; display: block; max-height: none; max-width: none;"> </td> </tr> </table> --- ## 有件事要請大家配合 --- ## 小幫手的 GA 後台 ## 請大家<span style="color: orange">不要拍照錄影</span> --- # 緣起 --- ### 原本只是要在 LIFF 裡面埋 GA ## &nbsp; --- ### 原本只是要在 LIFF 裡面埋 GA ### 然後就去研究了 GA 的文件 ---  ---  --- ## 於是我就自己挖了一個坑 ## &nbsp; --- ## 於是我就自己挖了一個坑 ## 然後再自己把坑填掉 --- ## 小幫手 GA 後台展示 #### 請大家<span style="color: orange">不要拍照錄影</span> --- ## 後台展示 * 目標對象 > 總覽 * 目標對象 > 使用者多層檢視 * 行為 > 畫面 * 行為 > 行為流程 Note: * 我的 ID `80641b8d-e6d2-2a85-8060-8e4d5acdbdfa` --- ## Measurement API 介紹 --- # hit ## 用戶跟程式的互動資料 --- ## 使用 HTTP 協定就能傳送 hit --- ## 申請 Google Analytics --- ## 建立資源  ---  --- ### 建立資料檢視  --- ## Collect API  Note: * `https://www.google-analytics.com/collect` ``` z=1572869089464&aip=1&an=YouBike%20LINE%40&av=0.1.0&de=UTF-8&ds=app&tid=UA-XXXXX-Y&ul=zh-tw&v=1&cid=039423df-7421-16d5-ee31-878c9dfeb11b&uid=U039423df742116d5ee31878c9dfeb11b&t=screenview&cd=Nearby%20Station%3A%20Result&qt=10582 ``` --- ## hit 中的必填欄位  --- ## 匿名 Client ID (cid) 這個欄位必須是一個<span style="color: cyan">亂數 UUID v4</span> > <small style="color: gray">如果在請求中未指定 `uid` 欄位，則 `cid` 就是必填欄位。`cid` 可以匿名識別一個特定的用戶、裝置或瀏覽器。在 web 模式中，通常會把 `cid` 存在有兩年有效期限的第一方 Cookie 中。在 app 模式中，`cid` 應該要在安裝時隨機產生。這個欄位必須是一個亂數 UUID v4。</small> --- ## 匿名 Client ID (cid)  --- ## screenview hit  --- ## 實際送出的 screenview ```txt= z=1572869089464 &aip=1 &an=YouBike%20LINE%40 &av=0.1.0 &cd=Nearby%20Station%3A%20Result &cid=039423df-7421-16d5-ee31-878c9dfeb11b &de=UTF-8 &ds=app &t=screenview &tid=UA-XXXXX-Y &uid=U039423df742116d5ee31878c9dfeb11b &ul=zh-tw &v=1 ``` --- # GA 即時畫面 #### 請大家<span style="color: orange">不要拍照錄影</span> --- ## event hit  --- ## 實際送出的 event ```txt= z=1572869089467 &aip=1 &an=YouBike%20LINE%40 &av=0.1.0 &cid=039423df-7421-16d5-ee31-878c9dfeb11b &de=UTF-8 &ds=app &ea=Nearby%20Station%20Banner &ec=Ad%20Impression &el=%E6%81%B0%E8%BF%B7%E9%80%A2%E7%94%B220191022%E5%88%B020191030 &t=event &tid=UA-XXXXX-Y &uid=U039423df742116d5ee31878c9dfeb11b &ul=zh-tw &v=1 ``` --- # <span style="color: orange">CAVEAT</span> ### Event 必須在 Screenview 之後 ### 否則這些 Event 會被忽略 --- # GA 即時事件 #### 請大家<span style="color: orange">不要拍照錄影</span> --- ## 驗證 hit 正確性 * [hit 測試工具](https://ga-dev-tools.appspot.com/hit-builder/) * [常見的 hit 範例](https://developers.google.com/analytics/devguides/collection/protocol/v1/devguide#commonhits) * [hit 參數參考文件](https://developers.google.com/analytics/devguides/collection/protocol/v1/parameters) --- ### 用量限制 (單位: hit) * 1000 萬 / 月 / 追蹤 ID * 20 萬 / 天 / 用戶 * 500 / 工作階段 --- # GA 批次發送 --- # GA 批次發送限制 * 一次最多 20 個 hits * POST body 不大於 16 KB * 單一 hit 不大於 8 KB --- ## 累積 20 個 hits 再一起送出去 ```mermaid graph LR a(有 hit 需要送出)-->b[將 hit 存到 Redis 中] b-->c[取得 Redis 中的 hit 數量] c-->d{"hits >= 20 ?"} d-->|是|e[取出最多 20 個 hits] e-->f[計算 qt] f-->g[送出 hits] g-->c d-->|否|h(結束) ``` --- ## 定期把放太久的 hits 送出去 ```mermaid graph LR a(每分鐘的 cron job)-->b[取得 Redis 中的 hit 數量] b-->c{"hits >= 0 ?"} c-->|是|d[取出最多 20 個 hits] d-->e[計算 qt] e-->f[送出 hits] f-->b c-->|否|g(結束) ``` --- ## Queue Time (qt) 因為放在 Queue 中的 hit 不會被馬上送出 所以需要告知 hit 被放在 queue 中放了多久 --- ## Batch API ```http= POST /batch HTTP/1.1 Host: www.google-analytics.com z=1572869089464&aip=1&an=YouBike%20LINE%40&av=0.1.0&de=UTF-8&ds=app&tid=UA-XXXXX-Y&ul=zh-tw&v=1&cid=039423df-7421-16d5-ee31-878c9dfeb11b&uid=U039423df742116d5ee31878c9dfeb11b&t=screenview&cd=Nearby%20Station%3A%20Result&qt=10582 z=1572869089467&aip=1&an=YouBike%20LINE%40&av=0.1.0&de=UTF-8&ds=app&tid=UA-XXXXX-Y&ul=zh-tw&v=1&cid=039423df-7421-16d5-ee31-878c9dfeb11b&uid=U039423df742116d5ee31878c9dfeb11b&t=event&ec=Ad%20Impression&ea=Nearby%20Station%20Banner&el=%E6%81%B0%E8%BF%B7%E9%80%A2%E7%94%B220191022%E5%88%B020191030&qt=10579 ``` --- # GA 即時畫面 #### 請大家<span style="color: orange">不要拍照錄影</span> --- ## Q & A