如何在JavaScript中创建和读取cookie的值?
当前回答
我写了简单的cookie utils,它有三个功能创建cookie,读取cookie和删除cookie。
var CookieUtils = {
createCookie: function (name, value, expireTime) {
expireTime = !!expireTime ? expireTime : (15 * 60 * 1000); // Default 15 min
var date = new Date();
date.setTime(date.getTime() + expireTime);
var expires = "; expires=" + date.toGMTString();
document.cookie = name + "=" + value + expires + "; path=/";
},
getCookie: function (name) {
var value = "; " + document.cookie;
var parts = value.split("; " + name + "=");
if (parts.length == 2) {
return parts.pop().split(";").shift();
}
},
deleteCookie: function(name) {
document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}
};
其他回答
这是一个代码获取,设置和删除Cookie在JavaScript。
function getCookie(name) { name = name + "="; var cookies = document.cookie.split(';'); for(var i = 0; i <cookies.length; i++) { var cookie = cookies[i]; while (cookie.charAt(0)==' ') { cookie = cookie.substring(1); } if (cookie.indexOf(name) == 0) { return cookie.substring(name.length,cookie.length); } } return ""; } 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); }
来源:http://mycodingtricks.com/snippets/javascript/javascript-cookies/
使用模板文字的非常短的ES6函数。请注意,您需要自己编码/解码这些值,但对于存储版本号等更简单的目的,它可以开箱即用。
const getCookie = (cookieName) => {
return (document.cookie.match(`(^|;) *${cookieName}=([^;]*)`)||[])[2]
}
const setCookie = (cookieName, value, days=360, path='/') => {
let expires = (new Date(Date.now()+ days*86400*1000)).toUTCString();
document.cookie = `${cookieName}=${value};expires=${expires};path=${path};`
}
const deleteCookie = (cookieName) => {
document.cookie = `${cookieName}=;expires=Thu, 01 Jan 1970 00:00:01 GMT;path=/;`;
}
下面是前面提到的w3schools的例子。
function setCookie(cname, cvalue, exdays) {
var d = new Date();
d.setTime(d.getTime() + (exdays*24*60*60*1000));
var expires = "expires="+ d.toUTCString();
document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
}
function getCookie(cname) {
var name = cname + "=";
var decodedCookie = decodeURIComponent(document.cookie);
var ca = decodedCookie.split(';');
for(var i = 0; i <ca.length; i++) {
var c = ca[i];
while (c.charAt(0) == ' ') {
c = c.substring(1);
}
if (c.indexOf(name) == 0) {
return c.substring(name.length, c.length);
}
}
return "";
}
对于读取简单的查询字符串,这一行代码可能在最新版本的JavaScript中适用:
let cookies = Object.fromEntries(document.cookie.split(';').map(i=>i.trim().split('=')));
现在你有了一个带有键和值的JavaScript对象。
对于创建,你可以试试这个:
let cookieObject = {foo: 'bar', ping: "pong"}
Object.entries(cookieObject).map((e)=>`${e[0]}=${e[1]}`).join(';')
chrome团队提出了一种新的方式管理Cookie与Cookie存储API异步(可在谷歌chrome从版本87开始):https://wicg.github.io/cookie-store/
今天已经在其他浏览器中使用了它:https://github.com/mkay581/cookie-store
// load polyfill
import 'cookie-store';
// set a cookie
await cookieStore.set('name', 'value');
// get a cookie
const savedValue = await cookieStore.get('name');