如何在JavaScript中获取和设置cookies

4

使用JavaScript获取和设置Cookies感觉有点奇怪,像这样:

设置:document.cookie = "<key>=<value>[;expires=<utc_expires>[;path=<path>]]";

获取:解析 document.cookie

我在 W3C.org Cookies 上找到了这个获取和设置函数。

是否有更加优雅/简单的方法来完成这个操作?


可能是使用JavaScript设置和获取cookie的重复问题。 - rnevius
2个回答

22
你可以使用一些简单的函数,比如setCookie()getCookie()
你可以通过调用以下方法来设置cookie:
setCookie('myName','value', 3);

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 + "=" + (value || "") + expires + "; path=/";
}

function getCookie(name) {
  var nameEQ = name + "=";
  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;
}

注意: 来源于quirksmode。如果您想更多地了解cookie,请查看文档


2
那么没有更优雅的方法来做这件事吗?getter和setter本质上与我在W3C.org上找到的相同。 - SirPilan
1
@Pilan:此外,Mozilla 提供了一个简单的框架来读写 cookies。一旦在页面中包含该框架,您可以使用以下代码设置 cookie:`docCookies.setItem(name, value);` 这可能是最优雅的实现方式。 - user3596335
1
你可以使用 document.cookie.split(';').map(c => c.trimLeft()) 代替 while 循环。 - David Ferreira
而且,与“if(c.indexOf(nameEQ) == 0)”相比,以下代码执行更快(不搜索整个字符串),并且描述性更好:“if(c.startsWith(nameEQ))”。 - Chris Janicki

6

ES6的做法是:

const setCookie = (cookieKey, cookieValue, expirationDays) => {
  let expiryDate = '';

  if (expirationDays) {
    const date = new Date();

    date.setTime(`${date.getTime()}${(expirationDays || 30 * 24 * 60 * 60 * 1000)}`);

    expiryDate = `; expiryDate=" ${date.toUTCString()}`;
  }

  document.cookie = `${cookieKey}=${cookieValue || ''}${expiryDate}; path=/`;
}

const getCookie = (cookieKey) => {
  let cookieName = `${cookieKey}=`;

  let cookieArray = document.cookie.split(';');

  for (let cookie of cookieArray) {

    while (cookie.charAt(0) == ' ') {
          cookie = cookie.substring(1, cookie.length);
      }

    if (cookie.indexOf(cookieName) == 0) {
          return cookie.substring(cookieName.length, cookie.length);
      }
  }
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接