¿Cuál es la función más corta para leer una cookie por nombre en JavaScript?

¿Cuál es el método más corto, preciso y compatible con varios navegadores para leer una cookie en JavaScript?

Muy a menudo, al crear scripts independientes (donde no puedo tener dependencias externas), me encuentro agregando una función para leer cookies, y generalmente recurro alreadCookie() método QuirksMode.org (280 bytes, 216 minificados).

function readCookie(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;
}

Hace el trabajo, pero es feo, y agrega bastante hinchazón cada vez.

El método por el cual jQuery.cookie usa algo como esto (modificado, 165 bytes, 125 minificados):

function read_cookie(key)
{
    var result;
    return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? (result[1]) : null;
}

Tenga en cuenta que esta no es una competencia de 'Código Golf': estoy legítimamente interesado en reducir el tamaño de mi función readCookie y en garantizar que la solución que tengo sea válida.

Más corto, más confiable y más eficaz que la respuesta actual mejor votada:

function getCookieValue(a) {
    var b = document.cookie.match('(^|;)\\s*' + a + '\\s*=\\s*([^;]+)');
    return b ? b.pop() : '';
}

Aquí se muestra una comparación de rendimiento de varios enfoques:

http://jsperf.com/get-cookie-value-regex-vs-array-functions

Algunas notas sobre el enfoque:

El enfoque regex no solo es el más rápido en la mayoría de los navegadores, sino que también ofrece la función más corta. Además, debe señalarse que de acuerdo con la especificación oficial (RFC 2109) , el espacio después del punto y coma que separa las cookies en el documento.cookie es opcional y se podría argumentar que no se debe confiar en él. Además, se permite el espacio en blanco antes y después del signo igual (=) y se podría argumentar que este espacio en blanco potencial debe incluirse en cualquier analizador confiable de documentos. La expresión regular anterior representa las dos condiciones de espacio en blanco anteriores.

Esto solo llegará a document.cookie UNA vez. Cada solicitud posterior será instantánea.

(function(){
    var cookies;

    function readCookie(name,c,C,i){
        if(cookies){ return cookies[name]; }

        c = document.cookie.split('; ');
        cookies = {};

        for(i=c.length-1; i>=0; i--){
           C = c[i].split('=');
           cookies[C[0]] = C[1];
        }

        return cookies[name];
    }

    window.readCookie = readCookie; // or expose it however you want
})();

Me temo que no hay una forma más rápida que esta lógica general a menos que sea libre de usar .forEach que depende del navegador (incluso entonces no está ahorrando demasiado)

Su propio ejemplo ligeramente comprimido para 120 bytes:

function read_cookie(k,r){return(r=RegExp('(^|; )'+encodeURIComponent(k)+'=([^;]*)').exec(document.cookie))?r[2]:null;}

Puede obtenerlo 110 bytessi lo convierte en un nombre de función de 1 letra, 90 bytessi suelta elencodeURIComponent .

Lo he entendido 73 bytes, pero para ser justos, es 82 bytescuando se nombra readCookiey 102 bytesluego agrega encodeURIComponent:

function C(k){return(document.cookie.match('(^|; )'+k+'=([^;]*)')||0)[2]}

Supuestos

Basado en la pregunta, creo que algunos supuestos / requisitos para esta función incluyen:

• Se utilizará como una función de biblioteca y, por lo tanto, se debe colocar en cualquier base de código;
• Como tal, tendrá que funcionar en muchos entornos diferentes , es decir, trabajar con código JS heredado, CMS de varios niveles de calidad, etc .;
• Para interactuar con el código escrito por otras personas y / o código que usted no controla, la función no debe hacer ninguna suposición sobre cómo se codifican los nombres o valores de cookies . Llamar a la función con una cadena "foo:bar[0]"debería devolver una cookie (literalmente) llamada "foo: bar [0]";
• Las cookies nuevas pueden escribirse y / o las cookies existentes pueden modificarse en cualquier momento durante la vida útil de la página.

Bajo estos supuestos, está claro que encodeURIComponent/ decodeURIComponent no debe usarse ; Al hacerlo, se supone que el código que establece la cookie también la codificó mediante estas funciones.

El enfoque de expresión regular se vuelve problemático si el nombre de la cookie puede contener caracteres especiales. jQuery.cookie soluciona este problema al codificar el nombre de la cookie (en realidad, tanto el nombre como el valor) al almacenar una cookie y decodificar el nombre al recuperar una cookie. Una solución de expresión regular está debajo.

A menos que solo esté leyendo las cookies que controla por completo, también sería recomendable leer las cookies document.cookiedirectamente y no almacenar en caché los resultados, ya que no hay forma de saber si la memoria caché no es válida sin document.cookievolver a leer .

(Si bien el acceso y el análisis document.cookiesserán un poco más lentos que el uso de un caché, no sería tan lento como leer otras partes del DOM, ya que las cookies no juegan un papel en los árboles DOM / render).

Función basada en bucle

Aquí va la respuesta de Code Golf, basada en la función PPK (basada en bucle):

function readCookie(name) {
    name += '=';
    for (var ca = document.cookie.split(/;\s*/), i = ca.length - 1; i >= 0; i--)
        if (!ca[i].indexOf(name))
            return ca[i].replace(name, '');
}

que cuando se minimiza, llega a 128 caracteres (sin contar el nombre de la función):

function readCookie(n){n+='=';for(var a=document.cookie.split(/;\s*/),i=a.length-1;i>=0;i--)if(!a[i].indexOf(n))return a[i].replace(n,'');}

Función basada en expresiones regulares

Actualización: si realmente quieres una solución de expresión regular:

function readCookie(name) {
    return (name = new RegExp('(?:^|;\\s*)' + ('' + name).replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&') + '=([^;]*)').exec(document.cookie)) && name[1];
}

Esto escapa a cualquier carácter especial en el nombre de la cookie antes de construir el objeto RegExp. Minificado, esto llega a 134 caracteres (sin contar el nombre de la función):

function readCookie(n){return(n=new RegExp('(?:^|;\\s*)'+(''+n).replace(/[-[\]{}()*+?.,\\^$|#\s]/g,'\\$&')+'=([^;]*)').exec(document.cookie))&&n[1];}

Como Rudu y cwolves han señalado en los comentarios, la expresión regular de escape de expresión regular se puede acortar con algunos caracteres. Creo que sería bueno mantener la expresión regular de escape consistente (puede estar usándola en otro lugar), pero vale la pena considerar sus sugerencias.

Notas

Ambas funciones no manejarán nullo undefined, es decir, si hay una cookie llamada "nulo", readCookie(null)devolverá su valor. Si necesita manejar este caso, adapte el código en consecuencia.

código de google analytics ga.js

function c(a){
    var d=[],
        e=document.cookie.split(";");
    a=RegExp("^\\s*"+a+"=\\s*(.*?)\\s*$");
    for(var b=0;b<e.length;b++){
        var f=e[b].match(a);
        f&&d.push(f[1])
    }
    return d
}

¿Que tal este?

function getCookie(k){var v=document.cookie.match('(^|;) ?'+k+'=([^;]*)(;|$)');return v?v[2]:null}

Se contaron 89 bytes sin el nombre de la función.

Aquí va ... ¡Salud!

function getCookie(n) {
    let a = `; ${document.cookie}`.match(`;\\s*${n}=([^;]+)`);
    return a ? a[1] : '';
}

Tenga en cuenta que hice uso de las cadenas de plantilla de ES6 para componer la expresión regex.

esto en un objeto que puede leer, escribir, sobrescribir y eliminar cookies.

var cookie = {
    write : function (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;
    },
    read : function (name) {
        if (document.cookie.indexOf(name) > -1) {
            return document.cookie.split(name)[1].split("; ")[0].substr(1)
        } else {
            return "";
        }
    },
    delete : function (cname) {
        var d = new Date();
        d.setTime(d.getTime() - 1000);
        var expires = "expires="+d.toUTCString();
        document.cookie = cname + "=; " + expires;
    }
};

Ambas funciones parecen igualmente válidas en términos de lectura de cookies. Sin embargo, puede eliminar algunos bytes (y realmente está entrando en el territorio de Code Golf aquí):

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

Todo lo que hice con esto es colapsar todas las declaraciones de variables en una declaración var, eliminar los segundos argumentos innecesarios en las llamadas a la subcadena y reemplazar la llamada charAt en una desreferencia de matriz.

Esto todavía no es tan corto como la segunda función que proporcionó, pero incluso eso puede tener algunos bytes eliminados:

function read_cookie(key)
{
    var result;
    return (result = new RegExp('(^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? result[2] : null;
}

Cambié la primera subexpresión en la expresión regular para que sea una subexpresión de captura, y cambié el resultado [1] parte a resultado [2] para coincidir con este cambio; También se eliminaron los parens innecesarios en torno al resultado [2].

Para eliminar realmente la mayor hinchazón posible, considere no usar una función de envoltura:

try {
    var myCookie = document.cookie.match('(^|;) *myCookie=([^;]*)')[2]
} catch (_) {
    // handle missing cookie
}

Mientras esté familiarizado con RegEx, ese código es razonablemente limpio y fácil de leer.

(editar: publicó la versión incorrecta primero ... y una no funcional en eso. Actualizada a actual, que utiliza una función de desempaquetado que es muy similar al segundo ejemplo).

Buena idea en el primer ejemplo cwolves. Construí ambos para una función de lectura / escritura de cookies bastante compacta que funciona en múltiples subdominios. Pensé que compartiría en caso de que alguien más se encuentre con este hilo en busca de eso.

(function(s){
  s.strToObj = function (x,splitter) {
    for ( var y = {},p,a = x.split (splitter),L = a.length;L;) {
      p = a[ --L].split ('=');
      y[p[0]] = p[1]
    }
    return y
  };
  s.rwCookie = function (n,v,e) {
    var d=document,
        c= s.cookies||s.strToObj(d.cookie,'; '),
        h=location.hostname,
        domain;
    if(v){
      domain = h.slice(h.lastIndexOf('.',(h.lastIndexOf('.')-1))+1);
      d.cookie = n + '=' + (c[n]=v) + (e ? '; expires=' + e : '') + '; domain=.' + domain + '; path=/'
    }
    return c[n]||c
  };
})(some_global_namespace)

• Si no pasa nada a rwCookie, obtendrá todas las cookies en el almacenamiento de cookies
• Pasó a rwCookie un nombre de cookie, obtiene el valor de esa cookie del almacenamiento
• Pasó un valor de cookie, escribe la cookie y coloca el valor en el almacenamiento
• La caducidad predeterminada es sesión a menos que especifique uno

Usando la respuesta de cwolves, pero no usando un cierre ni un hash precalculado:

// Golfed it a bit, too...
function readCookie(n){
  var c = document.cookie.split('; '),
      i = c.length,
      C;

  for(; i>0; i--){
     C = c[i].split('=');
     if(C[0] == n) return C[1];
  }
}

... y minificando ...

function readCookie(n){var c=document.cookie.split('; '),i=c.length,C;for(;i>0;i--){C=c[i].split('=');if(C[0]==n)return C[1];}}

... es igual a 127 bytes.

Aquí está la solución más simple usando funciones de cadena javascript.

document.cookie.substring(document.cookie.indexOf("COOKIE_NAME"), 
                          document.cookie.indexOf(";", 
                          document.cookie.indexOf("COOKIE_NAME"))).
  substr(COOKIE_NAME.length);

La siguiente función permitirá diferenciar entre cadenas vacías y cookies indefinidas. Las cookies no definidas volverán correctamente undefinedy no una cadena vacía a diferencia de algunas de las otras respuestas aquí. Pero no funcionará en IE7 y versiones posteriores, ya que no permiten el acceso a la matriz a los índices de cadena.

    function getCookie(name) {
      return (document.cookie.match('(?:^|;) *'+name+'=([^;]*)')||"")[1];
    }