Seleccionar una creatividad según la frecuencia

Ejecuta un worklet de Shared Storage para seleccionar una URL y renderizarla en un iframe cercado.

La API de Shared Storage es una propuesta de Privacy Sandbox para el almacenamiento de uso general en varios sitios, que admite muchos casos de uso posibles. Un ejemplo es el control de frecuencia, que está disponible para probar en Chrome Beta 104.0.5086.0 y versiones posteriores.

Ejecuta una secuencia de comandos de worklet para seleccionar una URL de una lista proporcionada, según los datos almacenados, y, luego, renderiza esa URL en un iframe delimitado. Se puede usar para seleccionar anuncios nuevos o contenido diferente cuando se alcanza el límite de frecuencia.

Prueba la selección de creatividades por frecuencia

Para probar la selección de creatividades por frecuencia con Shared Storage y Fenced Frames, confirma que usas Chrome 104.0.5086.0 o una versión posterior. Habilita todas las APIs de Privacidad de anuncios en chrome://settings/adPrivacy.

También puedes habilitar Shared Storage con la marca --enable-features=PrivacySandboxAdsAPIsOverride,OverridePrivacySandboxSettingsLocalTesting,SharedStorageAPI,FencedFrames en la línea de comandos.

Experimenta con muestras de código

Para seleccionar y crear una URL opaca, registra un módulo de worklet para leer los datos del almacenamiento compartido. La clase de worklet recibe una lista de hasta ocho URLs y, luego, devuelve el índice de la URL elegida.

Cuando el cliente llama a sharedStorage.selectURL(), se ejecuta el worklet y se devuelve una URL opaca para renderizarla en un fenced frame.

Supongamos que deseas seleccionar un anuncio o contenido diferente para renderizar en función de la frecuencia con la que un usuario lo vio anteriormente. Puedes contar cuántas veces un usuario vio un contenido y almacenar ese valor en el almacenamiento compartido. Una vez almacenado, el valor del almacenamiento compartido estará disponible para ti en diferentes orígenes.

Luego, el worklet de almacenamiento compartido lee los valores en el almacenamiento compartido y aumenta el contador con cada vista adicional. Si el recuento no alcanzó el límite predefinido, se devuelve el contenido que deseas renderizar (índice 1). De lo contrario, se devuelve la URL predeterminada (índice 0).

En este ejemplo:

  • creative-selection-by-frequencyjs se carga a través del iframe del productor de contenido o del anunciante, y es responsable de cargar el worklet de almacenamiento compartido y renderizar la fuente opaca devuelta en un iframe delimitado.
  • creative-selection-by-frequency-worklet.js es el worklet de almacenamiento compartido que lee el recuento de frecuencia para determinar qué URL se devuelve para una creatividad de contenido o publicitaria.

creative-selection-by-frequency.js

// The first URL is the default content or ad to be rendered when the frequency limits reached.
const CONTENT_URLS = [
  { url: `https://${contentProducerUrl}/default-content.html` },
  { url: `https://${contentProducerUrl}/example-content.html` },
];

async function injectAd() {
  // Load the worklet module.
  await window.sharedStorage.worklet.addModule('creative-selection-by-frequency-worklet.js');

  // Set the initial frequency count
  window.sharedStorage.set('frequency-count', 0, {
    ignoreIfPresent: true,
  });

  // Run the URL selection operation to choose an ad based on the frequency count in shared storage.
  const fencedFrameConfig = await window.sharedStorage.selectURL('creative-selection-by-frequency', CONTENT_URLS, {
    resolveToConfig: true
  });

  // Render the opaque URL into a fenced frame
  document.getElementById('content-slot').config = fencedFrameConfig;
}

injectAd();

creative-selection-by-frequency-worklet.js

const FREQUENCY_LIMIT = 5;

class CreativeSelectionByFrequencyOperation {
  async run(urls, data) {
    // Read the current frequency limit in shared storage
    const count = parseInt(await sharedStorage.get('frequency-count'));

    // Check if the frequency limit has been reached.
    if (count === FREQUENCY_LIMIT) {
      console.log('Frequency limit has been reached, and the default content will be rendered.');
      return 0;
    }

    // Set the new frequency count in shared storage
    await sharedStorage.set('frequency-count', count + 1);
    return 1;
  }
}

// Register the operation as 'creative-selection-by-frequency'.
register('creative-selection-by-frequency', CreativeSelectionByFrequencyOperation);

Casos prácticos

En esta sección, encontrarás todos los casos de uso disponibles para la API de Select URL. Seguiremos agregando ejemplos a medida que recibamos comentarios y descubramos nuevos casos de prueba.

Interactúa y comparte comentarios

Ten en cuenta que la propuesta de la API de Select URL está en debate y desarrollo activos, y está sujeta a cambios.

Nos encantaría conocer tu opinión sobre la API de Select URL.