依頻率選取廣告素材

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

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

用途

請參閱本節，瞭解 Select URL API 的所有可用用途。我們會持續新增示例，以回應使用者意見並探索新的測試案例。

互動並分享意見回饋

請注意，Select URL API 提案仍在積極討論和開發中，可能會有所變動。

我們很期待聽到您對 Select URL API 的看法。

掌握最新消息

  • 電子報名單：訂閱我們的電子報名單，即可取得與 Select 網址和 Shared Storage API 相關的最新消息和公告。

需要協助嗎？