如何使客户端代码在页面刷新时工作

Question

我需要为web客户端推送通知，但问题是推送通知不会在页面刷新时留在屏幕上。我应该如何使它在屏幕上提供了一个定义的时间没有写入数据库?

客户端

socket.on('notification', function (data) {
    //console.log(data.message);
    $('#pushnotif').html(data.message);
     socket.emit('other', data);
    });

服务器端

function sendMessage(message) {
    io.sockets.volatile.emit('notification', {'message': message});
    console.log("abc");
}

Answer 1

推送通知被丢弃，因为当刷新浏览器窗口时，当前状态(包括整个DOM)被丢弃。您需要在服务器端或客户端持久化消息。

如果您已经使用会话的形式，您可以将消息写入您的活动会话。或者，如果您已经在提交通知之前的某个时刻存储了通知，那么您可以简单地延迟从该存储中删除它们(要么是一段时间，要么是直到用户取消它们，将事件发送回服务器)，并在每个初始连接上重新发送所有存储的通知。

但是因为你说你想避免写入数据库，我认为这是不可能的。

在客户端存储状态的传统解决方案是使用cookie 。您也可以通过操作document.cookie在客户端设置cookie，但这有点难看。 更现代的方法是使用localStorage(大多数现代浏览器支持的特定于域和端口的键值存储)或它的同类。如果你不想依赖HTML5支持(例如，你正在处理IE6用户)，那么有很多解决方案提供了各种等价的广泛抽象。请注意，使用IE8及以下版本的存储空间可能非常有限，所以要小心转储的数据类型。

如果你愿意限制对现代web浏览器用户的支持，并希望继续使用jQuery，甚至有一个jQuery插件，它提供了一个围绕localStorage和sessionStorage的包装器。