我正在寻找一种方法,如何在浏览器中的多个选项卡或窗口之间进行通信(在同一个域上,而不是CORS),而不留痕迹.有几个解决方案:
第一个可能是最糟糕的解决方案 - 你需要从当前窗口打开一个窗口,然后只要你打开窗户就可以进行通信.如果您在任何窗口中重新加载页面,则很可能会丢失通信.
第二种方法,使用postMessage,可能启用跨源通信,但遇到与第一种方法相同的问题.您需要维护一个窗口对象.
第三种方式,使用cookie,在浏览器中存储一些数据,这可以有效地看起来像向同一域上的所有窗口发送消息,但问题是你永远不知道所有标签是否已经读过"消息"打扫干净.您必须实现某种超时以定期读取cookie.此外,您受限于最大cookie长度,即4KB.
使用localStorage的第四种解决方案似乎克服了cookie的限制,甚至可以使用事件进行监听.接受的答案中描述了如何使用它.
编辑2018:接受的答案仍然有效,但现代浏览器有一个更新的解决方案,使用BroadcastChannel.有关如何使用BroadcastChannel在选项卡之间轻松传输消息的简单示例,请参阅其他答案.
我正在尝试使用localStorage将值从一个页面传递到另一个页面.两个页面都使用通用的JS文件来获取/设置localStorage的值.此页面使用localStorage.setItem('key', 'value')以下内容正确设置值:http://example.com/path/index.html
ip从查询字符串中解析并使用密钥写入localStorage db_ip.
当我尝试localStorage.getItem('db_ip')在此页面上执行操作时,该项目不存在:http://www.example.com/path/page.html
我正在阅读说"每个Document对象的Window对象的localStorage属性的Storage对象与相同的存储区域相关联"的规范,所以这让我觉得通过拥有不同的Storage对象,页面可以有单独的localStorage.
我可以看到两个页面之间的Storage对象不同.如何让两个页面使用相同的存储对象？