Stockage de cookies

Fermé

Arkin5 - 20 juin 2019 à 15:22
Arkin5 - 20 juin 2019 à 20:09

Bonjour. Je fais actuellement une page où on doit "check" des images puis enregistrer les cookies. Cette partie-là marche très bien mais le problème est que les navigateurs ont une limite de 150 cookies et ma page comporte plus de 600 images pouvant être cochées. J'aimerais donc savoir si on peut pallier à ce problème. De plus, la durée des cookies est limitée à la fin de la session, j'aimerais savoir où mettre une date de fin. Mon code en JS :

var getCookie = function(name) {
  var getCookieValues = function(cookie) {
    var cookieArray = cookie.split('=');
    return cookieArray[1].trim();
  };
 
  var getCookieNames = function(cookie) {
    var cookieArray = cookie.split('=');
    return cookieArray[0].trim();
  };
 
  var cookies = document.cookie.split(';');
  var cookieValue = cookies.map(getCookieValues)[cookies.map(getCookieNames).indexOf(name)];
 
  return (cookieValue === undefined) ? null : cookieValue;
};
 
/**
 * alternative: get cookie by name with using a regular expression
 */
var getCookiebyName = function(name){
  var pair = document.cookie.match(new RegExp(name + '=([^;]+)'));
  return !!pair ? pair[1] : null;
};
 
/**
 * [Gets the cookie value if the cookie key exists in the right format]
 * @param  {[string]} name [name of the cookie]
 * @return {[string]}      [value of the cookie]
 */
var getCookie = function (name) {
    return parseCookies()[name] || '';
};
 
/**
 * [Parsing the cookieString and returning an object of the available cookies]
 * @return {[object]} [map of the available objects]
 */
var parseCookies = function () {
  var cookieData = (typeof document.cookie === 'string' ? document.cookie : '').trim();
  return (cookieData ? cookieData.split(';') : []).reduce(function (cookies, cookieString) {
    var cookiePair = cookieString.split('=');
    cookies[cookiePair[0].trim()] = cookiePair.length > 1 ? cookiePair[1].trim() : '';
    return cookies;
  }, {});
};
 
function setCookie(name,value) {
    var newCookie = name + "=" + value + ';';
    console.log('Nouveau cookie :',newCookie);
    return document.cookie = newCookie;
}
 
function toggleClassEnable(curr){
  if(curr.hasClass('disabled')){
    setEnable(curr);
  }else{
    setDisable(curr);
  }   
}
 
function setEnable(curr){
  curr.addClass('enabled');
  curr.removeClass('disabled'); 
}
 
function setDisable(curr){
  curr.addClass('disabled');
  curr.removeClass('enabled');
}
 
function setClassByCookie(curr){
  var cookieEnable = getCookie(curr.attr('id'));
  console.log('cookieEnable',cookieEnable);
  if(cookieEnable=='true'){
    setEnable(curr);  
  }else{
    setDisable(curr);
  }
}
 
jQuery(document).ready(function($) { 
  $('.disabled').click(function () {
    var curr = $(this);
    toggleClassEnable(curr);
    var valCook = getCookie(curr.attr('id')) == 'true' ? 'false' : 'true';
    setCookie(curr.attr('id'), valCook);
  });
 
  $('.pictures').each(function(i,el){
    var curr = $(this);
    setClassByCookie(curr);
  });
 
});

Une partie du code HTML :

<body class="checklist">
        <section class="char-group">
        	<br /><br/>
            <div class="characters">
                <span class="disabled pictures" id="f0261"><img src="img/f0261.png"></span>
                <span class="disabled pictures" id="f0367"><img src="img/f0367.png"></span>
                <span class="disabled pictures" id="f0416"><img src="img/f0416.png"></span>
            </div>
         </section></body>

Merci beaucoup pour votre aide.

A voir également:

Stockage de cookies
Supprimer les cookies - Guide
Espace de stockage gmail plein - Guide
Espace de stockage google - Guide
Stockage du téléphone - Guide
Stockage en ligne gratuit 1to - Télécharger - Stockage

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38145 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 25 avril 2024 4 650
20 juin 2019 à 17:00

Bonjour,

Chaque navigateur dispose de ses propres limitations en terme de cookies...
Par exemple, sur mon chrome

16:55:39.776: Count: Max Cookie count with Character Length 3 and character "1": 180
16:55:41.460: Size: Max Cookie Character Length using character "1": 4096
16:55:42.976: Count: Max Cookie count with Character Length 4096 and character "1": 180
16:55:43.996: Size: Max Cookie Character Length using character "ÿ": 2049
16:55:45.964: Count: Max Cookie count with Character Length 2049 and character "ÿ": 180
16:55:46.490: Count: Max Cookie count with Character Length 100 and character "1": 180
16:55:47.14: Count: Max Cookie count with Character Length 10 and character "1": 180
16:55:47.565: Count: Max Cookie count with Character Length 5 and character "1": 180
16:55:47.769: Guessing Max Cookie Count Per Domain: 180
16:55:47.769: Guessing Max Cookie Size Per Cookie: 4096 bytes

La première question à se poser est ... dois tu créér un cookie par image ou ne peux tu pas toutes les mettres dans un seul ?

Ensuite, si tu as trop de limites avec les cookies.. pourquoi ne pas se tourner vers le stockage local (local storage) ou le stockage via une BDD ?

Arkin5
20 juin 2019 à 20:09

Bonsoir. J'ai crée un cookie par image mais j'ai pas trouvé de solutions assez efficaces pour mettre tout dans un seul et même cookie. Pour le stockage via une BDD, j'y avais pensé au départ et je pensais que c'était une bonne idée mais j'ai vu après que ça risquait de la surcharger si chaque utilisateur devait rajoute rune ligne pour chaque image cochée ou pas. Pour le stockage local, je m'y suis jamais penché dessus et je m'y connais pas trop sur ce domaine.

Au vu de ça, quelle solution pensez-vous être la meilleure ou pensez-vous que je fais fausse route quelque part ?

Discussions similaires

comment activer les cookies

PS4 : impossible de démarrer ma console

Rubrique "autre" du stockage interne

Instagram prend trop d'espace

Discussions similaires

Newsletters