Personalizza l'esperienza utente per i clienti noti

Utilizza un worklet dello spazio di archiviazione condiviso per identificare i clienti noti.

L'API Shared Storage è una proposta di Privacy Sandbox per lo spazio di archiviazione cross-site per uso generico, che supporta molti possibili casi d'uso. Un esempio è l'identificazione dei clienti noti, che è disponibile per i test in Chrome 104.0.5086.0 e versioni successive.

Puoi memorizzare in Shared Storage se l'utente si è registrato sul tuo sito, quindi visualizzare un elemento separato in base allo stato memorizzato dell'utente (se l'utente è un cliente "noto").

Impostare i clienti noti

Per fare esperimenti sull'identificazione dei clienti noti in Shared Storage, verifica di utilizzare Chrome 104.0.5086.0 o versioni successive. Abilita tutte le API Privacy per gli annunci in chrome://settings/adPrivacy.

Puoi anche attivare lo spazio di archiviazione condiviso con il flag --enable-features=PrivacySandboxAdsAPIsOverride,OverridePrivacySandboxSettingsLocalTesting,SharedStorageAPI,FencedFrames nella riga di comando.

Sperimenta con gli esempi di codice

Potresti voler visualizzare un elemento diverso a seconda che l'utente sia stato visto su un sito diverso. Ad esempio, un fornitore di servizi di pagamento potrebbe voler visualizzare un pulsante "Registrati" o "Acquista ora" a seconda che l'utente si sia registrato sul sito del fornitore di servizi di pagamento. Lo spazio di archiviazione condiviso può essere utilizzato per impostare lo stato dell'utente e personalizzare la sua esperienza in base a questo stato.

In questo esempio:

  • known-customer.js è incorporato in un frame. Questo script imposta le opzioni per il pulsante da visualizzare su un sito, "Registrati" o "Acquista ora".
  • known-customer-worklet.js è il worklet dello spazio di archiviazione condiviso che determina se l'utente è noto. Se l'utente è noto, le informazioni vengono restituite. Se l'utente è sconosciuto, queste informazioni vengono restituite per visualizzare il pulsante "Registrati" e l'utente viene contrassegnato come noto per il futuro.

known-customer.js

// The first URL for the "register" button is rendered for unknown users.
const BUTTON_URLS = [
  { url: `https://${advertiserUrl}/ads/register-button.html` },
  { url: `https://${advertiserUrl}/ads/buy-now-button.html` },
];

async function injectButton() {
  // Load the worklet module
  await window.sharedStorage.worklet.addModule('known-customer-worklet.js');

  // Set the initial status to unknown ('0' is unknown and '1' is known)
  window.sharedStorage.set('known-customer', 0, {
    ignoreIfPresent: true,
  });

  // Run the URL selection operation to choose the button based on the user status
  const fencedFrameConfig = await window.sharedStorage.selectURL('known-customer', BUTTON_URLS, {
    resolveToConfig: true
  });

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

injectButton();

known-customer-worklet.js

class SelectURLOperation {
  async run(urls) {
    const knownCustomer = await sharedStorage.get('known-customer');

    // '0' is unknown and '1' is known
    return parseInt(knownCustomer);
  }
}

register('known-customer', SelectURLOperation);

Casi d'uso

Tutti i casi d'uso disponibili per l'API Select URL sono disponibili in questa sezione. Continueremo ad aggiungere esempi man mano che riceviamo feedback e scopriamo nuovi casi di test.

Coinvolgere e condividere feedback

Tieni presente che la proposta dell'API Select URL è in discussione e in fase di sviluppo ed è soggetta a modifiche.

Saremo lieti di conoscere la tua opinione sull'API Select URL.

Rimani al passo con le notizie

  • Mailing list: iscriviti alla nostra mailing list per ricevere gli ultimi aggiornamenti e annunci relativi alle API Select URL e Shared Storage.

Hai bisogno di aiuto?