Cómo evitar errores comunes de implementación

Los siguientes escenarios representan algunos de los errores más comunes observados al implementar etiquetas GPT. Si bien es posible que estas implementaciones parezcan funcionar bien con el versión de GPT, no se garantiza que seguirán haciéndolo en el futuro. En la en la mayoría de los casos extremos, es posible que estas implementaciones hagan que la publicación de anuncios falle de manera impredecible. Se consideran implementaciones no admitidas.

Cada situación incluye un enfoque sugerido para solucionar el problema que se muestra.

Ten en cuenta que esta lista no es una lista completamente exhaustiva de problemas potenciales, pero se espera que sirva como una guía útil para identificar los tipos de problemas que pueden debe abordarse.

Además, según su implementación, quizás necesite buscar todos los lugares donde estos cambios pueden ser necesarios en su sitio.

Errores comunes

Situación 1: Usa copias no oficiales de las bibliotecas JavaScript de GPT

Descripción del caso de uso de alto nivel Alojar gpt.js, pubads_impl.js o las bibliotecas que carguen desde tus propios servidores cargar estos archivos desde una fuente no oficial.
Ejemplo de fragmento de código con error 
// Incorrect: Accessing these files from an unofficial source
<script async src="https://www.example.com/tag/js/gpt.js"></script>
Formas sugeridas de corregir el error 
// 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>

Situación 2: Uso de los objetos de escucha de la etiqueta de secuencia de comandos de gpt.js

Descripción del caso de uso de alto nivel Suponer que la API de GPT está lista para llamarse cuando se ejecute el archivo La carga de gpt.js es incorrecta, ya que el archivo pubads_impl.js. Confiar en la API de cualquier manera (incluidos los frameworks) de los objetos de escucha de eventos adjuntos a la etiqueta de la secuencia de comandos es incorrecto.
Ejemplo de fragmento de código con error 
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);
Formas sugeridas de corregir el error 
// 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);
Explicación o descripción de la corrección googletag.cmd mantiene una lista de los comandos que se ejecutarán en cuanto GPT está listo. Esta es la forma correcta de asegurarse de que se ejecute la devolución de llamada cuando se cargue la etiqueta GPT.

Situación 3: Verificación del objeto googletag para saber si GPT está listo

Descripción del caso de uso de alto nivel Dado que es posible que la API de GPT no esté lista cuando se cargue el archivo JavaScript gpt.js o cuando se define el objeto googletag, verifica ese objeto para ver si la disponibilidad de la API de GPT no es confiable.
Ejemplo de fragmento de código con error 
// Incorrect: Relying on the presence of the googletag object
// as a check for the GPT API.
if (typeof googletag != 'undefined') {
 functionProcessingGPT();
}
Formas sugeridas de corregir el error 
// Correct: Relying on googletag.apiReady as a check for the GPT API.
if (window.googletag && googletag.apiReady) {
 functionProcessingGPT();
}
Explicación o descripción de la corrección GPT propagará la marca booleana googletag.apiReady en cuanto La API está lista para que la llames, de manera que puedas hacer aserciones confiables.

Situación 4: Usa la sintaxis de código ofuscada

Descripción del caso de uso de alto nivel Si dependes de la sintaxis precisa del código de biblioteca de GPT reducido, casi sin duda sufrieron fallas. Limita tu uso a la API documentada en la Guía de referencia de la API, ya que cambiamos continuamente. el funcionamiento interno de GPT para lograr mejoras constantes.
Por ejemplo, un requisito común es detectar cuándo PubAdsService está completamente cargado en llamar a refresh().
Ejemplo de fragmento de código con error 
// Incorrect: Relying on an obfuscated property.
if (googletag.pubads().a != null) {
 functionProcessingGPT();
}
Formas sugeridas de corregir el error 
// Correct: Relying on public GPT API methods
// (i.e. googletag.pubadsReady in this case).
if(window.googletag && googletag.pubadsReady) {
 functionProcessingGPT();
}
Explicación o descripción de la corrección Solo se puede confiar en la API pública. Para detectar si PubAdsService se completamente cargado, tenemos un valor booleano googletag.pubadsReady.

Situación 5: Reemplaza cualquier función o variable de GPT

Descripción del caso de uso de alto nivel Los casos de uso basados en el reemplazo de cualquier función o variable utilizada por GPT podrían fallar en cualquier momento ya que este no es un caso de uso admitido. Es posible que los cambios en los horarios en los componentes internos de GPT muestren esta información este tipo de comportamiento incorrecto por fallas.
Ejemplo de fragmento de código con error 
// Incorrect: Haphazardly overwriting a googletag.* property.
googletag.cmd = [];
Formas sugeridas de corregir el error 
// Correct: Never overwrite googletag.* properties if they already exist.
// Always check before assigning to them.
googletag.cmd = googletag.cmd || [];

Situación 6: Realizar pedidos erróneos a GPT

Descripción del caso de uso de alto nivel Es posible que las condiciones de carrera generen fallas a medida que los componentes internos de GPT evolucionen. Una un conjunto ordenado de sentencias que fueron funcionales debido a tiempos específicos en la ejecución puede no seguir funcionando en el futuro.
Ejemplo de fragmento de código con error 
// Incorrect: Setting page-level key-value targeting after calling
// googletag.enableServices().
googletag.enableServices();
googletag.defineSlot(...);
googletag.pubads().setTargeting(e, a);
Formas sugeridas de corregir el error 
// Correct: Setting page-level key-value targeting before calling
// googletag.enableServices().
googletag.pubads().setTargeting(e, a);
googletag.defineSlot(...);
googletag.enableServices();
Explicación o descripción de la corrección Para evitar las condiciones de carrera, asegúrese de respetar el tiempo habitual de GPT. Ejemplo válido las órdenes parciales incluyen:
  • Definir-Habilitar-Pantalla
    1. Cómo definir la configuración a nivel de página
    2. Define las ranuras
    3. enableServices()
    4. Ranuras de visualización
  • Habilitación, definición y visualización
    1. Cómo definir la configuración a nivel de página
    2. enableServices()
    3. Define las ranuras
    4. Ranuras de visualización

Situación 7: Uso inadecuado de cierres y alcances de la variable de JavaScript

Descripción del caso de uso de alto nivel Suposiciones incorrectas sobre el alcance de las variables de JavaScript y el valor de las variables se captura en la función que se pasa a googletag.cmd.push.
Ejemplo de fragmento de código con error 
// 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]);
  })
 }
}
Formas sugeridas de corregir el error 
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]);
  }
 }
)
Explicación o descripción de la corrección

En JavaScript, los cierres capturan variables por referencia en lugar de por valor. Esto significa que, si una variable se reasigna, su nuevo valor se usará cuando la función un cierre que lo capturó y que luego se ejecuta. Por lo tanto, el comportamiento del código en el cierre Puede cambiar en función de si la devolución de llamada se ejecuta de inmediato o se retrasa.

En el caso de las etiquetas GPT cargadas de forma asíncrona, según la rapidez con la que estas se carguen las devoluciones de llamada en la cola de comandos pueden ejecutarse de inmediato o no. En el anterior ejemplo, esto altera el comportamiento de los comandos en cola.

Para evitar problemas, el código debe escribirse sin la suposición de que funciona colocado en la cola de comandos se ejecutará de inmediato y se debe tener cuidado con con respecto a las reglas de alcance de JavaScript.

Situación 8: Traslado de contenedores de ranuras dentro del DOM después de llamar a Display

Descripción del caso de uso de alto nivel Mover o insertar contenedores de ranuras en el DOM después de llamar a Display puede generar reprocesamiento no deseado y comportamiento impredecible en GPT.
Ejemplo de fragmento de código con error 
// 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"));
Formas sugeridas de corregir el error 
// 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");
Anterior
Supervisa el rendimiento