不能直接访问不同域名下的 localStorage。

localStorage 受 同源策略（Same-Origin Policy, SOP） 限制，只有 相同协议（protocol）、相同域名（host）、相同端口（port） 的页面才能访问相同的 localStorage 数据。

如何在不同域名间共享 localStorage？

虽然浏览器不允许直接跨域访问 localStorage，但可以通过以下几种方式间接实现数据共享：

方法 1：使用 postMessage 进行跨域通信（推荐）

可以使用 iframe 嵌入目标域，并使用 window.postMessage() 在不同域之间传递 localStorage 数据。

步骤：

1. 在被访问的页面（A 页面）上创建一个 iframe，指向另一个域（B 页面）。

2. A 页面发送 postMessage 请求，要求 B 页面返回 localStorage 数据。

3. B 页面接收到 message 事件后，读取 localStorage 并返回数据。

复制 1// A 页面（请求 localStorage 数据）
 2const iframe = document.createElement('iframe');
 3iframe.src = "https://another-domain.com";
 4document.body.appendChild(iframe);
 5 
 6iframe.onload = function () {
 7  iframe.contentWindow.postMessage("getLocalStorage", "https://another-domain.com");
 8};
 9 
10window.addEventListener("message", (event) => {
11  if (event.origin === "https://another-domain.com") {
12    console.log("Received localStorage data:", event.data);
13  }
14});

复制 1// B 页面（返回 localStorage 数据）
 2window.addEventListener("message", (event) => {
 3  if (event.origin === "https://your-main-domain.com" && event.data === "getLocalStorage") {
 4    event.source.postMessage(localStorage.getItem("yourKey"), event.origin);
 5  }
 6});

优点：安全、受控，仅允许特定域名访问数据。

方法 2：使用后端 API 共享数据

如果前端不同域名无法直接共享 localStorage，可以让前端请求同一台服务器，并由服务器存储和管理用户数据。

示例：

• A 网站存储 localStorage 数据，并通过 API 发送到后端。

• B 网站从后端 API 读取数据，而不是直接访问 localStorage。

复制 1// A 网站：存储 localStorage 到后端
 2fetch("https://api.example.com/storeData", {
 3  method: "POST",
 4  headers: { "Content-Type": "application/json" },
 5  body: JSON.stringify({ key: "user", value: localStorage.getItem("user") })
 6});

复制 1// B 网站：从后端获取数据
 2fetch("https://api.example.com/getData?key=user")
 3  .then(response => response.json())
 4  .then(data => {
 5    localStorage.setItem("user", data.value);
 6  });

优点：适用于大规模共享，数据可以长期存储。
缺点：需要后端支持。

方法 3：使用同一 document.domain（仅适用于子域共享）

如果两个域是同一个主域（如 a.example.com 和 b.example.com），可以通过 document.domain 共享 localStorage。
但 现代浏览器已不推荐此方法，并且 localStorage 仍然是独立的。

---

总结

方法	适用场景	优点	缺点
postMessage + iframe	需要在前端跨域共享数据	无需服务器，浏览器支持好	需要 iframe，较复杂
后端 API 共享数据	多个域名需要共享数据	灵活、安全，可存储长期数据	需要后端开发
document.domain	仅适用于同一主域的子域共享	简单易用	现代浏览器不推荐

推荐方式：

• 如果是前端跨域共享 localStorage，推荐 postMessage + iframe。

• 如果是多个网站需要共享数据，推荐 后端 API 方案。