Simulate session cookies in mobile sessions?

问题

I discovered to my astonishment at the first glance that my thinking of how session cookies behave on mobile devices is overruled by reality.

On normal desktop browsers the behavior is to store a session cookie as long as the browser session is active. The session should be closed, if the last browser window/process is closed.

Now on mobile devices you hardly ever close a browser app, you just send it to the background.

I discovered on my Sony Xperia Ray with Android 4 that the session cookie is not expired, even if I purge the browser process. But on a Samsung Tablet device it would. I don't know, how iOS devices behave in that way.

This is a problem!? What should I do to work around it?

For now, I decided to let the cookie expire in one day. But I'm not very happy with that.
Should I lower the lifetime? Perhaps to 8 hours?

回答1:

Would it make sense for you to go the HTML5 way and use sessionStorage?

This way you could be independent of the way different devices handle browser sessions, since HTML5 session storage is per-window, thus it is limited to the lifetime of the browser window.

Basically all mobile devices support sessionStorage (see here) and you could have a framework/plugin like jQuery-Session-Plugin (follow this link) handle the session data for you (and provide a fallback to session cookies for old browsers that don't support sessionStorage).

EDIT: In order to show the behavior of sessionStorage vs. localStorage, I've created a fiddle that (for demonstration purpose) uses sessionStorage for storing the width of a div and localStorage for storing the height of the same div:

var randomWidth,
    randomHeight;
if (!(randomWidth= $.session.get("randomWidth"))) {    // assignment
    randomWidth = Math.random() * 300;
    $.session.set("randomWidth", randomWidth, true);
    console.log("just assigned and stored in sessionStorage: randomWidth: " + randomWidth);
} else {
    console.log("from sessionStorage: randomWidth: " + randomWidth);
}
if (!(randomHeight= $.domain.get("randomHeight"))) {    // assignment
    randomHeight = Math.random() * 300;
    $.domain.set("randomHeight", randomHeight, true);
    console.log("just assigned and stored in localStorage: randomHeight: " + randomHeight);
} else {
    console.log("from localStorage: randomHeight: " + randomHeight);
}
$(".test").css({width: randomWidth, height: randomHeight});

Look at the console. You will see that when you initiate a new session of your client browser, the width will variate while the height will stay the same (because local Storage is per domain).

Here is the link to jsfiddle

回答2:

My solution to a similar problem was to use the document.referrer in combination with the cookie. If the user is navigating around within your site then keep using the cookie if it exists, otherwise expire or replace the cookie.

The problem is still there for when the user puts the browser in the background while on your site though. If they resume browsing and just use a link in your site, the cookie will still be used.

回答3:

This problem is not limited to mobile devices. Session cookies may last "forever" also on a desktop browser, if a user constantly chooses to "restore the previous session" (I learned this the hard way).

A client-side solution to limit sessions to one day is the following:

Set two cookies:

a (browser-)session cookie, and
a cookie that expires in the middle of the user's night (e.g., at 4 am or 5 am), between, e.g., 2 hours and 26 hours from when it is set (in general, it should expire in a window btw. x and x+24 hours)

If EITHER cookie is missing, start a new session and reset them both.

To set the second cookie, you can make use of Date.getTimezoneOffset(). Alternatively, if you are able to reliably geolocate the user so that you have at least a rough estimate of their longitude, you can use the longitude to calculate when the "middle of the user's night" is expected to be (1 hour is 15 degrees of longitude). Two possibilities are: by IP address (knowing the country may not be enough, though: in countries like the USA you need at least the state level), or by using info provided by the CDN, if you use one.

Keep in mind that if something MUST expire after a while (e.g., a session on the server), then you cannot rely on cookies, you must check for expiration server-side too.

回答4:

I would ask the user if wants to remember the location. If not set cookies' expiration to servers' timeout. You will give user a choice to pick user experience.

You can try attach to onbeforeunload event and make a post to server to alter cookies' expiration time or if cookie is not secure type then delete it from java script.

回答5:

This is a bit of a dirty suggestion and by no means fool proof - but I reckon it's worth a mention. I've never had a phone that stayed connected to the internet while idling (they all cut off to conserve battery and whatnot) - and mobile networks recycle IP addresses very quickly.

It may be worth storing the IP address in the session data and - perhaps in conjunction with a last accessed timestamp - destroying/restarting the session if the IP address changes?

Obviously this assumes the client is connected via the mobile network and not wifi.

来源：https://stackoverflow.com/questions/15202521/simulate-session-cookies-in-mobile-sessions

标签

javascript

jquery

mobile

weinre