如何在不同子域之间共享本地存储？

Question

我们在相同的域但有不同的子域中有两个单独的网站/应用程序。

例如

https://hello.website.com (Webapp 1)
https://world.website.com (Webapp 2)

[我们想要在Webapp 1上登录用户，并登录并单击Webapp 1中的按钮，我们希望将用户重定向到Webapp2。但是，Webapp 2需要相同的身份验证令牌，当前存储在Webapp 1的本地存储中。如何使本地存储内容可用于Webapp 2？

或者还有更好的方法吗？

Answer 1

这是localstorage和sessionstorage的限制。你不能iframe有一些解决方法，但是这些解决方法既不完善也不安全。您应该使用具有适当域属性domain=example.com的Cookie。您可能还想阅读以下关于Cookie与本地存储安全性的答案：https://stackoverflow.com/a/54258744/1235935

Answer 2

由于域不同，不可能将信息从其中一个的本地存储传输到另一个域。[[直接，但是由于这些站点位于HTTPS上，因此应该安全且容易地发送身份验证令牌作为搜索参数。例如，重定向时，而不是重定向到https://world.website.com，而是使用https://hello.website.com的当前身份验证令牌并附加它，then redirect：

const url = 'https://world.website.com?token=' + authToken;
window.location.href = url;

（（如果身份验证令牌中可能包含特殊字符，则可能需要先对其进行转义）
然后，在另一个域上，检查搜索参数中是否有token，如果存在，则将其提取并保存到localStorage：
const paramsMatch = window.location.href.match(/\?.+/);
if (paramsMatch) {
  const params = new URLSearchParams(paramsMatch[0]);
  const authToken = params.get('token');
  if (authToken) {
    localStorage.authToken = authToken;
  }
}

由于域位于HTTPS上，因此将令牌放入URL is safe-窃听者将无法看到它。