简体   繁体   中英

How to properly store an array of objects in a cookie using json.stringify?

I'm trying to store an array of objects in a cookie using JSON.Stringify but I'm having a problem when I parse the cookie and try to push a new object to the array to then stringify it again. It tells me that comments.push is not a function.

 var comments = []; var myData = 0; function setCookie(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; } function getCookie(cname) { var name = cname + "="; 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); if (c.indexOf(name) == 0) return c.substring(name.length, c.length); } return ""; } function checkCookie() { var commentAux = getCookie("myComments"); if (commentAux != "") { //alert("Welcome again " + user); return true; } else { return false; } } function validateComment() { var x = document.forms["commentForm"]["commentSection"].value; if (x == null || x == "") { alert("There's nothing to comment, write something to proceed."); return false; } else { var comment = { firstName:"Name", lastName:"Surname", text:x }; if (checkCookie() == false) { setCookie("myComments", JSON.stringify(comment), 1); } else { myData = getCookie("myComments"); comments = JSON.parse(myData); alert(comments); comments.push(comment); setCookie("myComments", JSON.stringify(comments), 1); } } alert(comments.length); } 
 <!DOCTYPE html> <html> <head> <title>Facebook Simulator by Azael Alanis</title> <link rel="stylesheet" type="text/css" href="style.css"> <script src="javascript.js"></script> </head> <body> <img src="facebook-banner.png" alt="Facebook-Banner" style="height:100px;width:800px"> <div id="section"> <form name="commentForm" onsubmit="validateComment()"> <input type="text" name="commentSection" placeholder="What's on your mind?"><button class="buttonText">Enviar</button> </form> </div> </body> </html> 

What could be the problem? I just want to parse my cookie -> add new object to array -> stringify it again

Thanks

This is your problem:

comments = JSON.parse(myData);
comments.push(comment);

You probably meant to do

var comment = JSON.parse(myData);
comments.push(comment);

Since JSON.parse(myData) returns a comment object.

You use this code:

var comment = { /* ... */ };
if (checkCookie() == false) {
    setCookie("myComments", JSON.stringify(comment), 1);
} else {
    comments = JSON.parse(getCookie("myComments"));
    comments.push(comment);
    setCookie("myComments", JSON.stringify(comments), 1);
}

The problem is that initially you store the object comment instead of an array containing it.

Therefore, the next time, when you attempt to push another comment , you can't.

Try the following instead:

var comment = { /* ... */ };
if (checkCookie() == false) {
    setCookie("myComments", JSON.stringify([comment]), 1); // <-- array
} else {
    comments = JSON.parse(getCookie("myComments"));
    comments.push(comment);
    setCookie("myComments", JSON.stringify(comments), 1);
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM