MDN项目解读：深入理解Web API中的Shared Storage API
概述
Shared Storage API是一种客户端存储机制，它允许在不依赖追踪cookie的情况下实现跨站点数据访问，同时保护用户隐私。这项技术旨在解决现代Web开发中隐私保护和数据共享之间的矛盾问题。
背景与需求
传统Web存储机制（如Cookie、Web Storage等）存在严重的隐私问题，特别是当第三方内容通过iframe嵌入网站时设置的cookie，可以被用来追踪用户行为和构建用户画像。浏览器厂商正在通过存储分区（Storage Partitioning）技术来解决这个问题，但这又阻碍了一些合法的跨站点数据共享需求。
Shared Storage API应运而生，它提供了以下核心能力：
- 跨站点数据存储
- 数据处理能力
- 安全的数据共享机制
核心概念
存储结构
Shared Storage API包含两个主要部分：
- 存储接口：用于写入数据
- 工作线程(Worklet)：用于读取和处理数据
输出门(Output Gates)
这是Shared Storage API的关键安全机制，它控制着如何将处理后的数据安全地返回给主页面。目前支持两种输出门：
-
URL选择门(URL Selection)
- 用途：基于存储数据从提供的URL列表中选择一个显示给用户
- 方法：
selectURL() - 典型应用场景：
- 创意内容轮播
- A/B测试
- 定制化用户体验
-
运行门(Run)
- 用途：通用数据处理
- 方法：
run() - 常与Private Aggregation API配合使用，用于：
- 唯一触达报告
- 用户人口统计报告
- K+频率测量
工作原理详解
数据写入
写入数据可以在两种上下文中进行：
- 主浏览上下文（通过
window.sharedStorage） - 工作线程上下文（通过
this.sharedStorage）
基本写入操作包括：
set()：设置键值对append()：追加值delete()/clear()：删除数据
数据读取与处理
读取数据必须通过工作线程完成，这是API设计的关键隐私保护措施。典型流程包括：
- 定义工作线程操作类
- 注册操作
- 将工作线程模块添加到共享存储
- 通过输出门获取处理结果
与Web Storage的差异
| 特性 | Shared Storage | Web Storage |
|---|---|---|
| 访问范围 | 跨站点 | 同源 |
| 读取权限 | 仅限工作线程 | 自由读取 |
| 数据提取 | 必须通过输出门 | 直接访问 |
| 数据保留 | 最后写入后30天 | localStorage永久，sessionStorage会话结束 |
接口详解
核心接口
- SharedStorage：基础接口，定义写入方法
- WindowSharedStorage：主浏览上下文接口
- WorkletSharedStorage：工作线程上下文接口
- SharedStorageWorklet：工作线程管理接口
- SharedStorageWorkletGlobalScope：工作线程全局作用域
输出门操作签名
- SharedStorageOperation：基础操作类
- SharedStorageRunOperation：运行门操作
- SharedStorageSelectURLOperation：URL选择门操作
实际应用示例
A/B测试实现
- 主页面脚本：
// 随机分配测试组
function getExperimentGroup() {
return Math.round(Math.random());
}
async function runABTest() {
// 添加工作线程模块
await window.sharedStorage.worklet.addModule('ab-testing-worklet.js');
// 存储分组信息
window.sharedStorage.set('ab-testing-group', getExperimentGroup(), {
ignoreIfPresent: true
});
// 选择URL
const frameConfig = await window.sharedStorage.selectURL(
'ab-testing',
[
{url: 'https://example.com/control.html'},
{url: 'https://example.com/variation.html'}
],
{resolveToConfig: true}
);
// 在fenced frame中显示
document.getElementById('test-frame').config = frameConfig;
}
- 工作线程脚本(ab-testing-worklet.js)：
class SelectURLOperation {
async run(urls) {
const group = await this.sharedStorage.get('ab-testing-group');
return group; // 返回0或1对应URL数组索引
}
}
register('ab-testing', SelectURLOperation);
部署与测试
要使用Shared Storage API，开发者需要通过隐私沙盒注册流程。本地测试时可以启用Chrome开发者标志：
chrome://flags/#privacy-sandbox-enrollment-overrides
浏览器兼容性现状
目前Shared Storage API仍处于实验阶段，各浏览器厂商的立场不一。开发者在使用前应检查最新的浏览器兼容性信息。
总结
Shared Storage API代表了Web平台在隐私保护与功能性之间寻找平衡的重要尝试。它为广告测量、内容个性化等场景提供了隐私安全的解决方案，同时避免了传统的追踪技术。随着Web生态对隐私要求的不断提高，这类技术将变得越来越重要。
开发者现在就可以开始探索Shared Storage API的可能性，但应注意其仍处于发展阶段，API细节可能会发生变化。建议关注官方文档获取最新信息，并在生产环境部署前进行充分测试。
