Yesterday, I used a html webpage with JavaScript that I'd written and revised for over a year. I accessed it with my iPad, and it did not work. This is strange, since I've used it on that iPad before. I tried looking the problem up on the web, but it did not help. I'm not the only one who has had this problem, so I'm writing this to document the issue.
I use Firefox most of the time. The webpage works fine with it. I tried accessing the page through Safari, and found that it did not work.
The webpage used to work, and it only recently started using cookies to remember the visitor. Eventually, I narrowed it down to Safari not setting cookies.
The partial solution involved encoding the cookie with a command like this:
encodeURIComponent(cookie)
It worked under Safari, in that it set the cookie.
But that partial solution encoded the whole cookie,
including the expiration date. This wouldn't work, since the browser
did not recognize the expiration; it just treated it as part of the
cookie.
I found that the cookie needed an equals-sign, where I had just been
using a colon.
That is, I was setting a cookie like
myserver:0123456789:ABCDEF
which worked under Firefox. Changing the cookie slightly to
myserver=:0123456789:ABCDEF
made it work under Safari.
So here is a simple test that replicates the problem that I experienced. One sets a cookie to myserver: and the other sets a cookie to myserver=:. Try it below. The "Cookie is" line should be the same as the first part of the "Setting cookie to" line, without the "expires" or "path". This page does not clear cookies, so delete them through your browser preferences if you want to try this multiple times. Also, if you have your browser block cookies, you might not get the same results that I do.
Under Firefox, these buttons set two different cookies.
Under Chrome, these buttons set two different cookies.
Under Safari, the first button does not set a cookie, but the second one
does.