CODEWITHSUNDEEP
javascriptcookies
Menztrual
Menztrual

Reputation: 41597

Javascript document.cookie always returns empty string

I have this real strange problem with client side javascript setting cookies. I'm developing a little 1 page demo at the moment to use cookies to store some 'preferences'. Please note that I can't use a server side language for this demo or any 3rd party jQuery plugins.

So I've written a javascript object to set a cookie:

var cookie = {
  set: function (name,value,exdays) {

    var exdate = new Date();
    exdate.setDate(exdate.getDate() + exdays);
    var value = escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
    document.cookie=name + "=" + value;
    console.log(document.cookie);
  }
}

cookie.set('foo','bar',2);
console.log(document.cookie);

It just returns an empty string. I've gone into Chrome console to see if I can do it via directly modifying document.cookie

> document.cookie = "foo=bar";
"foo=bar"
> document.cookie
""

How do you set a cookie via client side javascript?

Edit: I am not in incognito mode and cookies are enabled.

Upvotes: 78

Views: 113114

Answers (6)

tanmaygupta24
tanmaygupta24

Reputation: 11

  1. cookie will not work if you directly open your file, let's say index.html

    file:///C:/Users/me/Desktop/index.html

  2. however: cookie will work if page (index.html) is opened using a light weight server or local server

    http://localhost/demo/demo.html works. or http://127.0.0.1:5500/temp6.html

  3. For live sever in VS Code you can use Live Serve by Ritwick Dey enter image description here

Upvotes: -1

Piotr Siupa
Piotr Siupa

Reputation: 4838

You might have set a wrong path for the cookie.

In my case I'd set the path in the cookie to /foo because the application is normally on address http://example.org/foo. However, during tests I'd opened the application on the default address http://localhost:3000 which allowed me to create cookies with the path /foo but not read them. The solution was to test the application on address http://localhost:3000/foo.

Upvotes: 0

Stijn de Witt
Stijn de Witt

Reputation: 42085

HttpOnly cookies cannot be accessed from Javascript and session cookies are usually set as HttpOnly cookies. See also this StackOverflow question: How to read a secure cookie using JavaScript

So... check whether the cookie you want to read has the 'HttpOnly' flag set... If so, you know the culprit. It's not a bug, it's a feature!

Upvotes: 138

poida
poida

Reputation: 3599

This worked for me when ran from localhost, running chrome 28.0.1472.0 canary:

<!DOCTYPE html>
<html>
<head>
  <title>localhost cookie</title>
</head>
<body>
  <script type="text/javascript">
    console.log(document.cookie);
    var myCookie = "mycookie=hellocookie";
    document.cookie = myCookie;
  </script>
</body>
</html>

Run it in a server, visit the page and look at your cookie store, refresh the page and look at your console.

It did not set a cookie when opened as a file but worked every time when opened from the server.

Upvotes: 1

Menztrual
Menztrual

Reputation: 41597

You can't set cookies by the look of things if its not running in a web server.

file:///C:/Users/me/Desktop/demo/demo.html

however:

http://localhost/demo/demo.html works.

Upvotes: 64

Aram Kocharyan
Aram Kocharyan

Reputation: 20431

For usage and docs, see here:

https://developer.mozilla.org/en-US/docs/DOM/document.cookie

If you are in Incognito Mode or have cookies disabled, it won't work.

Upvotes: 0

Related Questions