使用JavaScript清除所有cookie

如何使用JavaScript删除当前域的所有cookie ?

625118 次浏览
小开

据我所知，没有办法对域名上的任何cookie集进行全面删除。如果知道cookie的名称，并且脚本与cookie在同一个域中，则可以清除cookie。

你可以将值设置为空，过期日期设置为过去的某个时间:

var mydate = new Date();
mydate.setTime(mydate.getTime() - 1);
document.cookie = "username=; expires=" + mydate.toGMTString();

有一个这里有很棒的文章用于使用javascript操作cookie。

小开

你可以通过查看文档得到一个列表。饼干变量。清除它们只是一个循环遍历所有它们并一个一个地清除它们的问题。

小开
最佳答案 
function deleteAllCookies() {
var cookies = document.cookie.split(";");


for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i];
var eqPos = cookie.indexOf("=");
var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
}
}

注意，这段代码有两个限制:

  • 它不会删除设置了HttpOnly标志的cookie，因为HttpOnly标志禁止Javascript访问cookie。
  • 它不会删除已设置为Path值的cookie。(尽管这些cookie会出现在document.cookie中，但如果不指定与设置cookie时相同的Path值，就不能删除它。)
小开

在经历了一些挫折之后，我自己拼凑了这个函数，它将尝试从所有路径中删除一个命名的cookie。只需为每个cookie调用这个函数，就可以更接近于删除每个cookie。

function eraseCookieFromAllPaths(name) {
// This function will attempt to remove a cookie from all paths.
var pathBits = location.pathname.split('/');
var pathCurrent = ' path=';


// do a simple pathless delete first.
document.cookie = name + '=; expires=Thu, 01-Jan-1970 00:00:01 GMT;';


for (var i = 0; i < pathBits.length; i++) {
pathCurrent += ((pathCurrent.substr(-1) != '/') ? '/' : '') + pathBits[i];
document.cookie = name + '=; expires=Thu, 01-Jan-1970 00:00:01 GMT;' + pathCurrent + ';';
}
}
和往常一样，不同的浏览器有不同的行为，但这对我来说很有效。 享受。< / p >
小开

我想分享一下清除cookie的方法。也许这在某些时候对其他人是有帮助的。

var cookie = document.cookie.split(';');


for (var i = 0; i < cookie.length; i++) {


var chip = cookie[i],
entry = chip.split("="),
name = entry[0];


document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}
小开

简单。得更快。

function deleteAllCookies() {
var c = document.cookie.split("; ");
for (i in c)
document.cookie =/^[^=]+/.exec(c[i])[0]+"=;expires=Thu, 01 Jan 1970 00:00:00 GMT";
}
小开

如果你可以访问jquery.cookie插件，你可以这样擦除所有的cookie:

for (var it in $.cookie()) $.removeCookie(it);
小开

一个衬套

以防你想快速粘贴进去…

document.cookie.split(";").forEach(function(c) { document.cookie = c.replace(/^ +/, "").replace(/=.*/, "=;expires=" + new Date().toUTCString() + ";path=/"); });

和bookmarklet的代码:

javascript:(function(){document.cookie.split(";").forEach(function(c) { document.cookie = c.replace(/^ +/, "").replace(/=.*/, "=;expires=" + new Date().toUTCString() + ";path=/"); }); })();
小开 
//Delete all cookies
function deleteAllCookies() {
var cookies = document.cookie.split(";");
for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i];
var eqPos = cookie.indexOf("=");
var name = eqPos > -1 ? cookie.substr(0, eqPos) : cookie;
document.cookie = name + '=;' +
'expires=Thu, 01-Jan-1970 00:00:01 GMT;' +
'path=' + '/;' +
'domain=' + window.location.host + ';' +
'secure=;';
}
}
小开

这里有一个清除所有路径和域的所有变体(www.mydomain.example， mydomain.example等)中的所有cookie:

(function () {
var cookies = document.cookie.split("; ");
for (var c = 0; c < cookies.length; c++) {
var d = window.location.hostname.split(".");
while (d.length > 0) {
var cookieBase = encodeURIComponent(cookies[c].split(";")[0].split("=")[0]) + '=; expires=Thu, 01-Jan-1970 00:00:01 GMT; domain=' + d.join('.') + ' ;path=';
var p = location.pathname.split('/');
document.cookie = cookieBase + '/';
while (p.length > 0) {
document.cookie = cookieBase + p.join('/');
p.pop();
};
d.shift();
}
}
})();
小开

我发现IE和Edge有问题。Webkit浏览器(Chrome, safari)似乎更宽容。当设置cookie时，总是将“路径”设置为某个内容，因为默认将是设置cookie的页面。因此，如果你试图在不同的页面上过期，而没有指定“路径”，路径将不匹配，它将不会过期。document.cookie值不显示cookie的路径或过期时间，因此不能通过查看该值推导出cookie的设置位置。

如果你需要让不同页面的cookie过期，在cookie值中保存设置页面的路径，以便以后可以将其取出，或者总是将"; path=/;"附加到cookie值中。然后它将从任何页面过期。

小开

下面是在JavaScript中删除所有cookie的一个简单代码。

function deleteAllCookies(){
var cookies = document.cookie.split(";");
for (var i = 0; i < cookies.length; i++)
deleteCookie(cookies[i].split("=")[0]);
}


function setCookie(name, value, expirydays) {
var d = new Date();
d.setTime(d.getTime() + (expirydays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = name + "=" + value + "; " + expires;
}


function deleteCookie(name){
setCookie(name,"",-1);
}

运行函数deleteAllCookies()清除所有cookie。

小开

函数方法+ ES6

const cookieCleaner = () => {
return document.cookie.split(";").reduce(function (acc, cookie) {
const eqPos = cookie.indexOf("=");
const cleanCookie = `${cookie.substr(0, eqPos)}=;expires=Thu, 01 Jan 1970 00:00:00 GMT;`;
return `${acc}${cleanCookie}`;
}, "");
}

注意:不处理路径

小开

在测试了多种浏览器中列出的几乎所有方法后，我发现几乎没有一种方法能达到50%的效果。

如果需要，请帮忙纠正，但我要在这里发表我的意见。下面的方法分解了所有内容，基本上基于设置部分构建cookie值字符串，并包括路径字符串的一步一步构建，当然从/开始。

希望这对其他人有所帮助，我希望任何批评都能以完善这种方法的形式出现。起初，我想要一个简单的1-liner，因为有些人寻求，但JS cookie是那些不那么容易处理的事情之一。

;(function() {
if (!window['deleteAllCookies'] && document['cookie']) {
window.deleteAllCookies = function(showLog) {
var arrCookies = document.cookie.split(';'),
arrPaths = location.pathname.replace(/^\//, '').split('/'), //  remove leading '/' and split any existing paths
arrTemplate = [ 'expires=Thu, 01-Jan-1970 00:00:01 GMT', 'path={path}', 'domain=' + window.location.host, 'secure=' ];  //  array of cookie settings in order tested and found most useful in establishing a "delete"
for (var i in arrCookies) {
var strCookie = arrCookies[i];
if (typeof strCookie == 'string' && strCookie.indexOf('=') >= 0) {
var strName = strCookie.split('=')[0];  //  the cookie name
for (var j=1;j<=arrTemplate.length;j++) {
if (document.cookie.indexOf(strName) < 0) break; // if this is true, then the cookie no longer exist
else {
var strValue = strName + '=; ' + arrTemplate.slice(0, j).join('; ') + ';';  //  made using the temp array of settings, putting it together piece by piece as loop rolls on
if (j == 1) document.cookie = strValue;
else {
for (var k=0;k<=arrPaths.length;k++) {
if (document.cookie.indexOf(strName) < 0) break; // if this is true, then the cookie no longer exist
else {
var strPath = arrPaths.slice(0, k).join('/') + '/'; //  builds path line
strValue = strValue.replace('{path}', strPath);
document.cookie = strValue;
}
}
}
}
}
}
}
showLog && window['console'] && console.info && console.info("\n\tCookies Have Been Deleted!\n\tdocument.cookie = \"" + document.cookie + "\"\n");
return document.cookie;
}
}
})();
小开

这个答案受到第二个答案和W3Schools的影响

document.cookie.split(';').forEach(function(c) {
document.cookie = c.trim().split('=')[0] + '=;' + 'expires=Thu, 01 Jan 1970 00:00:00 UTC;';
});

似乎有效果

编辑:哇，几乎和扎克的Stack Overflow把它们放在一起的有趣方式一模一样。

编辑:NVM显然是暂时的

小开

Jquery:

var cookies = $.cookie();
for(var cookie in cookies) {
$.removeCookie(cookie);
}

香草JS

function clearListCookies()
{
var cookies = document.cookie.split(";");
for (var i = 0; i < cookies.length; i++)
{
var spcook =  cookies[i].split("=");
deleteCookie(spcook[0]);
}
function deleteCookie(cookiename)
{
var d = new Date();
d.setDate(d.getDate() - 1);
var expires = ";expires="+d;
var name=cookiename;
//alert(name);
var value="";
document.cookie = name + "=" + value + expires + "; path=/acc/html";
}
window.location = ""; // TO REFRESH THE PAGE
}
小开

我不知道为什么第一次投票的答案对我没用。

正如这个答案所说:

没有100%的方法可以删除浏览器cookie。

问题在于，cookie不仅是由它们的键“名称”唯一标识的，而且还由它们的“域”和“路径”唯一标识。

如果不知道cookie的“域”和“路径”，就不能可靠地删除它。通过JavaScript的document.cookie无法获得此信息。它也不能通过HTTP Cookie报头使用!

所以我的想法是添加一个Cookie版本控制，包括设置，获取，删除Cookie:

var cookie_version_control = '---2018/5/11';


function setCookie(name,value,days) {
var expires = "";
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days*24*60*60*1000));
expires = "; expires=" + date.toUTCString();
}
document.cookie = name+cookie_version_control + "=" + (value || "")  + expires + "; path=/";
}


function getCookie(name) {
var nameEQ = name+cookie_version_control + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
}


function removeCookie(name) {
document.cookie = name+cookie_version_control+'=; Max-Age=-99999999;';
}
小开

我有一些更复杂和面向oop的cookie控制模块。它还包含deleteAll方法来清除所有现有的cookie。请注意，这个版本的deleteAll方法有设置path=/，会导致删除当前域中的所有cookie。如果你只需要从某个范围删除cookie，你将不得不升级这个方法，我添加动态path参数到这个方法。

主要有Cookie类:

import {Setter} from './Setter';


export class Cookie {
/**
* @param {string} key
* @return {string|undefined}
*/
static get(key) {
key = key.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, '\\$1');


const regExp = new RegExp('(?:^|; )' + key + '=([^;]*)');
const matches = document.cookie.match(regExp);


return matches
? decodeURIComponent(matches[1])
: undefined;
}


/**
* @param {string} name
*/
static delete(name) {
this.set(name, '', { expires: -1 });
}


static deleteAll() {
const cookies = document.cookie.split('; ');


for (let cookie of cookies) {
const index = cookie.indexOf('=');


const name = ~index
? cookie.substr(0, index)
: cookie;


document.cookie = name + '=;expires=Thu, 01 Jan 1970 00:00:00 GMT;path=/';
}
}


/**
* @param {string} name
* @param {string|boolean} value
* @param \{\{expires?:Date|string|number,path?:string,domain?:string,secure?:boolean}} opts
*/
static set(name, value, opts = {}) {
Setter.set(name, value, opts);
}
}

Cookie setter方法(Cookie.set)相当复杂，所以我把它分解到其他类中。这里有一个代码:

export class Setter {
/**
* @param {string} name
* @param {string|boolean} value
* @param \{\{expires?:Date|string|number,path?:string,domain?:string,secure?:boolean}} opts
*/
static set(name, value, opts = {}) {
value = Setter.prepareValue(value);
opts = Setter.prepareOpts(opts);


let updatedCookie = name + '=' + value;


for (let i in opts) {
if (!opts.hasOwnProperty(i)) continue;


updatedCookie += '; ' + i;


const value = opts[i];


if (value !== true)
updatedCookie += '=' + value;
}


document.cookie = updatedCookie;
}


/**
* @param {string} value
* @return {string}
* @private
*/
static prepareValue(value) {
return encodeURIComponent(value);
}


/**
* @param \{\{expires?:Date|string|number,path?:string,domain?:string,secure?:boolean}} opts
* @private
*/
static prepareOpts(opts = {}) {
opts = Object.assign({}, opts);


let {expires} = opts;


if (typeof expires == 'number' && expires) {
const date = new Date();


date.setTime(date.getTime() + expires * 1000);


expires = opts.expires = date;
}


if (expires && expires.toUTCString)
opts.expires = expires.toUTCString();


return opts;
}
}
小开

这里的几个答案没有解决路径问题。我认为:如果你控制了网站，或者它的一部分，你应该知道所有使用的路径。所以你只需要让它删除所有路径上的cookie。 因为我的网站已经有jquery(出于懒惰)，我决定使用jquery cookie，但你可以很容易地适应纯javascript的基础上的其他答案

在这个例子中，我删除了电子商务平台正在使用的三个特定路径。

let mainURL = getMainURL().toLowerCase().replace('www.', '').replace('.com.br', '.com'); // i am a brazilian guy
let cookies = $.cookie();
for(key in cookies){
// default remove
$.removeCookie(key, {
path:'/'
});
// remove without www
$.removeCookie(key, {
domain: mainURL,
path: '/'
});
// remove with www
$.removeCookie(key, {
domain: 'www.' + mainURL,
path: '/'
});
};


// get-main-url.js v1
function getMainURL(url = window.location.href){
url = url.replace(/.+?\/\//, ''); // remove protocol
url = url.replace(/(\#|\?|\/)(.+)?/, ''); // remove parameters and paths
// remove subdomain
if( url.split('.').length === 3 ){
url = url.split('.');
url.shift();
url = url.join('.');
};
return url;
};

我把。com网站改为。com.br，因为我的网站是多域和多语言的

小开 
document.cookie.split(";").forEach(function(c) {
document.cookie = c.replace(/^ +/, "").replace(/=.*/, "=;expires=" + new Date().toUTCString() + ";path=/");
});
//clearing local storage
localStorage.clear();
小开

如果你只关心清除安全源上的cookie，你可以使用Cookie Store API和它的delete ()方法。

cookieStore.getAll().then(cookies => cookies.forEach(cookie => {
console.log('Cookie deleted:', cookie);
cookieStore.delete(cookie.name);
}));

访问Cookie Store API的caniuse.com表，检查浏览器支持。

小开

下面的代码将删除当前域内的所有cookie和所有尾随子域(www.some.sub.domain.example， .some.sub.domain.example， .sub.domain.example等等)。

单行的普通JS版本(我认为这是这里唯一一个没有使用cookie.split()的版本):

document.cookie.replace(/(?<=^|;).+?(?=\=|;|$)/g, name => location.hostname.split('.').reverse().reduce(domain => (domain=domain.replace(/^\.?[^.]+/, ''),document.cookie=`${name}=;max-age=0;path=/;domain=${domain}`,domain), location.hostname));

这是这一行的一个可读版本:

document.cookie.replace(
/(?<=^|;).+?(?=\=|;|$)/g,
name => location.hostname
.split(/\.(?=[^\.]+\.)/)
.reduceRight((acc, val, i, arr) => i ? arr[i]='.'+val+acc : (arr[i]='', arr), '')
.map(domain => document.cookie=`${name}=;max-age=0;path=/;domain=${domain}`)
);
小开

我在这里贡献是因为这个函数将允许您删除所有cookie(匹配路径，默认为no-path或\) 还包括子域上设置的cookie

function clearCookies( wildcardDomain=false, primaryDomain=true, path=null ){
pathSegment = path ? '; path=' + path : ''
expSegment = "=;expires=Thu, 01 Jan 1970 00:00:00 GMT"
document.cookie.split(';').forEach(
function(c) {
primaryDomain && (document.cookie = c.replace(/^ +/, "").replace(/=.*/, expSegment + pathSegment))
wildcardDomain && (document.cookie = c.replace(/^ +/, "").replace(/=.*/, expSegment + pathSegment + '; domain=' + document.domain))
}
)
}
小开

如果你想使用js-cookie npm包并按名称删除cookie:

import cookie from 'js-cookie'


export const removeAllCookiesByName = (cookieName: string) => {
const hostParts = location.host.split('.')
const domains = hostParts.reduce(
(acc: string[], current, index) => [
...acc,
hostParts.slice(index).join('.'),
],
[]
)
domains.forEach((domain) => cookie.remove(cookieName, { domain }))
}
小开

我们可以这样做:

deleteAllCookies=()=>
{
let c=document.cookie.split(';')
for(const k of c)
{
let s=k.split('=')
document.cookie=s[0].trim()+'=;expires=Fri, 20 Aug 2021 00:00:00 UTC'
}
}

用法:

deleteAllCookies()
  • 截止日期是这个答案之前的任意一天;它可以是当天之前的任何日期
  • 在JS中，你不能基于路径读取cookie
  • 在JS中，你只能设置或获取cookie

提交答案