Obtenez un cookie par nom

J'ai un getter pour obtenir la valeur d'un cookie.

Maintenant, j'ai 2 cookies par le nom shares=et par le nom obligations=.

Je veux faire ce getter uniquement pour obtenir les valeurs du cookie d'obligations.

Comment puis-je faire cela? Le fordivise donc les données en valeurs distinctes et les place dans un tableau.

 function getCookie1() {
    // What do I have to add here to look only in the "obligations=" cookie? 
    // Because now it searches all the cookies.

    var elements = document.cookie.split('=');
    var obligations= elements[1].split('%');
    for (var i = 0; i < obligations.length - 1; i++) {
        var tmp = obligations[i].split('$');
        addProduct1(tmp[0], tmp[1], tmp[2], tmp[3]);
    }
 }

Une approche, qui évite d'itérer sur un tableau, serait:

function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) return parts.pop().split(';').shift();
}

Procédure pas à pas

Le fractionnement d'une chaîne par jeton produira soit un tableau avec une chaîne (même valeur), dans le cas où le jeton n'existe pas dans une chaîne, soit un tableau avec deux chaînes, dans le cas où le jeton se trouve dans une chaîne.

Le premier élément (à gauche) est une chaîne de ce qui était avant le jeton, et le second (à droite) est ce qui est une chaîne de ce qui était après le jeton.

(REMARQUE: si la chaîne commence par un jeton, le premier élément est une chaîne vide)

Considérant que les cookies sont stockés comme suit:

"{name}={value}; {name}={value}; ..."

afin de récupérer une valeur de cookie spécifique, nous avons juste besoin d'obtenir une chaîne qui se trouve après "; {name} =" et avant ""; Avant d'effectuer tout traitement, nous ajoutons la chaîne de cookies avec ";", de sorte que chaque nom de cookie, y compris le premier, soit entouré de ";" et "=":

"; {name}={value}; {name}={value}; ..."

Maintenant, nous pouvons d'abord diviser par "; {name} =", et si le jeton est trouvé dans une chaîne de cookie (c'est-à-dire que nous avons deux éléments), nous finirons avec le deuxième élément étant une chaîne qui commence par notre valeur de cookie. Ensuite, nous retirons cela d'un tableau (ie pop), et répétons le même processus, mais maintenant avec ";" comme un jeton, mais cette fois en tirant sur la chaîne de gauche (c'est-à-dire shift) pour obtenir la valeur réelle du jeton.

Je préférerais utiliser une seule correspondance d'expression régulière sur le cookie:

window.getCookie = function(name) {
  var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
  if (match) return match[2];
}

OU Nous pouvons également utiliser une fonction, vérifiez le code ci-dessous.

function check_cookie_name(name) 
    {
      var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
      if (match) {
        console.log(match[2]);
      }
      else{
           console.log('--something went wrong---');
      }
   }

Amélioration grâce à Scott Jungwirth dans les commentaires.

utiliser un script d'obtention de cookies:

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;
}

puis appelez-le:

var value = readCookie('obligations');

J'ai volé le code ci-dessus sur la page des cookies quirksmode. vous devriez le lire .

Si vous utilisez jQuery, je vous recommande d'utiliser ce plugin:

https://github.com/carhartl/jquery-cookie
https://github.com/carhartl/jquery-cookie/blob/master/jquery.cookie.js

<script type="text/javascript"
 src="//cdnjs.cloudflare.com/ajax/libs/jquery-cookie/1.4.1/jquery.cookie.min.js">

Vous pouvez donc lire un cookie comme celui-ci:

var value = $.cookie("obligations");

Vous pouvez également écrire un cookie:

$.cookie('obligations', 'new_value');
$.cookie('obligations', 'new_value', { expires: 14, path: '/' });

Supprimer le cookie:

$.removeCookie('obligations');

Les méthodes de certaines des autres réponses qui utilisent une expression régulière ne couvrent pas tous les cas, en particulier:

1. Lorsque le cookie est le dernier cookie. Dans ce cas, il n'y aura pas de point-virgule après la valeur du cookie.
2. Lorsqu'un autre nom de cookie se termine par le nom recherché. Par exemple, vous recherchez le cookie nommé "one", et il existe un cookie nommé "done".
3. Lorsque le nom du cookie comprend des caractères qui ne sont pas interprétés comme eux-mêmes lorsqu'ils sont utilisés dans une expression régulière, sauf s'ils sont précédés d'une barre oblique inverse.

La méthode suivante gère ces cas:

function getCookie(name) {
    function escape(s) { return s.replace(/([.*+?\^${}()|\[\]\/\\])/g, '\\$1'); };
    var match = document.cookie.match(RegExp('(?:^|;\\s*)' + escape(name) + '=([^;]*)'));
    return match ? match[1] : null;
}

Cela reviendra nullsi le cookie n'est pas trouvé. Il renverra une chaîne vide si la valeur du cookie est vide.

Remarques:

1. Cette fonction suppose que les noms de cookies sont sensibles à la casse .
2. document.cookie- Lorsque cela apparaît sur le côté droit d'une affectation, cela représente une chaîne contenant une liste de cookies séparés par des points-virgules, qui sont à leur tour des name=valuepaires. Il semble y avoir un seul espace après chaque point-virgule.
3. String.prototype.match()- Retourne nulllorsqu'aucune correspondance n'est trouvée. Renvoie un tableau lorsqu'une correspondance est trouvée, et l'élément à index [1]est la valeur du premier groupe correspondant.

Notes d'expression régulière:

1. (?:xxxx) - forme un groupe qui ne correspond pas.
2. ^ - correspond au début de la chaîne.
3. | - sépare les modèles alternatifs pour le groupe.
4. ;\\s* - correspond à un point-virgule suivi de zéro ou plusieurs espaces.
5. = - correspond à un signe égal.
6. (xxxx) - forme un groupe correspondant.
7. [^;]*- correspond à zéro ou plusieurs caractères autres qu'un point-virgule. Cela signifie qu'il fera correspondre les caractères jusqu'à, mais sans inclure, un point-virgule ou jusqu'à la fin de la chaîne.

4 ans plus tard, version ES6 façon plus simple.

function getCookie(name) {
  let cookie = {};
  document.cookie.split(';').forEach(function(el) {
    let [k,v] = el.split('=');
    cookie[k.trim()] = v;
  })
  return cookie[name];
}

J'ai également créé un aperçu pour l'utiliser comme Cookieobjet. par exemple, Cookie.set(name,value)etCookie.get(name)

Cela a lu tous les cookies au lieu de les parcourir. C'est ok pour un petit nombre de cookies.

J'ai modifié la fonction fournie par Jonathan ici, en utilisant une expression régulière, vous pouvez obtenir une valeur de cookie par son nom comme ceci:

function getCookie(name){
    var pattern = RegExp(name + "=.[^;]*")
    var matched = document.cookie.match(pattern)
    if(matched){
        var cookie = matched[0].split('=')
        return cookie[1]
    }
    return false
}

S'il renvoie une chaîne vide, cela signifie que le cookie existe mais n'a aucune valeur, s'il renvoie false, le cookie n'existe pas. J'espère que ça aide.

Voici une ligne pour obtenir un cookie avec un nom spécifique sans avoir besoin d'une bibliothèque externe:

var cookie = ("; "+document.cookie).split("; YOUR_COOKIE_NAME=").pop().split(";").shift();

Cette réponse est basée sur la brillante solution de Kirlich . Le seul compromis de cette solution est que vous obtiendrez une chaîne vide lorsque le cookie n'existe pas. Dans la plupart des cas, cela ne devrait cependant pas être une rupture.

Je sais que c'est une vieille question mais j'ai aussi rencontré ce problème. Juste pour mémoire, il y a une petite API dans la page Web des développeurs mozilla .

Vous pouvez obtenir n'importe quel cookie par son nom en utilisant uniquement JS. Le code est également plus propre à mon humble avis (sauf pour la longue ligne, que je suis sûr que vous pouvez facilement corriger).

function getCookie(sKey) {
    if (!sKey) { return null; }
    return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
}

Comme indiqué dans les commentaires, sachez que cette méthode suppose que la clé et la valeur ont été codées à l'aide d'encodeURIComponent (). Supprimez decode & encodeURIComponent () si la clé et la valeur du cookie n'ont pas été codées.

Vous pouvez utiliser la bibliothèque js-cookie pour obtenir et définir des cookies JavaScript.

Inclure dans votre HTML:

<script src="https://cdn.jsdelivr.net/npm/js-cookie@2/src/js.cookie.min.js"></script>

Pour créer un cookie:

Cookies.set('name', 'value');

Pour lire un cookie:

Cookies.get('name'); // => 'value'

Voici une version assez courte

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

Notez que j'ai utilisé les chaînes de modèle d'ES6 pour composer l'expression d'expression régulière.

Utilisation object.defineProperty

Avec cela, vous pouvez facilement accéder aux cookies

Object.defineProperty(window, "Cookies", {
    get: function() {
        return document.cookie.split(';').reduce(function(cookies, cookie) {
            cookies[cookie.split("=")[0]] = unescape(cookie.split("=")[1]);
            return cookies
        }, {});
    }
});

À partir de maintenant, vous pouvez simplement faire:

alert( Cookies.obligations );

Cela sera également mis à jour automatiquement, donc si vous modifiez un cookie, le Cookieschangera également.

kirlich a donné une bonne solution. Cependant, il échoue lorsqu'il y a deux valeurs de cookie avec des noms similaires, voici une solution simple à cette situation:

function getCookie(name) {
  var value = "; " + document.cookie;
  var parts = value.split("; " + name + "=");
  if (parts.length >= 2) return parts.pop().split(";").shift();
}

fonctionne toujours bien:

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

function setCookie(variable, value, expires_seconds) {
    var d = new Date();
    d = new Date(d.getTime() + 1000 * expires_seconds);
    document.cookie = variable + '=' + value + '; expires=' + d.toGMTString() + ';';
}

Aucune exigence pour jQuery ou quoi que ce soit. Pur vieux bon JavaScript.

function getCookie(name) {
    var pair = document.cookie.split('; ').find(x => x.startsWith(name+'='));
    if (pair)
       return pair.split('=')[1]
}

Fonction simple pour obtenir un cookie avec un nom de cookie:

function getCookie(cn) {
    var name = cn+"=";
    var allCookie = decodeURIComponent(document.cookie).split(';');
    var cval = [];
    for(var i=0; i < allCookie.length; i++) {
        if (allCookie[i].trim().indexOf(name) == 0) {
            cval = allCookie[i].trim().split("=");
        }   
    }
    return (cval.length > 0) ? cval[1] : "";
}

Apparemment, MDN n'a jamais entendu parler de la classe de caractères regex de limite de mot \b, qui correspond à un contigu \w+qui est délimité de chaque côté par \W+:

getCookie = function(name) {
    var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
    return r ? r[1] : null;
};

var obligations = getCookie('obligations');

Il me semble que vous pouvez diviser les paires clé-valeur des cookies en un tableau et baser votre recherche sur cela:

var obligations = getCookieData("obligations");

Qui s'exécute comme suit:

function getCookieData( name ) {
    var pairs = document.cookie.split("; "),
        count = pairs.length, parts; 
    while ( count-- ) {
        parts = pairs[count].split("=");
        if ( parts[0] === name )
            return parts[1];
    }
    return false;
}

Violon: http://jsfiddle.net/qFmPc/

Ou peut-être même ce qui suit:

function getCookieData( name ) {
    var patrn = new RegExp( "^" + name + "=(.*?);" ),
        patr2 = new RegExp( " " + name + "=(.*?);" );
    if ( match = (document.cookie.match(patrn) || document.cookie.match(patr2)) )
        return match[1];
    return false;
}

Dans mes projets, j'utilise la fonction suivante pour accéder aux cookies par nom

function getCookie(cookie) {
    return document.cookie.split(';').reduce(function(prev, c) {
        var arr = c.split('=');
        return (arr[0].trim() === cookie) ? arr[1] : prev;
    }, undefined);
}

Si vous avez juste besoin de vérifier s'il existe des cookies, procédez simplement comme suit:

document.cookie.split('logged=true').length == 2

si cookie enregistré = vrai existe, vous en obtiendrez 2, sinon 1.

connecté = vrai - changez ceci en votre nom de cookie = valeur, ou juste un nom

Il y a déjà de bonnes réponses ici pour obtenir le cookie, mais voici ma propre solution:

function getcookie(cookiename){
var cookiestring  = document.cookie;
var cookiearray = cookiestring.split(';');
for(var i =0 ; i < cookiearray.length ; ++i){ 
    if(cookiearray[i].trim().match('^'+cookiename+'=')){ 
        return cookiearray[i].replace(`${cookiename}=`,'').trim();
    }
} return null;
}

utilisation: `

     getcookie('session_id');
   // gets cookie with name session_id

défini par javascript

document.cookie = 'cookiename=tesing';

obtenir par jquery avec le plugin jquery-cookie

var value = $.cookie("cookiename");

alert(value);

référence: https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie

document.cookie = "test1=Hello";
document.cookie = "test2=World";

var cookieValue = document.cookie.replace(/(?:(?:^|.*;\s*)test2\s*\=\s*([^;]*).*$)|^.*$/, "$1");

  alert(cookieValue);

Ma solution est la suivante:

function getCookieValue(cookieName) {
    var ca = document.cookie.split('; ');
    return _.find(ca, function (cookie) {
        return cookie.indexOf(cookieName) === 0;
    });
}

Cette fonction utilise la fonction Underscorejs _.find. Renvoie undefined si le nom du cookie n'existe pas

Je l'ai fait de cette façon. afin que j'obtienne un objet auquel accéder pour séparer les valeurs. Avec cela, vous pouvez passer le cookie au parent et ensuite vous pouvez accéder à vos valeurs par les clés comme

var cookies=getCookieVal(mycookie);
alert(cookies.mykey);
function getCookieVal(parent) {
            var cookievalue = $.cookie(parent).split('&');
            var obj = {};
            $.each(cookievalue, function (i, v) {
                var key = v.substr(0, v.indexOf("="));
                var val = v.substr(v.indexOf("=") + 1, v.length);

                obj[key] = val;

            });
            return obj;
        }  

Une approche fonctionnelle pour trouver les cookies existants. Il renvoie un tableau, il prend donc en charge plusieurs occurrences du même nom. Il ne prend pas en charge la correspondance de clé partielle, mais il est trivial de remplacer le === dans le filtre par une expression régulière.

function getCookie(needle) {
    return document.cookie.split(';').map(function(cookiestring) {
        cs = cookiestring.trim().split('=');

        if(cs.length === 2) {
            return {'name' : cs[0], 'value' : cs[1]};
        } else {
            return {'name' : '', 'value' : ''};
        }
    })
    .filter(function(cookieObject) { 
        return (cookieObject.name === needle);
    });
}

Utilisez simplement la fonction suivante (un code javascript pur)

const getCookie = (name) => {
 const cookies = Object.assign({}, ...document.cookie.split('; ').map(cookie => {
    const name = cookie.split('=')[0];
    const value = cookie.split('=')[1];

    return {[name]: value};
  }));

  return cookies[name];
};

Obtenez un cookie par nom, passez simplement le nom du cookie à la fonction ci-dessous

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 "";
}

La fonction suivante renverra une key-valuepaire de cookies requis, où keyest le nom du cookie et valuesera la valeur du cookie.

/**
 * Returns cookie key-value pair
 */
var getCookieByName = function(name) {
    var result = ['-1','-1'];
    if(name) {
        var cookieList = document.cookie.split(';');
        result = $.grep(cookieList,function(cookie) { 
            cookie = cookie.split('=')[0];
            return cookie == name;
        });
    }
    return result;
};

Exemple de cookies: exemple JS:

document.cookies = {
   create : function(key, value, time){
     if (time) {
         var date = new Date();
         date.setTime(date.getTime()+(time*24*60*60*1000));
         var expires = "; expires="+date.toGMTString();
     }
     else var expires = "";
     document.cookie = key+"="+value+expires+"; path=/";
   },
   erase : function(key){
     this.create(key,"",-1);
   },
   read : function(key){
     var keyX = key + "=";
     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(keyX) == 0) return   c.substring(keyX.length,c.length);
     }
     return null;
   }
}

Stockez des tableaux et des objets avec json ou xml