為廣告客戶設定 Google 代碼存取介面

本文適用於想部署廣告主專用 Google 代碼閘道的使用者。建議使用廣告主專用 Google 代碼閘道，確保代碼設定最為穩定。

總覽

廣告主專用 Google 代碼閘道可讓您使用自己的第一方基礎架構 (託管在網站網域上) 部署 Google 代碼。這項基礎架構位於您的網站和 Google 服務之間。這份文件中的設定有助於您更準確地評估網站。您可以使用現有的內容傳遞網路 (CDN)、負載平衡器或網路伺服器進行設定。

在標準 Google 代碼設定中，網頁會向 Google 網域要求 Google 代碼。代碼觸發時，會直接將評估要求傳送至 Google 產品。啟用廣告主專用 Google 代碼閘道後，網站會從第一方網域載入 Google 代碼。代碼觸發時，系統會使用您的第一方網域，將部分評估要求傳送至 Google。

這張圖表顯示廣告主專用 Google 代碼閘道的資訊流：

事前準備

本指南假設您的網站已設定下列項目：

• Google 代碼或 代碼管理工具容器。
• 可將要求轉送至外部端點的內容傳遞網路 (CDN) 或負載平衡器。

如要開始使用，請選擇設定類型。

自助式服務 使用者介面內

1. 選擇評估路徑

網站網域需要預留不重複的評估路徑，用來傳送每個代碼或 Google 代碼管理工具容器。

評估路徑規定：

• 路徑不得為網域中已使用的路徑。
• 每個路徑都不得為根路徑「/」。
• 每個路徑不得超過 100 個半形字元。

Google 代碼管理工具：

如果您使用 Google 代碼管理工具，只需要提供容器 ID (例如 GTM-XXXXXX)。只要設定一次，即可為已加入該容器的所有代碼 (例如 Google Analytics、Google Ads 等) 啟用這項功能。

每個不重複的容器或獨立代碼都需要專屬的傳送路徑和對應 ID。

如要設定廣告主專用 Google 代碼閘道，請選擇網站中未使用的路徑。為降低與網站既有路徑衝突的可能性，您可以選擇任何字母和數字的組合，或使用 /gtm、/metrics、/analytics 等字詞，讓路徑更易於辨識。

例如：

用途	ID	代碼提供路徑	原始端點
獨立式標籤 1	G-12345	/abjfo/	g-12345.fps.goog
Standalone Tag 2	G-67890	/fjdso/	g-67890.fps.goog
GTM 容器	GTM-ABCDEF	/cvfjk/	gtm-abcdef.fps.goog

填入下列資訊，即可在本文中填入範例。

Your domain: example.com
Google tag ID: G-12345
Tag serving path: /metrics

注意： 這項設定會透過所選路徑重新導向所有流量。為避免影響網站，請選擇網站未使用的路徑。

有多組代碼/多個容器時的處理方式：

如果代碼都在同一個 GTM 容器，就不需要重複設定。只要加入單一 Google 代碼管理工具容器，系統就會處理其中的所有代碼。

如果代碼分別位於不同 GTM 容器，或是並未連結 GTM，請務必為各項執行個體分別完成這項設定。這個做法適用於下列情境：

• 執行多個獨立的 Google 代碼管理工具容器。
• 不在容器中的個別代碼 (例如 G-XXXXXX)。

進行這項操作時，請務必為各個容器或代碼分別指派不重複的代碼傳送路徑。

2. 轉送流量

本節假設網站已採用可按路徑轉送流量的 CDN 或負載平衡器。

Google Cloud

您需要設定新的後端，查詢網站訪客的大約地理位置，並在現有的外部應用程式負載平衡器中建立轉送規則。

建立新的後端

1. 開啟 GCP 負載平衡器

2. 在負載平衡器中，開啟「後端設定」部分。 建立新的後端服務。

3. 使用地理位置資訊設定新的後端服務：

   • 指定名稱，例如 measurement-be-svc。
   • 將「後端類型」設為「網際網路端點群組」。
   • 將「通訊協定」設為「HTTPS」，並將「逾時」保留為預先填入的值。
   • 在「後端」下方，按一下「網際網路端點群組」下拉式選單，然後建立新的網際網路端點群組：
     • 將「網路端點群組類型」設為「網際網路 NEG (全域、區域性)」。
     • 將「範圍」設為「全域」。
     • 將「新增管道：」設為「完整網域名稱與通訊埠」。
     • 將「完整網域名稱」設為 G-12345.fps.goog。
     • 按一下「建立」，建立端點。
     • 關閉「網路端點群組」分頁，返回「新增後端服務」分頁。
   • 搜尋並選取新的網路端點群組名稱。
   • 開啟「進階設定」部分。新增下列自訂要求標頭。

     標頭名稱	標頭值
     Host	G-12345.fps.goog
     X-Forwarded-CountryRegion	{client_region_subdivision}
     X-Forwarded-Geolocation	latlong={client_city_lat_long};city={client_city}

   • 檢查其他設定。這項整合功能不需要 Cloud CDN 或 Cloud Armor，因此您可以放心停用這兩項服務。
   • 儲存新的後端服務。

設定轉送規則

1. 在負載平衡器中，開啟「轉送規則」部分。

2. 新增下列主機與路徑規則：

   主機	路徑	後端
   *	/metrics/*	measurement-be-svc

3. 更新負載平衡器設定。

4. 在瀏覽器中前往 https://example.com/metrics/healthy，確認設定是否正確。頁面應顯示文字「ok」。如要確認是否已加入地理資訊，請前往 https://example.com/metrics/?validate_geo=healthy。頁面應顯示文字「ok」。

Cloudflare

如要使用廣告主專用 Google 代碼閘道放送代碼，可以透過 Cloudflare Snippets 轉送要求。

注意： Cloudflare Snippets 正式支援 Cloudflare Pro 方案和更高等級的方案。

建立程式碼片段

1. 在 Cloudflare 資訊主頁中，依序前往「帳戶首頁」 >example.com >「規則」 >「程式碼片段」。
2. 按一下「建立程式碼片段」。
3. 輸入程式碼片段名稱，其中包含您的代碼 ID (例如 google_tag_gateway_gtm_1234)。名稱只能包含小寫字母、數字和底線，因此請將代碼 ID 中的任何連字號 (-) 替換為底線 (_)。
4. 將 G-12345 預留位置替換為您的 Google 代碼 ID。

5. 將提供的程式碼片段貼到編輯器中：

   export default {
     async fetch(request) {
       const newRequest = new Request(request);
       const url = new URL(request.url);
       url.hostname = 'fps.goog';
       newRequest.headers.set('X-Gtg-Implementation', 'Snippet');
       newRequest.headers.set('X-Gtg-Tag-Id', 'G-12345');
       newRequest.headers.append('X-Forwarded-For', request.headers.get('CF-Connecting-IP'));
       newRequest.headers.set('X-Forwarded-Country', request.cf.country);
       newRequest.headers.set('X-Forwarded-Region', request.cf.regionCode);
       newRequest.headers.set(
         'X-Forwarded-Geolocation',
         `latlong=${request.cf.latitude},${request.cf.longitude};` +
           `city=${request.cf.city}`,
       );
       return await fetch(url, newRequest);
     },
   };
   

6. 按一下「程式碼片段規則」，前往設定頁面。

設定程式碼片段規則

1. 在程式碼片段的規則頁面中，選取「自訂篩選運算式」。
2. 按一下「編輯運算式」，然後貼上下列內容： (starts_with(http.request.uri.path, "/metrics/"))
3. 按一下「完成」即可儲存程式碼片段規則。
4. 按一下「部署」即可啟用程式碼片段。
5. 在瀏覽器中前往 https://example.com/metrics/healthy，確認設定是否正確。頁面應顯示文字「ok」。如要確認是否已加入地理資訊，請前往 https://example.com/metrics/?validate_geo=healthy。頁面應顯示文字「ok」。

Akamai

如要在廣告主專用 Google 代碼閘道中放送代碼，您需要在資源中新增規則，轉送要求並新增地理位置資訊。

建立重新導向規則

1. 在 Property Manager 中建立新的放送設定版本
2. 在「資源配置設定」部分下方，新增 Rule
   • 輸入名稱，例如 Route measurement
3. 新增 Match
   • 將比對下拉式選單設為「Path」和「is one of」
   • 將比對值設為 /metrics/*
4. 新增「行為」
   • 選取「Standard Property Behavior」，然後選擇「Origin Server」行為
   • 將「Origin Server Hostname」設為 G-12345.fps.goog
   • 將「Forward Host Header」設為「Origin Hostname」
5. 儲存新規則並部署變更
   • 請務必先在測試環境中測試新的重新導向規則，再推出至正式環境
   • 提示：請確認您沒有任何規則會修改或移除外送回應標頭。如果缺少 Content-Type 回應標頭，可能會導致 Google 指令碼失敗。

納入地理位置資訊

1. 在「Property Configuration Settings」下方選擇「Redirect rule」 (在上述步驟建立)

2. 新增「行為」

   • 選取「Standard Property Behavior」，然後選擇「Content Targeting (EdgeScape)」行為
   • 將「啟用」設為 true

3. 儲存新行為並部署變更。

   • 請務必先在測試環境中測試新的重新導向規則，再推出至正式環境

4. 在瀏覽器中前往 https://example.com/metrics/healthy，確認設定是否正確。頁面應顯示文字「ok」。如要確認是否已加入地理資訊，請前往 https://example.com/metrics/?validate_geo=healthy。頁面應顯示文字「ok」。

Amazon CloudFront

如要在廣告主專用 Google 代碼閘道中放送代碼，您需要設定發布行為，轉送要求並新增地理位置資訊。

新增 Origin

1. 前往 Amazon Web Services (AWS) 中的 CloudFront 頁面
2. 選擇所需的 CloudFront Distribution
3. 在「Origins」分頁中，使用下列設定建立來源：
   • 將「Origin domain」設為 G-12345.fps.goog
   • 將「Protocol」(通訊協定) 設為「HTTPS Only」(僅限 HTTPS)

建立重新導向行為

1. 前往 AWS 的 CloudFront 頁面
2. 選擇所需的 CloudFront Distribution
3. 在「Behaviors」分頁中，使用下列設定建立新的「Behavior」：
   • 將「Path pattern」設為 /metrics/*
   • 將「來源和來源群組」設為 G-12345.fps.goog
   • 將「Compress objects automatically」設為「No」
   • 將「Viewer protocol policy」設為「HTTPS only」
   • 將「Allowed HTTP Methods」設為「GET, HEAD, OPTIONS, PUT, POST, PATCH, DELETE」
   • 在「快取鍵和來源要求」下方，選擇「快取政策和來源要求政策」
     • 將「快取政策」設為「CachingDisabled」
     • 將「Origin request policy」設為「AllViewerExceptHostHeader」
4. 在「行為」清單中，確認新行為的 Precedence 高於所有其他行為
   • 如要變更 Precedence，請選取所需行為，然後選取「Move up」按鈕，直到該行為高於所有其他行為為止。
5. 在瀏覽器中前往 https://example.com/metrics/healthy，確認設定是否正確。頁面應顯示「ok」。

納入地理位置資訊

1. 如要轉送必要的地理位置資訊，請在重新導向行為中將「Headers」設為「AllViewerExceptHostHeader」。
   • 如需 CloudFront 檢視器位置標頭的完整清單，請參閱這篇文章
2. 請稍候幾分鐘，等待發布部署完成。在瀏覽器中前往 https://example.com/metrics/?validate_geo=healthy，確認設定是否正確。頁面應顯示「ok」。

Fastly

如要在廣告主專用 Google 代碼閘道中放送代碼，您需要設定 Fastly CDN 服務，轉送要求並新增地理位置資訊。這個程序需要建立一個「Condition」、一個「Host」，以及兩個「VCL snippet」。

建立 Condition 和 Host

首先，您要設定條件，找出閘道的要求和主機，然後將這些要求和主機導向 Google。

1. 使用下列設定建立新的「Condition」：

   • 類型：Request
   • 名稱：Google Tag Gateway Path (或您偏好的名稱)
   • Apply if…： req.url.path ~ "^/metrics"

2. 使用下列設定建立新的「Host」：

   • 主機名稱/地址：fps.goog

3. 使用下列其他設定配置新的 Host：

   • 按一下「Attach a condition」，然後選取您在步驟 1 建立的條件。
   • 將「Override host」設為 fps.goog。
   • 其他設定保留預設值。
   • 按一下「Update」即可儲存主機。

新增 Google 代碼 ID 和地理位置標頭

接著，您需要新增 VCL (Varnish Configuration Language) 程式碼片段，以附加 Google 代碼 ID 和用戶端地理位置資料。您必須使用完全相同的程式碼，為 vcl_miss 和 vcl_pass 分別建立一個程式碼片段。

1. 在服務中前往「VCL Snippets」，然後使用下列欄位建立 Snippet：

   • 名稱：Geo_MISS (或您偏好的名稱)
   • 刊登位置：Within Subroutine
   • Subroutine：vcl_miss

   • VCL：

     if (req.url.path ~ "^/metrics") {
       set bereq.http.X-Gtg-Tag-Id = "G-12345";
       set bereq.http.X-Forwarded-Country = client.geo.country_code;
       set bereq.http.X-Forwarded-Region = client.geo.region;
       set bereq.http.X-Forwarded-Geolocation = "latlong=" +
         client.geo.latitude + "," + client.geo.longitude + ";city=" +
         client.geo.city;
     }
     

2. 使用下列欄位建立另一個程式碼片段：

   • 名稱：Geo_PASS (或您偏好的名稱)
   • 類型：vcl_pass

   • VCL：

     if (req.url.path ~ "^/metrics") {
       set bereq.http.X-Gtg-Tag-Id = "G-12345";
       set bereq.http.X-Forwarded-Country = client.geo.country_code;
       set bereq.http.X-Forwarded-Region = client.geo.region;
       set bereq.http.X-Forwarded-Geolocation = "latlong=" +
         client.geo.latitude + "," + client.geo.longitude + ";city=" +
         client.geo.city;
     }
     

   現在您應該會有兩個新的獨立程式碼片段。這可確保系統會將地理位置標頭新增至任何需要從主機擷取的請求，無論是「快取失敗」(vcl_miss) 或「快取通過」(vcl_pass)。

啟用及驗證完整設定

建立 Host、Condition 和 VCL snippet 後，您現在可以啟用並測試完整設定。

1. 按一下「啟用」，即可部署所有新變更。

2. 在瀏覽器中執行下列兩項測試，驗證設定：

   • 測試 1 (代碼和路徑)：前往 https://example.com/metrics/healthy
   • 測試 2 (地理位置)：前往 https://example.com/metrics/?validate_geo=healthy

   兩個頁面都應顯示 ok

注意： 您可能需要清除服務，並等待幾分鐘，這項驗證才會通過。

其他

如要在廣告主專用 Google 代碼閘道中放送代碼，請設定 CDN 或負載平衡器，將要求轉送至廣告主專用 Google 代碼閘道端點。

1. 加入指向 G-12345.fps.goog 的來源或後端。
2. 將「主機」標頭覆寫為 G-12345.fps.goog。允許轉送所有 Cookie 和查詢字串。
3. 如要傳遞訪客的地理位置資訊，請加入下列任一標頭：
   • X-Forwarded-CountryRegion - 使用者的國家/地區和區域，以單一 ISO 3166-2 代碼表示 (例如：US-CA)。
   • X-Forwarded-Country 和 X-Forwarded-Region：
     • X-Forwarded-Country - 使用者的國家/地區，以 ISO 3166-1 alpha-2 代碼表示 (例如：US)。
     • X-Forwarded-Region - 使用者的區域子行政區代碼 (例如：CA)。
   • 如果同時加入這兩組標頭，系統會使用 X-Forwarded-CountryRegion。
4. 新增 /metrics/* 的路徑規則，將流量導向廣告主專用 Google 代碼閘道。
5. 設定預留路徑，使該路徑的優先順序高於預設規則。
6. 在瀏覽器中前往 https://example.com/metrics/healthy，確認設定是否正確。頁面應顯示「ok」。 如要確認是否已加入地理資訊，請前往 https://example.com/metrics/?validate_geo=healthy。頁面應顯示「ok」。

步驟 3：更新網站上的指令碼，改用評估路徑

將網站各網頁的指令碼替換為下列其中一個：

gtag.js

在 <head> 部分頂端，找出包含 Google 代碼 ID 的兩行指令碼：

<!-- Google tag (gtag.js) -->
<script async src="//www.googletagmanager.com/gtag/js?id=G-12345"></script>

然後將其指令碼為評估路徑：

<!-- Google tag (gtag.js) -->
<script async src="/metrics/"></script>

gtm.js

在 <head> 部分頂端，將代碼管理工具程式碼片段替換為下列內容：

<!-- 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=
'/metrics/?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','');</script>
<!-- End Google Tag Manager -->

注意： 廣告主專用 Google 代碼閘道不支援 <noscript> 程式碼片段。如要使用 <noscript> 功能，請繼續使用指向 www.googletagmanager.com 的標準 Google 代碼管理工具 <noscript> 程式碼片段。

測試評估設定

如要測試評估設定，請設定容器，至少加入一個會觸發的代碼。

1. 前往 Tag Assistant，然後預覽容器。
2. 前往網站觸發事件。

3. 依序點選「摘要」 >「輸出」 >「已傳送的命中」分頁標籤，確認命中資料會轉送至 /metrics。