0

I was looking for a way to save/load an array to a jquery cookie and used the top answer of this question how to store an array in jquery cookie? I can add as many items to the cookie list as I want and get the right number when I check the array length. But as soon as I refresh the page and load the cookie list, I only get a maximum of 23 items in the array, and can't find a reason for it.

here's my code

    //This is not production quality, its just demo code.
    var cookieList = function(cookieName) {
    //When the cookie is saved the items will be a comma seperated string
    //So we will split the cookie by comma to get the original array
    var cookie = $.cookie(cookieName);
    //Load the items or a new array if null.
    var items = cookie ? cookie.split(/,/) : new Array();

    //Return a object that we can use to access the array.
    //while hiding direct access to the declared items array
    //this is called closures see http://www.jibbering.com/faq/faq_notes/closures.html
    return {
        "add": function(val) {
            //Add to the items.
            items.push(val);
            //Save the items to a cookie.
            //EDIT: Modified from linked answer by Nick see 
            //      http://stackoverflow.com/questions/3387251/how-to-store-array-in-jquery-cookie
            $.cookie(cookieName, items.join(','));
        },
        "remove": function (val) { 
            //EDIT: Thx to Assef and luke for remove.
            indx = items.indexOf(val); 
            if(indx!=-1) items.splice(indx, 1); 
            $.cookie(cookieName, items.join(','));        },
        "clear": function() {
            items = [];
            //clear the cookie.
            //$.cookie(cookieName, '');
            $.removeCookie(cookieName);
        },
        "items": function() {
            //Get all the items.
            return items;
        }
    }
}

var packCollectorCookieList = new cookieList("xWeaselPackCollector"); // all items in the array.
var compareListCollector = packCollectorCookieList.items();

alert(compareListCollector.length);

and I add items (which are links) like

packCollectorCookieList.add($(this).parent('li').data('link'));
C. Lee
  • 13
  • 4
  • How long are the items? How long is the longest cookie string you *are* able to store, vs. the length of the first failure? You may simply be running into [cookie size limits](http://stackoverflow.com/q/5381526). – Paul Roub Jul 25 '17 at 16:51
  • I don't know exactly, but I just tested it with shorter strings and was able to store more items in the cookie, so it really seems to be a size limit issue. Didn't expect to reach a limit that quick. Thanks! – C. Lee Jul 25 '17 at 17:12

1 Answers1

0

The standard cookie size for browsers is 4096. You might be triggering this limit in one or both of:

Size limit of data in 1 cookie
Multiple cookies that have not expired adding up to 4096.

HTML5 and Jquery both support local storage to bypass this issue.

Overcoming Cookie Size Limit

Reenactor Rob
  • 1,508
  • 1
  • 11
  • 20