网站设计：让你的网站"心跳"起来-职坐标

网站设计：让你的网站"心跳"起来

安安 2017-09-20 来源：网络阅读 1431 评论 0

摘要：本篇网站设计教程将为大家讲解让你的网站"心跳"起来，看完这篇文章会让你对网站设计的知识点有更加清晰的理解和运用。

本篇网站设计教程将为大家讲解让你的网站"心跳"起来，看完这篇文章会让你对网站设计的知识点有更加清晰的理解和运用。

有时候你希望你的页面“一直活着”。也就是说，如果一个用户填写一个复杂的表单，在用户完成之前。你一定不希望session过期。否者用户可能因此变得非常恼怒。
这也不是简单的加长session过期时间的事情。如果你这样做，当访问页面的用户离开这个网站，session将会仍旧存活在服务器的内存中很长一段时间。增加session过期时间是一个解决办法，但是它不是一个很好的解决办法。
我的目标是：一旦网页在客户端被打开，session就一直激活。即使没有任何回发来重设session的时间。当网页关闭的时候，session将自然结束。
我这样来实现这个解决方案：在客户端每隔一段时间就去"ping"服务端，这个时间少于session的过期时间。这就是Heartbeat设计模式。
麻烦的设置：
为了达到测试的目的。我在web.config中设置session超时时间为2分钟。

1 <system.web>
2   <sessionState timeout="2">
3   </sessionState>
4  </system.web>

为了追踪具体发生了什么，使用一个公用的函数ODS（在MiscUtilities类中）

1 // ---- ODS (Output Debug String) ----------------------
2 public static void ODS(string Msg)
3 {
4 String Out = String.Format("{0} {1}", DateTime.Now.ToString("hh:mm:ss.ff"), Msg);
5 System.Diagnostics.Debug.WriteLine(Out);
6 }
7

为了观察session的状态事件，我在global.asax中添加用于调试的字符串。

1 <%@ Application Language="C#" %>
2 <script RunAt="server">
3
4     void Application_Start(object sender, EventArgs e)
5     {
6         MiscUtilities.ODS("****ApplicationStart");
7     }
8     void Session_Start(object sender, EventArgs e)
9     {
10         MiscUtilities.ODS("Session_Start");
11     }
12     void Session_End(object sender, EventArgs e)
13     {
14         MiscUtilities.ODS("Session_End");
15     }
16

下面是详细步骤：由于我们需要在服务端有一个方法供客户端调用。故使用一个WebMethod方法。
1、在页面上我们必须有一个ScriptManager
2、ScriptManager 的EnablePageMethods 必须设置成true
3、WebMethod 方法必须是public和static的
4、WebMethod 方法必须将EnableSession属性设置成true

1 <asp:ScriptManager ID="ScriptManager1" runat="server"
2 EnablePageMethods="true">
3 </asp:ScriptManager>

1 public partial class _Default : System.Web.UI.Page
2 {
3     [WebMethod(EnableSession=true ) ]
4     public static void PokePage()
5     {
6         // called by client to refresh session
7         MiscUtilities.ODS("Server: I am poked");
8     }
9

我们需要有一个客户端的JavaScript定时地去调用服务端的方法。

1 <script type="text/javascript">
2     var HeartBeatTimer;
3     function StartHeartBeat()
4     {
5         // pulse every 10 seconds
6         if (HeartBeatTimer == null)
7             HeartBeatTimer = setInterval("HeartBeat()", 1000 * 10);
8     }
9     function HeartBeat()
10     {
11         // note: ScriptManger must have: EnablePageMethods="true"
12         Sys.Debug.trace("Client: Poke Server");
13         PageMethods.PokePage();
14     }
15 <body id="MyBody"  onload="StartHeartBeat();">
16

没有"心跳"的，输入如下：

1 10:22:43.03 ****ApplicationStart
2 10:22:45.13 Session_Start
3 10:25:00.00 Session_End

有"心跳"的，输出如下：

1 10:26:06.10  ****ApplicationStart
2 10:26:08.05  Session_Start
3 Client: Poke Server
4 10:26:18.93  Server: I am poked
5 Client: Poke Server
6 10:26:28.95  Server: I am poked
7 Client: Poke Server
8 10:26:38.96  Server: I am poked
9 Client: Poke Server
10 10:26:48.98  Server: I am poked
11
12     . . . (lines deleted)
13
14 Client: Poke Server
15 10:29:59.45  Server: I am poked
16 Client: Poke Server
17 10:30:09.47  Server: I am poked
18 Client: Poke Server
19 10:30:19.48  Server: I am poked
20
21     . . . (lines deleted)
22