分析現有的代碼設定

安裝新代碼前，請先評估網站或行動應用程式上現有的代碼 (如有)，以免新增多餘的代碼。本文說明如何評估現有代碼。

即使完成初步評估，您也應將定期檢查納入標準代碼管理程序。定期評估網站或應用程式上執行的代碼，對資料保護和安全性至關重要。

如要評估現有代碼，請使用下列資源：

• Google Tag Assistant
• Google 代碼管理工具功能
• 手動檢查程式碼的技巧

Tag Assistant

Google Tag Assistant 是代碼分析工具，可檢查 Google 代碼安裝情況。啟用後，Tag Assistant 會在瀏覽器中顯示偵錯窗格，方便您查看已觸發的 gtag.js 指令及其觸發順序。Tag Assistant 會顯示哪些資料將傳送至資料層，以及觸發這些資料交換作業的事件。也會顯示命中次數 (HTTP 要求) 和相關聯的參數。進一步瞭解 Tag Assistant。

代碼管理工具

您可以檢查代碼管理工具帳戶和容器，分析現有的代碼設定。代碼管理工具也提供預覽模式，功能與 Tag Assistant 類似。

搜尋

在代碼管理工具容器中使用搜尋列，找出代碼、設定，或代碼、觸發條件和變數中的程式碼行。搜尋列是找出可能含有需要重新評估的設定或程式碼標記的絕佳方式。

版本

代碼管理工具的「版本」功能會顯示現有容器設定的摘要。

1. 在代碼管理工具中，按一下「版本」。
2. 按一下清單中的最新版本，即可查看容器的目前狀態。

代碼管理工具會在該檢視畫面中列出代碼、觸發條件、變數和自訂範本。

預覽模式

代碼管理工具的預覽模式會顯示網頁上觸發的代碼、觸發這些代碼的事件，以及推送至資料層的資料。預覽模式的運作方式與 Tag Assistant 類似。進一步瞭解預覽模式。

手動檢查程式碼

如要更徹底地分析現有代碼設定，請考慮手動檢查程式碼。在原始碼中搜尋下列常見的代碼關鍵字，找出可能的代碼設定：

• gtag(：這是 gtag() 指令的開頭，這些程式碼片段通常包含額外的插碼。
• googletagmanager.com - 這個網域會載入代碼管理工具和 gtag.js 功能，協助您找出這類代碼。

如果您已使用 gtag.js 或 Google 代碼管理工具，或許可以更新現有代碼或插碼，不必導入新設定。

• dataLayer：可用於判斷是否已建立資料層程式碼，以及針對特定事件進行檢測的 dataLayer.push() 呼叫。
• analytics.js 或 ga.js：用於舊版 Google Analytics 導入作業的程式庫檔案名稱。
• conversion.js 或 conversion_async.js - 用於 Google Ads 轉換評估的程式庫檔案名稱。
• optimize.js：用於 Google 最佳化工具代碼。
• 可能包含 Google 代碼的第三方代碼管理系統。在原始碼中尋找可能的第三方代碼管理系統，例如 utag.js 或 _satellite。

gtag.js

如果您使用 gtag.js 將 Google 代碼程式碼片段新增至網頁，可以查看代碼，進一步瞭解代碼的用途。核心代碼如下所示：

  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=GA-XXXXXX-1"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());

    gtag('config', 'GA-XXXXXX-1');
  </script>

您可能會看到多行 gtag('config',...) 程式碼，這些代表的是其他產品和帳戶。例如：

  <!-- Google tag (gtag.js) -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=TAG_ID"></script>
  <script>
    window.dataLayer = window.dataLayer || [];
    function gtag(){dataLayer.push(arguments);}
    gtag('js', new Date());
    
    gtag('config', 'GA-XXXXXX-1');
    gtag('config', 'GA-YYYYYY-2');
    gtag('config', 'TAG_ID');
  </script>

每行 config 都包含產品前置字元 (表示要設定的產品)，後面接著要設定的帳戶 ID。進一步瞭解產品前置字元。

Google 代碼的產品前置碼

使用 Google 代碼設定的網頁可能會有前置字元為「G」或「AW」的 ID。前置字串「G」表示 Google 代碼最初是在 Google Analytics 中建立。前置字串「AW」表示 Google 代碼最初是在 Google AdWords 中建立。這兩個 ID 都是代碼 ID 的不同版本，可以互換使用，因此如果看到其中一個前置字元的 ID，就不需要新增另一個前置字元的 ID。進一步瞭解如何設定代碼 ID

Google 代碼管理工具

使用代碼管理工具設定的網頁會安裝容器代碼，類似於下列範例。您可以檢查容器程式碼，找出代碼管理工具容器 ID。容器 ID 開頭為「GTM-」。請參閱下列容器 ID 放置位置範例。

<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<:!-- End Google Tag Manager -->

取得容器 ID 後，請開啟 Google 代碼管理工具帳戶畫面，然後點選 search 搜尋這個 ID。接著，您可以檢查網站的 [代碼、觸發條件和變數設定]代碼設定。