下列情境代表了您在 導入 GPT雖然這類實作方式可能與目前的現行版本相容 則無法保證日後還會繼續運作。在 在極少數的情況下,這些導入方式可能會導致廣告放送作業意外中斷。 屬於不支援的導入方式。
每種情況都有修正問題的建議做法。
請注意,這份清單並未完整列出所有潛在問題 但應該可以做為實用的指南,協助您找出可能需要處理的問題類型。 需要處理。
此外,視導入方式而定,您可能需要找出 您可能需要對網站進行此類變更。
常見錯誤
情境 1:使用非官方版本的 GPT JavaScript 程式庫
應用實例概要說明 | 代管 gpt.js、pubads_impl.js,或是從自家伺服器載入的任何程式庫,或者 從非官方來源載入這些檔案。 |
含有錯誤的程式碼片段示例 |
// Incorrect: Accessing these files from an unofficial source <script async src="https://www.example.com/tag/js/gpt.js"></script> |
錯誤修正建議 |
// Correct: Access these files from a Google domain <script src="https://securepubads.g.doubleclick.net/tag/js/gpt.js" crossorigin="anonymous" async></script> // Also correct, if using Limited Ads <script src="https://pagead2.googlesyndication.com/tag/js/gpt.js" async></script> |
情境 2:仰賴 gpt.js 指令碼代碼監聽器
應用實例概要說明 |
假設 JavaScript 檔案已準備好呼叫 GPT API
gpt.js 載入有誤,因為 API 的某些部分是由
pubads_impl.js 檔案。以任何方式 (包括架構) 仰賴 API
因此不正確。
|
含有錯誤的程式碼片段示例 |
var tag = document.createElement('script'); tag.type = 'text/javascript'; tag.src = (useSSL ? 'https:' : 'http:') + '//www.googletagservices.com/tag/js/gpt.js'; // Incorrect: Attaching a callback to the script's onload event. tag.onload = callback; var node = document.getElementsByTagName('script')[0]; node.parentNode.insertBefore(tag, node); |
錯誤修正建議 |
// Make sure that googletag.cmd exists. window.googletag = window.googletag || {}; googletag.cmd = googletag.cmd || []; // Correct: Queueing the callback on the command queue. googletag.cmd.push(callback); |
修正方式的說明 / 說明 |
googletag.cmd 維護的指令清單,將以 GPT 執行時執行
準備就緒。這樣才能確保 GPT 載入後可以執行回呼。
|
情境 3:檢查 googletag 物件,確認 GPT 是否已就緒
應用實例概要說明 |
由於系統載入 JavaScript 檔案 gpt.js 時,GPT API 可能還未準備就緒
或在定義 googletag 物件的情況下檢查該物件
GPT API 並不可靠
|
含有錯誤的程式碼片段示例 |
// Incorrect: Relying on the presence of the googletag object // as a check for the GPT API. if (typeof googletag != 'undefined') { functionProcessingGPT(); } |
錯誤修正建議 |
// Correct: Relying on googletag.apiReady as a check for the GPT API. if (window.googletag && googletag.apiReady) { functionProcessingGPT(); } |
修正方式的說明 / 說明 | GPT 會將此資訊填入布林值標記 googletag.apiReady 系統已準備好呼叫 API,方便您進行可靠的斷言。 |
情境 4:仰賴模糊的程式碼語法
應用實例概要說明 |
如果您遵循最小化 GPT 程式庫程式碼的語法
隨時可能發生故障我們持續不斷變更,因此請限制您僅能使用 API 參考指南中所述的 API 用途
GPT 內部運作方式的持續改進 例如,常見的要求是偵測 呼叫 refresh() 。
|
含有錯誤的程式碼片段示例 |
// Incorrect: Relying on an obfuscated property. if (googletag.pubads().a != null) { functionProcessingGPT(); } |
錯誤修正建議 |
// Correct: Relying on public GPT API methods // (i.e. googletag.pubadsReady in this case). if(window.googletag && googletag.pubadsReady) { functionProcessingGPT(); } |
修正方式的說明 / 說明 | 只能使用公用 API。如要偵測 PubAdsService 是否 完整載入後,我們可以使用布林值 googletag.pubadsReady。 |
情境 5:覆寫 GPT 的任何函式或變數
應用實例概要說明 | 因覆寫 GPT 使用的任何函式或變數而產生的用途隨時都有可能中斷 因為這並非支援的用途GPT 內部時間變更可能會導致這個問題 各種錯誤行為 |
含有錯誤的程式碼片段示例 |
// Incorrect: Haphazardly overwriting a googletag.* property. googletag.cmd = []; |
錯誤修正建議 |
// Correct: Never overwrite googletag.* properties if they already exist. // Always check before assigning to them. googletag.cmd = googletag.cmd || []; |
情境 6:以錯誤順序呼叫 GPT
應用實例概要說明 | 隨著 GPT 內部的演進,競爭狀況可能會造成中斷。不正確 因執行作業期間特定時間而運作的一系列陳述式,並排序 可能無法繼續運作 |
含有錯誤的程式碼片段示例 |
// Incorrect: Setting page-level key-value targeting after calling // googletag.enableServices(). googletag.enableServices(); googletag.defineSlot(...); googletag.pubads().setTargeting(e, a); |
錯誤修正建議 |
// Correct: Setting page-level key-value targeting before calling // googletag.enableServices(). googletag.pubads().setTargeting(e, a); googletag.defineSlot(...); googletag.enableServices(); |
修正方式的說明 / 說明 |
如要避免競爭狀況,請確保遵循 GPT 的正常時間。有效範例
部分排序包括:
|
情境 7:濫用閉包和 JavaScript 變數範圍
應用實例概要說明 |
JavaScript 變數範圍和變數值的相關假設不正確
中已擷取到 googletag.cmd.push 的函式中。
|
含有錯誤的程式碼片段示例 |
// Incorrect: Variable x is declared outside the anonymous function // but referenced within it. for (var x = 0; x < slotCount; x++) { window.googletag.cmd.push( function(){ // If GPT is not yet loaded, this code will be executed subsequently when // the command queue is processed. Every queued function will use the last value // assigned to x (most likely slotCount). // This is because the function closure captures the reference to x, // not the current value of x. window.googletag.display(slot[x]); }) } } |
錯誤修正建議 |
window.googletag.cmd.push( function(){ // Correct: We both declare and reference x inside the context of the function. for (var x = 0; x < slotCount; x++){ window.googletag.display(slot[x]); } } ) |
修正方式的說明 / 說明 |
在 JavaScript 中,閉包會根據參照 (而非值) 擷取變數。也就是說 因此,如果您重新指派變數,系統就會在函式時使用該變數的新值 擷取該資料的閉包之後會執行。因此,程式碼之外的行為 可能會變更,取決於回呼是立即執行或延遲。 如果是非同步載入的 GPT (視 GPT 載入廣告代碼的速度而定) 可能會立即或不會立即執行指令佇列中的回呼。在前一個 例如,這會改變佇列指令的行為。 為了避免發生問題,您應該在不假設其功能的情況下編寫程式碼 放在指令佇列中的檔案會立即執行,並應謹慎處理 不支援 JavaScript 的範圍規則 |
情境 8:呼叫顯示器後,在 DOM 中移動運算單元容器
應用實例概要說明 | 在呼叫顯示後,在 DOM 移動或插入運算單元容器,可能導致 GPT 中的非預期自動重排和無法預測的行為 |
含有錯誤的程式碼片段示例 |
// Incorrect: Moving slot containers after calling display googletag.defineSlot("/1234/travel/asia", [728, 90], "div-gpt-ad-123456789-0"); googletag.enableServices(); googletag.display("div-gpt-ad-123456789-0"); ... // Inserting another element before the slot container, pushing the slot container down the page. document.body.insertBefore(someOtherElement, document.getElementById("div-gpt-ad-123456789-0")); |
錯誤修正建議 |
// Correct: Make any DOM order changes before calling display document.body.insertBefore(someOtherElement, document.getElementById("div-gpt-ad-123456789-0")); ... googletag.defineSlot("/1234/travel/asia", [728, 90], "div-gpt-ad-123456789-0"); googletag.enableServices(); googletag.display("div-gpt-ad-123456789-0"); |