vue清除浏览器全部cookie的问题及解决方法(绝对有效!)
更新时间：2023年06月19日 11:56:44 作者：byte_麻雀.
最近项目要实现关闭浏览器清除用户缓存的功能,下面这篇文章主要给大家介绍了关于vue清除浏览器全部cookie的问题及解决方法,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
请仔细观察你的浏览器cookie~
1、问题描述
我们在日常开发中，有本地调试，有多个服务器的线上调试部署。从中我观察到，每次使用同一浏览器，如果再次登录时我们没有清理缓存，会有很多匪夷所思的问题。比如：token在cookie里保存，导致登录失效。多个角色登录时明明token已经更新，但使用的还是旧的token导致登录失败等等…
2、思路以及遇到问题
然后我就想到了一个简单粗暴的方法，在单点登录时直接删除全部cookie然后获取新的token，但是出现了删除不了全部，只能删除当前域（本地）的cookie…
3、问题解决（晒出全部代码以及注释）
（1）问题的核心原因：
不同域（domain）无法全部清除
（2）解决问题的全部代码与注释：
delAllCookie() {
//清空全部cookie
var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
if (keys) {
for (var i = keys.length; i--; ) {
document.cookie =
keys[i] + "=0;path=/;expires=" + new Date(0).toUTCString(); //清除当前域名下
document.cookie =
keys[i] +
"=0;path=/;domain=" +
document.domain +
";expires=" +
new Date(0).toUTCString();
document.cookie =
keys[i] +
"=0;path=示例：/index.vue（不同域的path,也就是你清除不了的cookie）;domain=示例：10.10.10.208（不同域的domain,也就是你清除不了的cookie）;expires=" +
new Date(0).toUTCString();
**document.cookie可加多条！！！！**
}
}
},4、总结问题
描述问题时看似简单，但其实在排查现实问题时也是需要清晰思路的，它会造成很多*疼的问题。当然在我们不同的现实开发场景，具体问题具体分析。
到此这篇关于vue清除浏览器全部cookie的问题及解决方法的文章就介绍到这了,更多相关vue清除浏览器全部cookie内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
这篇文章主要介绍了vue使用插槽分发内容slot的用法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-03-03
这篇文章主要介绍了vue实现输入框的模糊查询的示例代码（节流函数的应用场景），文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-09-09
这篇文章主要介绍了vue点击导航页面实现自动滚动到特定位置方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
Element Plus 日期选择器获取选中的日期格式(当前日期/时间戳格式）
如果想要获取选中的日期时间就需要通过,Element Plus 日期选择器 format属性和value-format属性,format指定输入框的格式,value-format 指定绑定值的格式,本篇文章就给大家介绍Element Plus 日期选择器获取选中的日期格式(当前日期/时间戳格式）,感兴趣的朋友一起看看吧2023-10-10
在Vue3架构里,v-slot 作为作用域插槽的关键支撑,重塑了父子组件间数据与方法传递的范式,本文主要来和大家剖析一下v-slot的相关特性,需要的可以了解下2025-01-01
Vue使用babel-polyfill兼容IE解决白屏及语法报错问题
这篇文章主要介绍了Vue使用babel-polyfill兼容IE解决白屏及语法报错问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-03-03
这篇文章主要给大家介绍了关于vue中v-model失效原因以及解决方案的相关资料,vue的v-model是一个双向绑定的数据流,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-07-07
这篇文章主要给大家介绍了Vue3中el-table表格数据不显示的原因和解决方法,文中有详细的代码示例供大家参考,如果有遇到相同问题的朋友可以参考阅读本文,希望能够帮到您2023-11-11
configureWebpack、chainWebpack配置vue.config.js方式
这篇文章主要介绍了configureWebpack、chainWebpack配置vue.config.js方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-01-01
这篇文章主要介绍了vue如何自定义按钮单选和多选问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2023-07-07
最新评论