數據追蹤的準確性決定了行銷決策的品質。當 GA4 事件沒有正確觸發、轉換數據出現異常、或者電商追蹤遺漏關鍵參數時,你需要的是能即時檢視資料傳輸狀態的工具。Google Analytics Debugger Chrome 擴充功能正是為此而生——它將 GA4 的除錯版本載入瀏覽器,讓每一筆傳送到 Google Analytics 的資料都清晰可見。

本文將帶你從安裝設定開始,一路深入到進階除錯技巧,讓你能獨立診斷並修復常見的追蹤問題。


什麼是 Google Analytics Debugger?

Google Analytics Debugger 是由 Google 官方發布的免費 Chrome 瀏覽器擴充功能。啟用後,它會載入 Google Analytics 的除錯版 JavaScript,並在瀏覽器的開發者工具 Console 面板中輸出詳細的追蹤資訊。

這款工具的核心價值在於三個面向:

功能面向 實際效益
即時資料檢視 每次頁面載入或事件觸發時,立即顯示傳送的資料內容
錯誤診斷 追蹤代碼設定錯誤時,會顯示紅色警告訊息
參數驗證 逐一列出每筆 beacon 的所有參數,確認資料完整性

從實務經驗來看,這款擴充功能特別適合在網站上線前的 QA 階段使用。我曾經協助一個電商客戶排查為何購買轉換數據總是少算約 15%,最後透過 Debugger 發現是結帳完成頁的 GA4 事件在特定瀏覽器版本下沒有正確觸發。沒有這個工具,單純看報表數字根本找不出問題根源。


安裝與基本設定

第一步:安裝擴充功能

  1. 開啟 Chrome 瀏覽器,前往 Chrome Web Store
  2. 搜尋「Google Analytics Debugger」,選擇由 Google 發布的官方版本
  3. 點擊「加到 Chrome」按鈕
  4. 在彈出的權限確認視窗中點擊「新增擴充功能」

安裝完成後,瀏覽器網址列右側會出現一個像是放大鏡疊在報表上的圖示。

第二步:啟用除錯模式

擴充功能預設為關閉狀態。點擊圖示一次即可啟用,圖示上會顯示「ON」的標記。再次點擊則關閉。

這裡有個容易被忽略的細節:啟用後必須重新整理頁面,除錯資訊才會開始輸出。許多人第一次使用時看不到任何資料,通常就是漏了這一步。

第三步:開啟開發者工具

除錯資訊會輸出到 Console 面板,開啟方式如下:

作業系統 快捷鍵
Windows / Linux Control + Shift + J
macOS Command + Option + J

也可以在頁面上按右鍵,選擇「檢查」,然後切換到「Console」分頁。


Console 輸出內容解讀

啟用擴充功能並重新整理頁面後,Console 會開始顯示綠色調的詳細文字記錄。以下是你會看到的主要資訊類型:

頁面瀏覽事件(Page View)

Initializing Google Analytics.
Creating new tracker: G-XXXXXXXXXX
Sending pageview: /products/item-123

這段記錄確認了 GA4 追蹤代碼已正確初始化,並成功發送頁面瀏覽事件。注意核對 Measurement ID(以 G- 開頭)是否與你的 GA4 資源一致。

事件追蹤(Event Tracking)

當使用者執行特定動作(如點擊按鈕、提交表單)時,會看到類似以下的記錄:

Sending event:
  event_name: add_to_cart
  item_id: SKU-12345
  item_name: 無線藍牙耳機
  price: 2490
  currency: TWD

這裡可以逐一檢查每個參數是否正確傳遞。電商網站最常見的問題是 price 值傳送了字串而非數字,或是 currency 參數遺漏導致營收計算錯誤。

錯誤警告

當追蹤設定有問題時,Console 會顯示紅色警告文字:

Error: The _setAccount API expects an account string for argument 0. 
The argument given (36141341-1) does not match the expected format of UA-XXXXXX-X.

上述錯誤表示 Measurement ID 格式錯誤。GA4 應使用 G-XXXXXXXX 格式,若誤用舊版 Universal Analytics 的 UA- 格式就會出現此警告。


搭配 GA4 DebugView 使用

Google Analytics Debugger 擴充功能有個重要的附加功能:它會自動在每筆傳送的事件中加入 _dbg 參數。這個參數會讓你的瀏覽器資料被隔離到 GA4 後台的 DebugView 報表中。

什麼是 DebugView?

DebugView 是 GA4 內建的即時除錯介面,位於 GA4 後台的「管理」→「DebugView」。它提供了比 Console 更視覺化的資料呈現方式:

  • 秒級時間軸:顯示過去 60 秒內觸發的所有事件
  • 分鐘級彙總:過去 30 分鐘的事件歷史,可點擊查看細節
  • 參數檢視:點擊任何事件即可展開查看所有關聯參數
  • 使用者屬性:追蹤 User Properties 的變化

實際操作流程

  1. 啟用 Chrome 擴充功能
  2. 開啟 GA4 後台,導航至「管理」→「DebugView」
  3. 在目標網站上執行測試動作
  4. 切換回 GA4 後台,觀察事件是否即時出現

如果同時有多人在進行除錯測試,DebugView 左上角的裝置選擇器可以讓你切換到自己的裝置。每個開啟擴充功能的瀏覽器都會被識別為獨立裝置。

這裡有個實務上的注意事項:DebugView 中顯示的資料不會被計入正式報表。這個設計是刻意的,確保測試過程不會汙染生產環境的數據。但也因此,完成測試後記得關閉擴充功能,避免持續將自己的瀏覽行為排除在外。


三種啟用 Debug Mode 的方法比較

除了使用 Chrome 擴充功能外,還有另外兩種方式可以啟用 GA4 的 Debug Mode:

方法 適用情境 設定複雜度
Chrome 擴充功能 快速測試、無需修改程式碼
GTM Preview Mode 已使用 Google Tag Manager 的網站
手動加入 debug_mode 參數 需要在特定環境永久啟用

GTM Preview Mode

如果你的網站是透過 Google Tag Manager 部署 GA4,進入 GTM 的預覽模式時會自動啟用 Debug Mode。這個方法的優點是可以同時除錯 GTM 標籤觸發邏輯和 GA4 事件傳送。

手動加入 debug_mode 參數

在 gtag 設定中加入以下參數:

gtag('config', 'G-XXXXXXXX', { 'debug_mode': true });

這個方法通常用於開發或測試環境,讓整個環境的所有使用者都啟用 Debug Mode。務必確保這段設定不會被部署到正式環境。


常見追蹤問題診斷

問題一:DebugView 沒有顯示任何資料

可能原因與解決方案:

  1. 擴充功能未啟用或未重新整理頁面:確認圖示顯示「ON」並重新載入頁面
  2. 廣告阻擋器攔截:uBlock Origin 等擴充功能可能阻擋 GA4 請求,暫時停用後測試
  3. GA4 資料篩選器設定:在 GA4 後台檢查「管理」→「資料設定」→「資料篩選器」,確認內部流量篩選器設為「測試中」而非「啟用」
  4. Consent Mode 阻擋:如果網站有實作 Cookie 同意機制,未同意時可能完全阻止追蹤

問題二:事件有觸發但參數不完整

這通常是 dataLayer 推送的資料結構有問題。使用 Console 的 Filter 功能,輸入你的 Measurement ID 過濾其他訊息,然後逐一檢查每個參數值。

電商追蹤最常見的問題包括:

  • items 陣列格式錯誤
  • 數值型參數(如 price、quantity)被當作字串傳送
  • 必要參數遺漏(如 currency)

問題三:多個裝置出現在 DebugView

當團隊多人同時測試,或者你不小心在正式環境發布了 debug_mode: true 設定時,DebugView 會顯示多個裝置。使用裝置選擇器切換到自己的裝置,或立即移除正式環境的 debug_mode 設定。


進階除錯工具推薦

Google Analytics Debugger 擴充功能提供了基礎的除錯能力,但在處理複雜的追蹤架構時,你可能需要更專業的工具。以下是幾款值得考慮的替代方案:

Analytics Debugger(by David Vallejo)

這款第三方擴充功能提供了更視覺化的介面,支援 GA4、GTM、Tealium、Adobe Analytics 等多種平台。它的電商報表功能特別實用,能以表格形式呈現所有產品參數,省去手動解析 payload 的時間。

Tag Assistant(by Google)

除了驗證標籤是否正確觸發外,Tag Assistant 還能錄製完整的使用者流程,事後分析每個步驟傳送了哪些資料。這對於排查多頁面轉換漏斗的問題特別有幫助。

瀏覽器開發者工具 Network 面板

最直接的方式是在 Network 面板中篩選「collect」關鍵字,直接查看傳送到 google-analytics.com 的 HTTP 請求。成功的請求會顯示 200 狀態碼。這個方法不需要安裝任何擴充功能,但需要對 GA4 Measurement Protocol 的參數格式有基本理解。


結語:建立系統化的除錯流程

追蹤除錯不應該是出問題才做的事,而應該納入標準的品質控管流程。以下是我建議的除錯工作流程:

  1. 開發階段:使用 debug_mode 參數在測試環境永久啟用
  2. 上線前 QA:使用 Chrome 擴充功能逐一驗證每個追蹤點
  3. 上線後監控:定期比對 DebugView 與正式報表的數據一致性
  4. 問題排查:結合 Console 記錄、Network 請求和 DebugView 三方資料交叉驗證

養成這個習慣後,你會發現追蹤數據的品質顯著提升,而行銷團隊做出的決策也會因為有可靠的數據支撐而更加精準。


引用來源


關於作者

Tenten.co 數位策略團隊

Tenten 專注於協助企業建立數據驅動的行銷策略。從追蹤架構設計UTM 參數規劃轉換優化,我們提供完整的數據行銷顧問服務。

如果你正在規劃網站的追蹤架構,或是遇到數據異常需要專業診斷,歡迎預約諮詢,讓我們協助你建立可信賴的數據基礎。