Unikanie najczęstszych błędów implementacji

Poniżej znajdziesz opis najczęstszych błędów występujących podczas implementacji tagów GPT. Takie implementacje mogą się dobrze sprawdzać w obecnej wersji GPT, ale nie możemy zagwarantować, że nie zmieni się to w przyszłości. W najbardziej skrajnych przypadkach może to spowodować nieprzewidywalne przerwanie wyświetlania reklam. Uznaje się je za nieobsługiwane implementacje.

Każdy scenariusz zawiera sugerowaną metodę rozwiązania problemu.

Pamiętaj, że ta lista nie przedstawia pełnej listy potencjalnych problemów, ale powinna służyć jako pomoc w znalezieniu rodzajów problemów, które należy rozwiązać.

Ponadto, w zależności od implementacji, konieczne może być znalezienie wszystkich miejsc w witrynie, w których takie zmiany mogą być konieczne.

Typowe błędy

Scenariusz 1. Używanie nieoficjalnych kopii bibliotek JavaScript GPT

Ogólny opis przypadku użycia Hostowanie plików gpt.js, pubads_impl.js lub dowolnych bibliotek ładowanych z Twoich własnych serwerów albo wczytywanie tych plików z nieoficjalnego źródła.
Przykładowy fragment kodu z błędem
// Incorrect: Accessing these files from an unofficial source
<script async src="https://www.example.com/tag/js/gpt.js"></script>
Sugerowane sposoby rozwiązania błędu
// Correct: Access these files from a Google domain
<script async src="https://securepubads.g.doubleclick.net/tag/js/gpt.js"></script>
// Also correct, if using Limited Ads
<script async src="https://pagead2.googlesyndication.com/tag/js/gpt.js"></script>

Scenariusz 2. Poleganie na słuchaczach tagu skryptu gpt.js

Ogólny opis przypadku użycia Zakładamy, że interfejs GPT API jest gotowy do wywołania po wczytaniu pliku JavaScript gpt.js, ponieważ niektóre części interfejsu API są dostarczane przez plik pubads_impl.js. W związku z tym poleganie w jakikolwiek sposób (w tym na platformach) od interfejsu API z detektorów zdarzeń dołączonych do tagu skryptu jest nieprawidłowe.
Przykładowy fragment kodu z błędem
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);
Sugerowane sposoby rozwiązania błędu
// 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);
Wyjaśnienie lub opis poprawki googletag.cmd zawiera listę poleceń, które będą uruchamiane, gdy tylko tag GPT będzie gotowy. W ten sposób możesz mieć pewność, że wywołanie zwrotne będzie wykonywane po wczytaniu tagu GPT.

Scenariusz 3. Sprawdzanie obiektu googletag w celu ustalenia, czy tag GPT jest gotowy

Ogólny opis przypadku użycia Interfejs GPT API może nie być gotowy podczas wczytywania pliku JavaScript gpt.js lub gdy zdefiniowany jest obiekt googletag. Dlatego po jego sprawdzeniu, czy dostępny interfejs API GPT jest dostępny, nie zostanie uznany za niezawodny.
Przykładowy fragment kodu z błędem
// Incorrect: Relying on the presence of the googletag object
// as a check for the GPT API.
if (typeof googletag != 'undefined') {
 functionProcessingGPT();
}
Sugerowane sposoby rozwiązania błędu
// Correct: Relying on googletag.apiReady as a check for the GPT API.
if (window.googletag && googletag.apiReady) {
 functionProcessingGPT();
}
Wyjaśnienie lub opis poprawki Gdy tylko interfejs API będzie gotowy do wywołania, GPT uzupełni flagę wartości logicznej googletag.apiReady, co pozwoli na tworzenie wiarygodnych asercji.

Scenariusz 4. Poleganie na składni zaciemnionego kodu

Ogólny opis przypadku użycia Jeśli polegasz na dokładnej składni zminimalizowanego kodu biblioteki GPT, niemal na pewno wystąpią błędy. Nie używaj interfejsu API zgodnie z opisem w Przewodniku po interfejsach API, ponieważ stale ulepszamy działanie GPT.
Częstym wymaganiem jest na przykład wykrycie, kiedy usługa PubAdsService jest w pełni załadowana, aby wywołać refresh().
Przykładowy fragment kodu z błędem
// Incorrect: Relying on an obfuscated property.
if (googletag.pubads().a != null) {
 functionProcessingGPT();
}
Sugerowane sposoby rozwiązania błędu
// Correct: Relying on public GPT API methods
// (i.e. googletag.pubadsReady in this case).
if(window.googletag && googletag.pubadsReady) {
 functionProcessingGPT();
}
Wyjaśnienie lub opis poprawki Można polegać tylko na publicznym interfejsie API. W przypadku wykrycia, czy usługa PubAdsService została w pełni wczytana, mamy wartość logiczną googletag.pubadsReady.

Scenariusz 5. Zastępowanie dowolnej funkcji lub zmiennej GPT

Ogólny opis przypadku użycia Przypadki użycia polegające na zastąpieniu dowolnej funkcji lub zmiennej używanej przez GPT mogą przestać działać w każdej chwili, ponieważ nie są one obsługiwane. Zmiany czasu w elementach wewnętrznych GPT mogą wskazywać na takie nieprawidłowe zachowanie w przypadku awarii.
Przykładowy fragment kodu z błędem
// Incorrect: Haphazardly overwriting a googletag.* property.
googletag.cmd = [];
Sugerowane sposoby rozwiązania błędu
// Correct: Never overwrite googletag.* properties if they already exist.
// Always check before assigning to them.
googletag.cmd = googletag.cmd || [];

Scenariusz 6. Nieprawidłowa kolejność wywołań GPT

Ogólny opis przypadku użycia Warunki rasowe mogą powodować awarie w miarę ewolucji elementów wewnętrznych GPT. Nieprawidłowo uporządkowany zestaw instrukcji, które działały dzięki określonym czasom wykonywania, może przestać działać w przyszłości.
Przykładowy fragment kodu z błędem
// Incorrect: Setting page-level key-value targeting after calling
// googletag.enableServices().
googletag.enableServices();
googletag.defineSlot(...);
googletag.pubads().setTargeting(e, a);
Sugerowane sposoby rozwiązania błędu
// Correct: Setting page-level key-value targeting before calling
// googletag.enableServices().
googletag.pubads().setTargeting(e, a);
googletag.defineSlot(...);
googletag.enableServices();
Wyjaśnienie lub opis poprawki Unikaj wyścigów, dbając o standardową szybkość działania GPT. Przykłady prawidłowych kolejności częściowych:
  • Zdefiniuj-Włącz-Wyświetlacz
    1. Definiowanie ustawień na poziomie strony
    2. Zdefiniuj przedziały
    3. enableServices()
    4. Boksy displayowe
  • Enable-Definition-Display
    1. Definiowanie ustawień na poziomie strony
    2. enableServices()
    3. Zdefiniuj przedziały
    4. Boksy displayowe

Scenariusz 7. Niewłaściwe używanie informacji o zamknięciu i określaniu zakresu zmiennych JavaScriptu

Ogólny opis przypadku użycia Nieprawidłowe założenia dotyczące zakresu zmiennej JavaScriptu oraz wartości zmiennych przechwyconych przez funkcję przekazaną do funkcji googletag.cmd.push.
Przykładowy fragment kodu z błędem
// 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]);
  })
 }
}
Sugerowane sposoby rozwiązania błędu
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]);
  }
 }
)
Wyjaśnienie lub opis poprawki

W JavaScripcie informacje o zamknięciach przechwytują zmienne według odwołania, a nie wartości. Oznacza to, że jeśli ponownie przypiszesz zmienną, jej nowa wartość będzie używana przy późniejszym wykonaniu zamknięcia funkcji, która ją przechwyciła. Dlatego zachowanie kodu w takiej sytuacji może się zmienić w zależności od tego, czy wywołanie zwrotne jest wykonywane natychmiast, czy opóźnione.

Asynchronicznie ładowany tag GPT – w zależności od tego, jak szybko wczytuje on wywołania zwrotne w kolejce poleceń, może zostać wykonane od razu lub nie. W podanym wyżej przykładzie zmienia to działanie poleceń znajdujących się w kolejce.

Aby uniknąć problemów, kod należy pisać bez założenia, że funkcje umieszczone w kolejce poleceń będą wykonywane natychmiast. Zachowaj ostrożność, jeśli chodzi o reguły określania zakresu w JavaScripcie.

Scenariusz 8. Przenoszenie kontenerów przedziałów w interfejsie DOM po wywołaniu elementu display

Ogólny opis przypadku użycia Przenoszenie lub wstawianie kontenerów przedziałów w interfejsie DOM po wywołaniu danych displayowych może spowodować niepożądane przeformatowanie i nieprzewidywalne zachowanie GPT.
Przykładowy fragment kodu z błędem
// 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"));
Sugerowane sposoby rozwiązania błędu
// 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");