【js-06】登录之后，在其他页面怎么判断是否已经登录？

               小课堂【武汉第129期】
                 分享人：张增锋

1.背景介绍

当我们在网页中向服务器请求信息时，一般发送http请求，但是HTTP协议是无状态协议，无状态是指协议对于事务处理没有记忆能力，一旦数据交换完毕，客户端与服务器端的连接就会关闭，再次交换数据需要建立新的连接。

这就意味着服务器无法从连接上跟踪会话。那当我们在一个网站登录之后，在网站其他页面怎么判断是否已经登录？要跟踪该会话，必须引入一种机制。

2.知识剖析

cookie

cookie指的是储存在用户本地终端上的数据，它是由Web服务器创建的，当客户端第一次请求服务器，如果服务器需要记录该用户状态，就使用response向客户端浏览器颁发一个Cookie。客户端浏览器会把Cookie保存起来。当浏览器再请求该网站时，浏览器把请求的网址连同该Cookie一同提交给服务器。服务器检查该Cookie，以此来辨认用户状态。服务器还可以根据需要修改Cookie的内容。Cookie在生成时就会被指定一个Expire值，这就是Cookie的生存周期，在这个周期内Cookie有效，超出周期Cookie就会被清除。有些页面将Cookie的生存周期设置为“0”或负值，这样在关闭浏览器时,就马上清除Cookie，不会记录用户信息，更加安全。用户也可以在浏览器端进行设置，禁止服务器向客户端浏览器颁发一个Cookie。我们可以在脚本中读取，创建和存储 cookie;例如下面的代码会输出本页面所有的Cookie。document.write(document.cookie)

Session

Session是服务器端技术，利用这个技术，服务器在运行时可以为每一个用户的浏览器创建一个其独享的session对象，由于session为用户浏览器独享，所以用户在访问服务器的web资源时，可以把各自的数据放在各自的session中，当用户再去访问服务器中的其它web资源时，其它web资源再从用户各自的session中取出数据为用户服务。

Session的使用比Cookie方便，但是过多的Session存储在服务器内存中，会对服务器造成压力。虽然Session保存在服务器，对客户端是透明的，它的正常运行仍然需要客户端浏览器的支持。这是因为Session需要使用Cookie作为识别标志。HTTP协议是无状态的，Session不能依据HTTP连接来判断是否为同一客户，因此服务器向客户端浏览器发送一个名为JSESSIONID的Cookie，它的值为该Session的id（也就是HttpSession.getId()的返回值）Session依据该Cookie来识别是否为同一用户。

Web Storage

WebStorage是HTML5中本地存储的解决方案之一。Web Storage实际上由两部分组成:sessionStorage与localStorage。localStorage和sessionStorage。localStorage用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。sessionStorage存储的数据只在会话期间有效，关闭浏览器则自动删除。所以，在其它页面保持登录，可以在登录后往本地storage中存储一个关键字段（存储用户信息）,如 :login：true

在路由变化的时候，或者在页面跳转的时候，检测是该字段值是否正确，不正确则跳转登录页；点击注销可以执行删除

3.常见问题

Cookies包含了一些敏感信息：用户名，计算机名，使用的浏览器和曾经访问的网站,在某种程度上说已经严重危及用户的隐私和安全。

4.解决方案

下面方法能增加安全性：

1.设置该 Cookie 不能被脚本读取；

2.对 Cookie 内容进行加密，在加密前嵌入时间戳，保证每次加密后的密文都不一样（并且可以防止消息重放）；

3.客户端请求时，每次或定时更新 Cookie 内容；

4.每次向 Cookie 写入时间戳，数据库需要记录最后一次时间戳；客户端提交 Cookie 时，先解密然后校验时间戳，时间戳若小于数据数据库中记录，即意味发生攻击。

5.编码实战

6.扩展思考

Web Storage相对于cookie的优势

1.从容量上讲WebStorage一般浏览器提供5M的存储空间，用来存储视频、图片神马的不够，但对于绝大部分操作足矣

2.安全性上WebStorage并不作为HTTP header发送的浏览器，所以相对安全。

3.从流量上讲，因为WebStorage不传送到服务器，所以不必要的流量可以节省。

7.参考文献

参考一：HTML5 WebStorage

参考二：360百科

参考三：Nancy的专栏

8.更多讨论

存储方案各自的性能如何，他们的区别？