FencedFrameConfig: setSharedStorageContext() 方法

实验性: 这是一种 实验性技术
在生产环境中使用此技术之前,请仔细查看 浏览器兼容性表

setSharedStorageContext() 方法是 FencedFrameConfig 接口的一部分,它将嵌入文档中的上下文数据传递到 <fencedframe>共享存储

语法

js
setSharedStorageContext(context)

参数

context

一个字符串,表示要传递到共享存储的上下文数据。设置后,该数据将存储在 内部配置storageContext 属性中。

返回值

无(Undefined)。

示例

通过 setSharedStorageContext() 传递上下文数据

您可以使用 私有聚合 API 来创建报告,将围栏框架中的事件级数据与嵌入文档中的上下文数据合并。setSharedStorageContext() 可用于将上下文数据从嵌入程序传递到由 受保护的受众 API 启动的共享存储工作程序。

在以下示例中,我们将嵌入页面和围栏框架中的数据都存储在 共享存储 中。

在嵌入页面中,我们将使用 setSharedStorageContext() 将模拟的事件 ID 作为共享存储上下文进行设置。

js
const frameConfig = await navigator.runAdAuction({ resolveToConfig: true });

// Data from the embedder that you want to pass to the shared storage worklet
frameConfig.setSharedStorageContext("some-event-id");

const frame = document.createElement("fencedframe");
frame.config = frameConfig;

在围栏框架中,我们使用 window.sharedStorage.worklet.addModule() 添加工作程序模块,然后使用 window.sharedStorage.run() 将事件级数据发送到共享存储工作程序(这与嵌入文档中的上下文数据无关)。

js
const frameData = {
  // Data available only inside the fenced frame
};

await window.sharedStorage.worklet.addModule("reporting-worklet.js");

await window.sharedStorage.run("send-report", {
  data: {
    frameData,
  },
});

reporting-worklet.js 工作程序中,我们从 sharedStorage.context 中读取嵌入文档的事件 ID,从数据对象中读取框架的事件级数据,然后通过私有聚合进行报告。

js
class ReportingOperation {
  convertEventIdToBucket(eventId) { ... }
  convertEventPayloadToValue(info) { ... }

  async run(data) {
    // Data from the embedder
    const eventId = sharedStorage.context;

    // Data from the fenced frame
    const eventPayload = data.frameData;

    privateAggregation.sendHistogramReport({
      bucket: convertEventIdToBucket(eventId),
      value: convertEventPayloadToValue(eventPayload)
    });
  }
}

register('send-report', ReportingOperation);

规范

规范
Fenced Frame
# dom-fencedframeconfig-setsharedstoragecontext

浏览器兼容性

BCD 表格仅在启用了 JavaScript 的浏览器中加载。

另请参阅