一点背景：
有问题的webapp有一个主窗口,然后是从主窗口产生的子窗口,可以在子窗口中完成沙盒“工作”.我无法控制这方面的实施.
用例：
在用户决定单击“确定”以在服务器上保留数据之前,每个子窗口都可以输入相当大量的信息.
我考虑/试过的事情：
>如果存在未保存的工作,则通过从onbeforeunload事件处理程序返回字符串来进行简单的关闭确认. (问题：我的团队负责人不愿意允许特定于浏览器的“警报对话框”在webapp中.据他说：用户体验依赖于那个看起来丑陋的对话框.)
>在onpageunload事件期间触发的AJAX请求将数据发送回服务器. (问题：由于永远不会调用XHR回调,我发现有些浏览器会打开连接,然后随机尝试触发打开的未来窗口的回调.)
> onpageunload事件期间触发的同步AJAX请求. (问题：忽略这样一个事实,包括我在内的人往往讨厌这样做以及它被弃用并将在未来删除的事实…… UI可能会长时间挂起等待AJAX请求完成,如果他们失去互联网,可能无限期.)
>定期保存页面内容,或附加onchange / onblur / onwhateverelse事件处理程序. (问题：与上面和下面更“懒惰”的实现相比,大量的编码开销.)
>使用localStorage将更改的字段保留在客户端的计算机上,直到它们实际将其工作提交到服务器. (问题：浏览器支持……这需要支持尽可能多的地方支持XHR.客户端存储是否有广泛的支持？我认为如果我没有弄错的话会有一点差距.)
提前感谢您的意见.
解决方法
我开发了一些逻辑,它在页面加载时注册onchange / onkeypress事件处理程序,其中节点由某个属性标识(在本例中为data-save-state =“true”).
为了利用这一点,从主窗口启动的每个“子窗口”的开发人员的唯一要求是使用我的新javascript Saver模块注册他们希望将数据保存到的URI.
标识的元素的值被序列化并作为JSON对象发送到Saver.一旦没有检测到1000毫秒的进一步变化,Saver负责排队多组请求并将它们作为一组发送到服务器.
对于那些必须开发这种能力的人来说,这是一个更大的开销,但现在它已经存在,其他团队成员很容易集成到他们的代码中.
就丢失数据的可能性而言,现在唯一的风险是在将保存请求发送到服务器之前的第二个时间.这个解决方案对我来说似乎非常像“Google Docs”.
