基于cookie登陆验证与退出的示例分析

这篇文章主要为大家展示了“基于cookie登陆验证与退出的示例分析”，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下“基于cookie登陆验证与退出的示例分析”这篇文章吧。

看到信息里面有这样一条疑问：

是一个关于关于cookie登陆退出的问题。问题原文为：怎么实现退出登陆，页面跳转到登陆页面，前端登陆后，后端返回字段设置cookie 就可以实现身份认证，但是这个cookies 应该是设置了httponly 字段，不允许前端js操作的，那点击退出按钮怎么应该做什么

首先先解决这样一个疑问，就是不论cookie有没有设置httponly属性，登陆或者退出时候的cookie都不应该由js来操作。具体原因后面会说。

网站发送登陆请求之后，在响应头中通过Set-Cookie来设置cookie，浏览器接收到响应后，会将Set-Cookie中的cookie信息存储到浏览器，如图：

此时查看浏览器的application 如图：

这是登陆的情况，那退出呢？这时有些朋友认为，点击退出按钮，或者进行退出操作，直接调用js删除cookie不就可以了吗，一般的项目中是不会这样操作的，删除cookie也是通过后端来实现。既然后端可以通过Set-Cookie设置cookie，那么也应该可以通过Set-Cookie删除cookie，所以一般的项目接口文档中都会有一个退出接口api。

当前端向这个退出api发送请求时，响应头中的Set-Cookie一般会将登陆时设置的cookie（PHPSESSID）的expires属性设置成一个过期时间。这样浏览器解析这个Set-Cookie时就将PHPSESSID删除掉了。

当向这个退出接口发送信息的时候，看看network会响应什么呢，如图：

再看看appliaction的显示结果：

那为什么不可以用前端的js删除cookie呢，这里就涉及到了session信息，当你登陆网站后，后端服务器将一个cookie返回给前端，并且会在后端数据库存储一个cookie，这两个cookie是相同的，每次退出后两个cookie都应该删除，这就需要前端向后端发送一个删除cookie的请求，服务器接受到请求后删除cookie，并在响应头中设置如下信息。

Set-Cookie:PHPSESSID=deleted; expires=Thu, 01-Jan-1970 00:00:01 GMT; path=/

浏览器接受到以上信息，根据expires字段信息判断cookie过期（1970年就过期了），将cookie删除。这样两个cookie就都删除了。

如果只是用前端js将cookie手动清除，后端依然保存着cookie，造成资源浪费，当然还有一些其他的弊端，这里不做赘述。

以上是“基于cookie登陆验证与退出的示例分析”这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注亿速云行业资讯频道！