Movatterモバイル変換


[0]ホーム

URL:


MDN Web Docs

SharedStorageOperation

Experimental:This is anexperimental technology
Check theBrowser compatibility table carefully before using this in production.

TheSharedStorageOperation interface of theShared Storage API represents the base class for all output gate operation types.

The output gate types are detailed below:

NameDescriptionDefined byInvoked by
URL SelectionUsed to select a URL to display to the user based on shared storage data.SharedStorageSelectURLOperationselectURL()
RunA generic way to process some shared storage data. Used, for example, by thePrivate Aggregation API to process shared storage data and generate aggregated reports.SharedStorageRunOperationrun()

Examples

Defining individual operations

Many shared storage worklet module scripts only define and register a single operation; you can see examples on theSharedStorageSelectURLOperation andSharedStorageRunOperation pages.

Defining multiple operations

In more advanced cases, it is possible to define and register multiple operations in the same shared storage worklet module script with different names. In the following worklet module script, we define a URL Selection operation calledSelectURLOperation that selects a URL for A/B testing, and a Run operation calledExperimentGroupReportingOperation, which runs a histogram report based on the user's A/B testing group:

js
// ab-testing-worklet.jsclass SelectURLOperation {  async run(urls, data) {    // Read the user's group from shared storage    const experimentGroup = await sharedStorage.get("ab-testing-group");    // Log to console for the demo    console.log(`urls = ${JSON.stringify(urls)}`);    console.log(`data = ${JSON.stringify(data)}`);    console.log(`ab-testing-group in shared storage is ${experimentGroup}`);    // Return the index of the group    return data.indexOf(experimentGroup);  }}function getBucketForTestingGroup(testingGroup) {  switch (testingGroup) {    case "control":      return 0;    case "experiment-a":      return 1;    case "experiment-b":      return 2;  }}class ExperimentGroupReportingOperation {  async run() {    const experimentGroup = await sharedStorage.get("ab-testing-group");    const bucket = BigInt(getBucketForTestingGroup(experimentGroup));    privateAggregation.contributeToHistogram({ bucket, value: 1 });  }}// Register the operationsregister("ab-testing", SelectURLOperation);register("experiment-group-reporting", ExperimentGroupReportingOperation);

In the main browsing context, these operations are invoked byselectURL() andrun(), respectively. The operations to invoke via these methods are selected using the names they were registered with, and they are also required to conform to the structures defined by theSharedStorageSelectURLOperation andSharedStorageRunOperation classes and theirrun() methods.

js
// For demo purposes. The hostname is used to determine the usage of// development localhost URL vs production URLconst contentProducerUrl = window.location.host;// Map the experiment groups to the URLsconst EXPERIMENT_MAP = [  {    group: "control",    url: `https://${contentProducerUrl}/ads/default-ad.html`,  },  {    group: "experiment-a",    url: `https://${contentProducerUrl}/ads/experiment-ad-a.html`,  },  {    group: "experiment-b",    url: `https://${contentProducerUrl}/ads/experiment-ad-b.html`,  },];// Choose a random group for the initial experimentfunction getRandomExperiment() {  const randomIndex = Math.floor(Math.random() * EXPERIMENT_MAP.length);  return EXPERIMENT_MAP[randomIndex].group;}async function injectAd() {  // Load the worklet module  await window.sharedStorage.worklet.addModule("ab-testing-worklet.js");  // Set the initial value in the storage to a random experiment group  window.sharedStorage.set("ab-testing-group", getRandomExperiment(), {    ignoreIfPresent: true,  });  const urls = EXPERIMENT_MAP.map(({ url }) => ({ url }));  const groups = EXPERIMENT_MAP.map(({ group }) => group);  // Resolve the selectURL call to a fenced frame config only when it exists on the page  const resolveToConfig = typeof window.FencedFrameConfig !== "undefined";  // Run the URL selection operation to select an ad based on the experiment group in shared storage  const selectedUrl = await window.sharedStorage.selectURL("ab-testing", urls, {    data: groups,    resolveToConfig,    keepAlive: true,  });  const adSlot = document.getElementById("ad-slot");  if (resolveToConfig && selectedUrl instanceof FencedFrameConfig) {    adSlot.config = selectedUrl;  } else {    adSlot.src = selectedUrl;  }  // Run the reporting operation  await window.sharedStorage.run("experiment-group-reporting");}injectAd();

Specifications

No specification found

No specification data found forapi.SharedStorageOperation.
Check for problems with this page or contribute a missingspec_url tomdn/browser-compat-data. Also make sure the specification is included inw3c/browser-specs.

Browser compatibility

See also

Help improve MDN

Learn how to contribute.

This page was last modified on byMDN contributors.


[8]ページ先頭

©2009-2025 Movatter.jp