Firebase Dynamic Links Analytics API 取得短網址分析資料

/

用 API 取資料有一個大坑

先寫這篇是個意外,照理說是要先寫怎麼使用 Firebase Dynamic Links 來產生短網址的,但 August 前兩天建了短網址,照文件中說,36 小時內收到的資料會有些事件收不到,而且看報表日期才出現到 2/14,建短網址的日期是 17 號啊,照這進度是不是要下周才看得到?

因為後台還看不到,昨晚想說會不會用 API 的方式就可以先看到了?就試著用 API 來取,結果就踩到了一個大坑,研究了一晚上才解決,因此想先完成本篇的筆記,以免之後忘記。


Analytics API – Node.js

在 Firebase 的說明文件中,有一頁就是專門寫怎麼用 Analytics API 來取得短網址的分析資料:Firebase Dynamic Links Analytics API

文件中也給了取得 token 的程式碼,必須用後端取得,範例中給了 Java、Node.js、Python 三種。

August 選擇了 Node.js,因為……跟後端相關的也只會這種。

這邊用簡單快速的方式,直接用本機來呼 Analytics API。

先進 Node.js 官網 下載並安裝。

安裝完後,開啟終端機,我們先來安裝 Nodemon,輸入指令:

npm install -g nodemon

如果安裝失敗,通常是要改用 Admin,改輸入:

這是廣告,點擊一下可以幫本站多個一點點的廣告收入,謝謝

sudo npm install -g nodemon

接著輸入密碼再按下 Enter 就行。

裝完 Nodemon,接下來就是新增一個資料夾,隨便取個名字,把資料夾拖拉到終端機後,終端機就會在這個資料夾的目錄底下打開,我們先初始化 Node.js,在終端機輸入:

npm init -y

就會快速產生一個 package-lock.json,接著輸入:

npm install

就會安裝 Node.js 的檔案。

都裝完以後,就可以看著 Firebase 的說明文件來準備程式碼的部份。

安裝 Google API、fetch

繼續在終端機輸入:

npm install googleapis

安裝了 Google API,因為取得 token 後必須 GET 到指定的 URL 才可以取回資料,因此要再安裝 fetch,終端機輸入:

npm install node-fetch --save

這樣取 token、用 fetch 來 GET 的套件就安裝完了。

取得 Firebase 私密金鑰

要用 API 取得 Dynamic Links 的資料,還需要 Firebase 的金鑰。

這是廣告,點擊一下可以幫本站多個一點點的廣告收入,謝謝

進到生成 Dynamic Links 的 Firebase 專案後,點選左側選單的齒輪,再點專案設定:

點選齒輪、專案設定
點選齒輪、專案設定

接著右側會換成設定頁,點選「服務帳戶」,會看見 Firebase Admin SDK 的頁籤,點說明內文中的「建立服務帳戶」:

點建立服務帳戶
點建立服務帳戶

等 Firebase 轉個圈圈,轉完後會看見右邊內文的部份變了,會有一個如何引用金鑰的說明檔:

如何引用金鑰的說明
如何引用金鑰的說明

上圖的 1,是等等寫程式要取得分析資料時會用的,到時那個引用的路徑要改成我們等等下載到的檔案。

上圖的 2「產生新的私密金鑰」就是要下載的檔案,點選了以後就會下載金鑰。

因為金鑰很重要,就很像你家鑰匙一樣,誰有了誰都可以進來,因此 Firebase 會提醒你不要隨便給別人:

金鑰不要亂給
金鑰不要亂給

按下「產生金鑰」,就順利下載了。

金鑰會是一個 JSON 檔,我們就放進我們剛剛新建的資料夾,準備開始寫程式來取得 Dynamic Links 的分析資料。

程式碼部份

基本上,如果不太會寫 Node.js 沒關係,因為 Firebase 的文件都寫好了。

先在我們剛剛新增的資料夾中,另存一個 index.js 的檔案,然後貼上以下程式碼:

上面這段程式碼是文件中給的範例,JSON 的路徑檔記得要替換檔名。

接著就來執行這個 JS 檔來看能不能順利取得 token,在終端機輸入:

nodemon index.js

就會看見成功的 log 出取到的 token:

成功的取得token(點擊看原圖)
成功的取得 token(點擊看原圖)

有了 token 以後,照文件中寫的,下一步就是要 GET 一個指定的 URL,附上 token,就可以取得分析資料了。

指定的連結長這樣:

https://firebasedynamiclinks.googleapis.com/v1/SHORT_DYNAMIC_LINK/linkStats?durationDays=DURATION

SHORT_DYNAMIC_LINK,就是從 Firebase 生成的短網址,要注意的是網址要改成 encode 過的,比方 August 要看的分析資料是「https://letswrite.page.link/analytictest」這個網址,那 URL 就要寫成:

https://firebasedynamiclinks.googleapis.com/v1/https%3A%2F%2Fletswrite.page.link%2Fanalytictest/linkStats?durationDays=7

如果不知道怎麼 encode 沒關係,網路上有生成器,像這個:URL Decoder/Encoder,貼上網址後按下 encode 就行。

DURATION,寫一個數字,代表要取得幾天內的資料。想取得 7 天就寫 7,30 天就寫 30,文件中有特別說明,36 小時內有些事件可能會記錄不到。

Note that some events logged in the last 36 hours might not be included.

…蛤?36 小時?如果想要今天放短網址,隔天就要看成效資料,企劃會瘋掉。

有了URL後,接著就是再帶上前面一段取得的token來執行GET,上面那段程式碼,加上GET的部份,完整的程式碼是這樣:

按照文件上的說明,GET 後就會收到分析的資料,但,實際上會得到的是一個坑,會看到這個訊息:

{
  error: {
    code: 403,
    message: 'The caller does not have permission',
    status: 'PERMISSION_DENIED'
  }
}

解決這個訊息,就是本篇筆記的重點。


403 The caller does not have permission 的解決方法

坦白說,一開始看到這個錯誤訊息,都傻了,因為文件裡面沒寫到這段,又想到 Firebase 有一個 Authentication 的登入功能,不會還要寫好一套,確實做登入後才取得到資料吧?

好險,這世界有個偉大的發明叫 Google,工程師們也有一個偉大的宇宙叫 Stack Overflow。

基本上這個錯誤讓許多人傻了眼,Stack Overflow 跟 GitHub issue 上蠻多人在發問跟哀嚎的,後來找到了這篇才有了解決辦法:The caller does not have permission [403] when calling Dynamic Links Analytics API

解決辦法很簡單,不用寫程式就可以解決。

首先,打開我們從 Firebase 上下載到的金鑰 JSON,裡面會有一個「client_email」,把這個的值記下來。

接著,進到 GCP 上的 IAM & admin,確認好開啟的是 Firebase上 建的專案後,會看到一張列表,列有這個專案的所有授權,其中有一個,就會是上面那句「client_email」的值,像這樣:

IAM & admin 中找到 client_email(點擊看原圖)
IAM & admin 中找到 client_email(點擊看原圖)

Role 上也會標記 Firebase Admin SDK Administrator Service Agent。

接著點選那一行最右邊的鉛筆 icon,會開啟這個金鑰具有的權限:

這個金鑰具有的權限
這個金鑰具有的權限

我們點擊「+ ADD ANOTHER ROLE」來新增權限進去,點了以後會出現一個小視窗,列出了所有可以增加的權限。我們不用一個一個找,直接輸入「Firebase Grow Viewer」來搜尋:

輸入「Firebase Grow Viewer」來搜尋
輸入「Firebase Grow Viewer」來搜尋

只會出現一筆結果:

結果中出現 Firebase Grow Viewer
結果中出現 Firebase Grow Viewer

點擊 Firebase Grow Viewer,會看見 Role 的欄位新增了:

Role的欄位新增Firebase Grow Viewer
Role 的欄位新增 Firebase Grow Viewer

最後按下確定,就大功告成了。

我們再試著發一次 GET,就可以成功看到回傳結果:

成功看到回傳結果
成功看到回傳結果

如果還是沒看到的朋友,就請再等一下,過幾分鐘後再試就行。


筆記後心得

Firebase Dynamic Links 是以前 Google 縮網址結束營運後的新一種方案,加密性比以前強,也可以設置自訂網域的縮網址。

但,關於統計資料這點還有待加強,36 小時後才能有完整資料是真的不行,許多短網址服務幾乎都是立馬就可以看到點擊數等分析資料。

等建立 Firebase Dynamic Links 確實研究完成後,再來補其它篇的筆記。

Summary
Firebase Dynamic Links Analytics API 取得短網址分析資料
Article Name
Firebase Dynamic Links Analytics API 取得短網址分析資料
Description
本篇大綱:用 API 取資料有一個大坑。Analytics API – Node.js。安裝 Google API、fetch。取得 Firebase 私密金鑰。程式碼部份。403 The caller does not have permission 的解決方法。筆記後心得。
Augustus
Let's Write
Let's Write
https://letswrite.tw/wp-content/uploads/2020/08/logo_512.jpg

隨選筆記文

Front-End

OSM + Leaflet 學習筆記2:移動中心點、抓目前地點

Bot Slack

Slack 通知功能 純靜態

Forms Google

Google 表單,提交後系統自動寄送回覆通知 email

Google Others

用 Google Cloud Platform / GCP 建 Node.js 網站

Bot LINE

用 LINE Push Messaging API 推播每日氣象預報

API

Imgur API:upload, load 上傳、讀取 心得筆記

API Front-End

用 Google Apps Script 寫一個 LINE 登入功能:上篇 – 前置作業

PWA

PWA學習筆記-6:實際使用整體流程範例

WordPress

WordPress:埋 Google AdSense 廣告

Front-End

TestCafe 學習筆記 – 1:自動化測試會員登入

以下是留言,但關於留言的部份必需先讓你們知道:

本站的文章都是 August 因為覺得有趣,才會實作並整理成筆記文而後進行發表。

如果留言是希望把 Demo 改成「你想要」的樣子,或是把功能改成「符合你需求」的樣子,

Sorry~ 除非那修改是 August 也有興趣的,不然不會幫你們寫程式去面對工作或是交作業。

未來這類的留言不會再主動回覆。😎

另外,公開信箱是為了讓金流驗證用,

因為之前遇過幾次回信協助解決問題後,對方卻一聲謝謝也沒有,就這樣拿去幫工作交差。

因此決定不再回覆信件,有疑問就利用留言功能囉。