依頻率選取廣告素材

執行共用儲存空間工作程式來選取網址，並在圍欄頁框中顯示該網址。

Shared Storage API 是一項「隱私權」 一般用途的沙箱提案，支援多種 可能的用途其中一個例子是展示頻率控制 並用於 Chrome Beta 版 104.0.5086.0 以上版本。

執行工作程式指令碼，根據儲存的 ，然後在圍欄頁框中顯示該網址。這可用來選取 達到展示頻率上限時，系統就會停止顯示新的廣告或其他內容。

依頻率測試廣告素材選擇

如要使用共用儲存空間和 Fenced Frames 測試廣告素材選擇頻率，請確認 使用 Chrome 104.0.5086.0 以上版本。啟用 chrome://settings/adPrivacy 下的所有廣告隱私權 API。

您也可以在指令列中使用 --enable-features=PrivacySandboxAdsAPIsOverride,OverridePrivacySandboxSettingsLocalTesting,SharedStorageAPI,FencedFrames 旗標啟用共用儲存空間。

使用程式碼範例進行實驗

如要選取及建立不透明網址，請註冊 Worklet 模組以讀取共用 儲存空間資料Worklet 類別會收到最多包含 8 個網址的清單， 會傳回所選網址的索引。

當用戶端呼叫 sharedStorage.selectURL() 時，工作程式 會執行並傳回不透明網址，以轉譯為圍欄頁框。

假設您想要根據使用者先前看過廣告的頻率，選取要顯示的其他廣告或內容。您可以計算使用者瀏覽內容的次數，並將值儲存至共用儲存空間。儲存後，各個來源中的值就可以使用共用儲存空間中的值。

接著，共用儲存空間工作程式會讀取共用儲存空間中的值，每增加一個檢視畫面，計數器就會遞增。如果數量未達到預先定義的上限，系統就會傳回您要算繪的內容 (索引 1)。否則，系統會傳回預設網址 (索引 0)。

在這個例子中：

  • 「creative-selection-by-frequencyjs」是透過內容製作者或廣告客戶的 iframe 載入，而且必須負責 載入共用儲存空間工作程式，然後算繪傳回的不透明 把原始碼嵌入柵欄框中
  • creative-selection-by-frequency-worklet.js 是共用儲存空間工作程式，會讀取 次數，即可決定內容或廣告素材會傳回哪個網址。

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);

Use cases

All available use cases for Select URL API can be found in this section. We'll continue to add examples as we receive feedback and discover new test cases.

Engage and share feedback

Note that the Select URL API proposal is under active discussion and development and subject to change.

We're eager to hear your thoughts on the Select URL API.

Stay Informed

  • Mailing List: Subscribe to our mailing list for the latest updates and announcements related to the Select URL and Shared Storage APIs.

Need Help?