啟用了 Tag Assistant 除錯模式的網站將顯示在單獨的瀏覽器視窗中，以便開發人員檢查哪些 Google 程式碼已觸發以及觸發順序。 Tag Assistant 除錯模式顯示哪些資料正在傳遞到資料層，以及哪些事件觸發了這些資料交換。

新建一個除錯會話的方法：

1. 開啟 Tag Assistant Activation Page：

https://tagassistant.google.com/

點選 Add domain，可以新建一個除錯 session, 下圖我已經建立好一個會話了：

![](https://img-blog.csdnimg.cn/img_convert/157cf996af4da1cc0c07443552d9348a.png)

某些站點或頁面可能因為被新增到 URL 的附加除錯引數而無法正常工作。
比如 Spartacus 的 base site 檢測邏輯，就依賴於 localhost:4200 後面的片段，透過正規表示式匹配合適的 base site 資訊。

如果是這樣，我們可以取消選中“在 URL 中包含除錯訊號”框。

![](https://img-blog.csdnimg.cn/img_convert/71d7703a133c4bdeae1441c819edad43.png)

![](https://img-blog.csdnimg.cn/img_convert/86fc3fa5f613de62f3a1b8b75c573c32.png)

要恢復活動或關閉的除錯會話，請在 Tag Assistant 主頁的“活動域”或“歷史記錄”中單擊域名。

啟用後，將為您輸入的頁面啟動一個新視窗，並在現有 Tag Assistant 瀏覽器視窗中開啟除錯 UI。

如下圖所示，新開啟的 localhost:4200

![](https://img-blog.csdnimg.cn/img_convert/943fc6352050008f632412ceba18f60d.png)

Tag Assistant 視窗中的除錯 UI 顯示有關您的 gtag() 命令和命中的詳細資訊，包括程式碼如何觸發以及正在處理哪些資料。

下面是一些例子：

![](https://img-blog.csdnimg.cn/img_convert/dcd1464618957084e97cb17c90234684.png)

您的常規網站訪問者看不到除錯資訊。 當您在同一域中導航並且頁面上有全域性站點標記時，除錯視窗將保持開啟並顯示除錯資訊。

當您點選您的網站時，除錯視窗將更新有關如何觸發您的程式碼的資訊。 您可以使用此資訊檢視程式碼是否成功觸發、觸發（或未觸發）其觸發狀態的原因以及觸發程式碼後發出的網路請求。

![](https://img-blog.csdnimg.cn/img_convert/10881a907f93c503454c7656a69eb143.png)

預設摘要檢視顯示所請求頁面的事件和標籤資訊的概覽。螢幕左側顯示事件列表。 “輸出”部分將為針對所選 ID 檢測到的每個命中顯示一張卡片。

![](https://img-blog.csdnimg.cn/img_convert/43213bf3c4a2bce1a4eae4e8b6eb9c84.png)

![](https://img-blog.csdnimg.cn/img_convert/29c21756977f78ed09b05c5acc03f40d.png)

事件按發生的頁面分組。 單擊左側導航欄中的頁面標題可檢視頁面級摘要。 當使用者導航到該頁面上具有全域性站點標記的站點中的另一個頁面時，新頁面組將新增到列表頂部。

事件按照它們被觸發的順序出現並相應編號。 標有 `<>` 圖示的事件是在載入全域性站點程式碼時自動發出的內建觸發器。單擊左欄中的事件以檢視更多詳細資訊。

API 呼叫顯示了用於為所選事件配置資料的 JavaScript，這或者是 gtag() 呼叫或者是 datalayer.push() 呼叫。

比如我在除錯模式下，點選了 Login 按鈕之後：

![](https://img-blog.csdnimg.cn/img_convert/f5315bca13d7daed56109e9df56689ec.png)

我能夠看到這個 login 頁面導航事件在 GTM dashboard 上的顯示：

![](https://img-blog.csdnimg.cn/img_convert/78a0599c8594201b0677a562613a7af2.png)

相關的變數：
![](https://img-blog.csdnimg.cn/img_convert/e7a6c6c2b34d940c45ea4cec3278a00f.png)

使用 Tag Assistant 除錯 SAP 電商雲 Spartacus UI 的 TMS 模組

相關文章