Question

当有新帖子时，很多网站都有通知系统。

例如，

stackoverflow中的

enter image description here

LinkedIn中的

enter image description here

单击此页面后，页面将重新加载。

我想在我的应用程序中实现这种系统。因此，当在数据库中添加新项目时，显示此类通知，以及用户单击时。重新加载页面。

有没有人知道这种通知是如何工作的以及我们如何实现它？关于此的任何帖子或想法都会有所帮助。

此外，如果有人认为此问题可以包含更多标签，请随时添加。

Answer 1

快速了解如何做到这一点。

客户端自动刷新并使用ajax post获取内容。

<h2>Notification</h2>
<div id="divNotif" style="display:none;"></div>

<script id="sessionJs" type="text/javascript">
    function GetNotification() {
        $.ajax({
            type: "GET",
            url: '@Url.Action("GetNotification", "Notification")',
                dataType: "html",
                success: function (data) {
                    $("#divNotif").html(data);
                    $("#divNotif").fadeIn('slow');

                    setTimeout(function () { GetNotification(); }, 5000); //change timeout duration here
                },
                error: function (data) {
                    //alert("BAD:" + data.statusText);
                }
       });
    }

   GetNotification();
</script>

控制器返回json

    [HttpPost]
    public ActionResult GetNotification()
    {
        int notifCount = fromDb.NotificationCount;
        return Content("<span>New notification " + notifCount + "</span>", "text/html"); // returning a PartialView would be better one
    }

Answer 2

Ashwini Vermas回答使用轮询而不是pub / sub。它会增加流量并增加Web服务器的压力等。请改用SignalR。

我会在消息总线上发布所有系统事件，然后客户端可以使用此库订阅它们

https://github.com/AndersMalmgren/SignalR.EventAggregatorProxy

这是一个演示

https://github.com/AndersMalmgren/SignalR.EventAggregatorProxy/tree/master/SignalR.EventAggregatorProxy.Demo.MVC4

disclamier：我是图书馆的作者

Stackoverflow，Linkedin就像有新活动时的通知一样

2 个答案: