document.cookie can't be set in Chrome

Question

I want to save a cookie using simple javascript. So I went to w3 and they have a ready made function to save a cookie. When I tried this code in firefox it worked exactly as expected, but in Chrome setting the cookie had no effect. I saw other questions on this site where the cookie was deleted because of a lack of expiredate, but I both set a date for a few days later and document.cookie never gets set. I walked through the code line by line in the debugger, but the value of document.cookie stayed an empty string even right after the line :

document.cookie = cname + "=" + cvalue + ", " + expires + ", path=/ ;";

I've tried this with and without a path and or expiration date, but nothing seems to have an effect. What should I do?

Some extra information about my files as requested by @AndrewL64: I made a 1 page html game. I have a index.html file, a mainstyle.css file and a main.js file for the script. In my script I use JQuery to manipulate the DOM elements. I put the code in the on page load event like this:

//==================On Page Load ===================================
$(document).ready(function () {

    $("#gameContainer").hide();
    $("#mainContainer").hide();
    //$("#startContainer").hide();
    $("#skillsContainer").hide();


    prepareGame();
    //startGame();

    /*var cookieName = "sp_str_cookie_save1";
    var saveString = "some value";
    setCookie(cookieName, saveString, 10);
    var cookieResult = getCookie(cookieName);*/
    const cname = "someCookie";
    const expires = "Thu, 2 Aug 2020 20:47:11 UTC";
    const cvalue = "someValue";

    document.cookie = cname + "= " + cvalue + "; " + "expires=" + expires + "; " + "path=/";

});

Answer 1

I found the answer in another Stackoverflow question here . In short, some browsers don't set cookies when opening a html file locally. For example Chrome doesn't, but Firefox does. So test cookies in Firefox if you are working offline.

Answer 2

The parameters should be separated with a semicolon and a white-space , not a comma .

---

Change your current code from this:

document.cookie = cname + "=" + cvalue + ", " + expires + ", path=/ ;";

To this:

document.cookie = cname + "= " + cvalue + "; " + expires + "; " + "path=/";

---

Check and run this JSFiddle which has the following Code Snippet and then check your browser cookies to see the new cookie added:

 const cname = "someCookie"; const expires = "Thu, 2 Aug 2020 20:47:11 UTC"; const cvalue = "someValue"; document.cookie = cname + "= " + cvalue + "; " + "expires=" + expires + "; " + "path=/"; 

---

NB The above Code Snippet won't set the cookie since the snippet environment is just a sandbox and lacks the 'allow-same-origin' flag. Check the JSFiddle to see the above JavaScript add the cookie to your browser.