Do sockets not stay connected on iPad/iphone? - iphone

Question

I have built a simple node.js 2-page app. A lobby, and a game room. The user connects to the lobby, then takes a seat at a table and the game room opens up in a new window. So two browser windows open, both with their own socket connection.
Everything works great on my computers. Works on all browsers, and the user stays connected in the lobby while they are playing the game in the game room as i'm ping-ponging a signal back-and-forth.
However, on my iPad or iPhone, when I open up the game room, the socket connection to the lobby ends after a short amount of time.
Is there a best practice for forcing a socket connection to stay open on those devices that's different than a computer?
Here's the code I have on the server:
EDIT: The connection to the lobby actually ends instantly when that browser window no longer has focus on a mobile device, it's just that the timeout itself happens after the timeout interval.
Here's my debug output:
got pong Player1
got pong Player1
got pong Player1
got pong Player1
got pong Player1
{ username: 'Player2',
password: 'password',
browser_os: 'Mozilla/5.0 (iPad; CPU OS 5_1_1 like Mac OS X) AppleWebKit/534.46 (KHTML, like Gecko) Version/5.1 Mobile/9B206 Safari/7534.48.3' }
info - handshake authorized Ut2WHuhbDGsYzd6CRquX (player 2 logs in and handshakes the lobby)
connecting to lobby
got pong Player1
got pong Player2 (first pong from player 2)
info - handshake authorized If6MFTkJqv3T_Mn5RquY (game table opens for player 2 - notice no more pongs from Player 2!!)
got pong Player1
got pong Player1
got pong Player1
info - handshake authorized agmZNNSnce0h68NSRquZ (game table opens for player 1)
got pong Player1
got pong Player1
got pong Player1
got pong Player1
got pong Player1
got pong Player1
got pong Player1
info - transport end (heartbeat timeout)
lobby disconnect (player 2 gets disconnected from the lobby)
got pong Player1
This is my server-side code:
function sendHeartbeat(){
setTimeout(sendHeartbeat, 8000);
io.sockets.in('lobby1').emit('ping', { beat : '1' });
}
setTimeout(sendHeartbeat, 8000);
This is my client-side code:
socket.on('ping',function(msg){sendPong(msg)});
function sendPong(msg) {
socket.emit('pong');
}

Answer 1

Techniques and technologies for doing this are generally referred to under the umbrella term Commet, which basically comes down to forcing the browser to keep requests open for relatively long periods of time, waiting for updates from the server.
HTML5 supports a feature called Websockets that allow for a more true TCP/IP socket that creates a persistent two way connection between the browser and server. This might be your best bet as most Commet techniques are basically hacks to get around the nature of how HTTP and web browsers were originally intended to work (that is, to make small, discrete requests rather than keeping connections open indefinitely). HTML5 web sockets are intended to directly support this feature. Most modern browsers support web sockets, including mobile ones (except Android but I gotta thinks that's coming soon). There are a couple of web socket packages for node.js including WebSocket-Node, and ws. Here is a good intro into web sockets.
Why your code is working in some environments and not others is hard to say at this point. It could be lack of support in the browsers. Mobile devices tend to have less powerful browsers than desktops. I'm not sure about the support for Commet or HTML5 web sockets in mobile Safari (have a look at this).
Keep in mind that any of these techniques create overhead on both the client and the server in order to keep that connection open. This also has impacts on scalability since certain clients are bound to certain servers.