13

我想要一种在客户端上存储信息的方法，我的站点的 SSL 和非 SSL 版本都可以访问该信息。localStorage 是一个很棒的机制，但它只能被当前协议访问。

我希望能够通过 javascript 在我网站的非 ssl(http) 部分存储一条信息，并在我网站的 SSL (https) 部分访问它。

有谁知道在 ssl 和非 ssl 页面之间共享存储的客户端信息的好方法？

我知道我总是可以默认使用 cookie.. 但我讨厌必须为每个请求来回发送 cookie 的想法。

4

3 回答 3

10

根据导致此答案的评论编译；我欢迎@jeremyisawesome 编辑他的最终技巧：

第一选择：使用 SSL，在所有方面。许多用户都希望这样做，并且它（除了资源使用量较高）几乎在所有方面都是一个更好的选择。这也是微不足道的解决方案。

可悲的是，“因为管理”通常是一个正当的理由，虽然您可以尝试以“额外的安全性永远不会伤害任何人”或其他任何理由来出售它，但真正的解决方案将是首选。

我提出以下建议：复制 DOM 存储，并使用 cookie（具有最少数据）、AJAX 和哈希函数的组合来检查 DOM 存储是否需要更新。确切的实现细节取决于你有多少数据，它改变的频率，以及用户切换的频率，但基本的想法是这样的：

  1. 将数据连同其哈希一起保存到 DOM。
  2. 在 cookie 中发送哈希而不是完整数据。
  3. JS 检查 cookie 哈希和 DOM 数据是否匹配。
  4. 如果确定 DOM 已过期，则使用 AJAX 为 DOM 获取新数据，并异步更新。

使用安全会话 cookie 在 HTTP 和 HTTPS 页面之间切换——讨论了许多与切换相关的漏洞，但那里有一些有用的东西。

于 2013-08-18T03:40:49.410 回答
8

localStorage / sessionStorage ssl / non-ssl 在生产中共享

我这样做的方法是使用一个 iframe，它对其父级执行 postMessage。iframe 始终在 https 上，但父级可以是 http 或 https。此解决方案假设修改仅在 SSL 上存储到存储并将其同步回非 SSL，但您可以调整它以双向发送修改，以便非 ssl 父级将更改向下发送到 ssl 子级。

ssl iframe 源 (storage-sync.html):

if (sessionStorage.cart)
  try {
    var obj = { cart: JSON.parse(sessionStorage.cart) };
    parent.postMessage(JSON.stringify(obj), 'http://yourdomain.com');
  } catch(ex) {
    console.log(ex);
  }

ssl/非 ssl 父源：

window.addEventListener('message', function(ev) {
  if (ev.origin !== 'https://yourdomain.com')
    return;
  try {
    var obj = JSON.parse(ev.data);
    sessionStorage.cart = JSON.stringify(obj.cart);
    cart.reload();
  } catch(ex) {};
});

$('body').append('<iframe style="display:none" src="https://yourdomain.com/storage-sync.html?r=' + Math.random() + '"></iframe>');

将目标来源放置到正确的协议可确保您不会将消息发送到错误的协议。

于 2015-12-16T00:18:47.723 回答
5

这在技术上是不可能的，因为 http 因为 https 方案被认为是不同的来源以及浏览器具有的无混合内容限制（现在也在 Firfox 中）。

从规格（网络存储）：

4.3.1 安全

每当由 localStorage 属性返回的 Storage 对象的任何成员被有效脚本来源与具有 localStorage 属性的 Window 对象的 Document来源不同的脚本访问时，用户代理必须抛出 SecurityError 异常访问。

那么什么是起源 - 让我们看看 CORS（跨源资源共享），它指出：

...origin 由 [..]方案、主机名和端口组成。

进一步：

不允许 https 到 http。

于 2013-08-08T04:01:06.527 回答