HTML5本地存储默认按“协议+域名+端口”同源隔离，子域名间天然不共享；可通过Cookie的Domain属性、postMessage+中立iframe或服务端统一接口实现有控共享。
HTML5 的本地存储（如 localStorage、sessionStorage）默认按“协议 + 域名 + 端口”三级同源策略隔离，子域名之间**天然不共享**。例如 a.example.com 和 b.example.com 的 localStorage 完全独立，无法直接读写对方数据。但实际业务中常需在多子域间安全地隔离或有控制地共享数据，需结合浏览器机制与服务端协同设计。
明确隔离是默认行为，无需额外操作
只要不主动干预，各子域名的 Web Storage、IndexedDB、Cookie（未显式设置 Domain）都自动隔离。这是浏览器的安全基石，避免跨子域数据污染或越权访问。
- 同一主域下不同子域的
localStorage互不可见，即使脚本完全相同 -
document.cookie默认也只发送给当前完整主机名，a.example.com不会带上b.example.com的 Cookie - Service Worker 的作用域严格绑定注册路径，
a.example.com/sw.js无法控制b.example.com的网络请求
有节制地共享：通过 Cookie + Domain 属性实现简单状态同步
若只需传递少量、非敏感的状态标识（如登录态 token、语言偏好），可借助 Cookie 的 Domain 属性向上扩展作用域到主域。
- 后端 Set-Cookie 时指定
Domain=.example.com（注意开头的点），则a.example.com、b.example.com、example.com均可读取该 Cookie - 前端 JavaScript 可通过
document.cookie读取（需确保 Cookie 未标记HttpOnly） - ⚠️ 注意：Cookie 有大小限制（通常 4KB）、每次请求自动携带（增加开销），且不适用于存储结构化大数据
跨子域通信：用 postMessage + iframe 实现可控数据交换
当需要传递较复杂数据（如用户配置、实时状态），又不想依赖服务端中转，可用 postMessage 配合嵌入同主域下的中立 iframe（如 shared.example.com/bridge.html）作为消息代理。
立即学习“前端免费学习笔记（深入）”；
- 各子域页面嵌入同一个
shared.example.com/bridge.htmliframe - 所有子域通过
window.frames[0].postMessage(data, 'https://shared.example.com')向 iframe 发送消息 - iframe 监听
message事件，验证event.origin后，广播给其他已注册的子域窗口 - 各子域监听自身
window的message，按需更新本地 localStorage 或触发业务逻辑
服务端统一管理：把状态“上收”，前端只做读写代理
对安全性、一致性要求高的场景（如用户权限、购物车、实时协作），应避免前端跨域存储同步，改由服务端提供统一状态接口。
- 所有子域前端通过
fetch调用https://api.example.com/v1/storage?key=xxx读写数据，身份校验走统一鉴权（如 JWT） - 前端将服务端返回的数据缓存至本地 localStorage，仅作降级或离线展示，不作为唯一信源
- 配合 WebSocket 或 Server-Sent Events，服务端可在状态变更时主动推送更新，各子域响应后刷新本地缓存
不复杂但容易忽略：关键不在“怎么共享”，而在“为什么共享”和“谁负责一致性”。优先用服务端兜底，谨慎使用跨域前端方案，始终以同源策略为安全边界。
