本文是我在实际工作中用到的Socket通信，关于心跳机制的维护方式，特意总结了一下，希望对朋友们有所帮助。
Socket应用：首先Socket 封装了tcp协议的，通过长连接的方式来与服务器通信，是由服务器和客户端两部分组成的，当客户端成功连接之后，服务器会记录这个用户，并为它分配资源，当客户端断开连接后，服务器会自动释放资源。
但在实际的网络环境中会有很多因素的导致服务器不知道客户端断开，或者客户端不知道服务器宕机，等等，比如网络中使用了路由器、交换机等等；这就带来一个问题：此时此刻服务器如何知道能否同客户端正常通信？解决这个问题的办法就是采用心跳。简单的说就是：在客户端和服务器连接成功后，隔一段时间服务器询问一下客户端是否还在，客户端收到后应答服务器"我还在"，如果服务器超出一定时间（一般40-50秒）未收到客户端的应答，就判定它已经无法通信了，这时候需要释放资源，断开这个客户端用户。
客户端JS代码：
1<!DOCTYPE html> 2<html> 3 4<head lang="en"> 5 <meta charset="utf-8"> 6 <title></title> 7</head> 8 9<body> 10 <h3>WebSocket协议的客户端程序</h3> 11 <button id="btConnect">连接到WS服务器</button> 12 <button id="btSendAndReceive">向WS服务器发消息并接收消息</button> 13 <button id="btClose">断开与WS服务器的连接</button> 14 <div id="val"></div> 15<script type="text/javascript"> 16 var wsClient=null; 17 var lastHealthTime = 0; //记录最近一次心跳更新时间 18 var heartbeatTimer = null;//心跳执行timer 19 var checkTime = 10000; //心跳检查时间间隔-毫秒 10秒 20 var healthTimeOut = 20000;//心跳时间间隔-毫秒 20秒 21 22 var reconnectTimer = null;//重连接timer 23 var reconnectTime = 10000;//重连接时间10秒后 24 var uid = "20"; 25 26 var connectStatus = 3; //状态 27 28 function connect(){ 29 if (connectStatus == 3){ 30 wsClient=new WebSocket('ws://127.0.0.1:8000'); //这个端口号和容器监听的端口号一致 31 console.log("连接中..."); 32 console.log("readyState:"+wsClient.readyState); 33 if (reconnectTimer){ 34 clearTimeout(reconnectTimer); 35 } 36 37 //连接成功 38 wsClient.onopen = function(){ 39 connectStatus = wsClient.readyState; 40 // 表名自己是uid1 41 var data = uid; //1标识连接 42 wsClient.send(data); 43 console.log('ws客户端已经成功连接到服务器上'); 44 msg.innerHTML="连接成功..."; 45 console.log("readyState:"+wsClient.readyState); 46 var time = new Date(); 47 lastHealthTime = time.getTime(); 48 49 if(heartbeatTimer){ 50 clearInterval(heartbeatTimer); 51 } 52 53 heartbeatTimer = setInterval(function(){keepalive(wsClient)}, checkTime); 54 }; 55 56 //收到消息 57 wsClient.onmessage = function(e){ 58 console.log('ws客户端收到一个服务器消息：'+e.data); 59 console.log("readyState:"+wsClient.readyState); 60 val.innerHTML=e.data; 61 var data = e.data; 62 if (data){ 63 var msg_type = data.substr(0,1); 64 var uid = data.substr(1);var time = new Date(); 65 lastHealthTime = time.getTime();//更新客户端的最后一次心跳时间 66 } 67 } 68 69 //错误 70 wsClient.onerror = function(e){ 71 connectStatus = wsClient.readyState; 72 console.log("error"); 73 console.log("readyState:"+wsClient.readyState); 74 msg.innerHTML="连接错误..."; 75 }; 76 77 //关闭 78 wsClient.onclose = function(){ 79 connectStatus = wsClient.readyState; 80 console.log('到服务器的连接已经断开'); 81 msg.innerHTML="连接断开..."; 82 console.log("readyState:"+wsClient.readyState); 83 //n秒后重连接 84 reconnectTimer = setTimeout(function(){ 85 connect(); 86 },reconnectTime); 87 } 88 } 89 } 90 91 btConnect.onclick = function(){ 92 connect(); 93 } 94 btSendAndReceive.onclick = function(){ 95 wsClient.send('Hello Server'); 96 } 97 btClose.onclick = function(){ 98 console.log("断开连接"); 99 console.log(wsClient.readyState); 100 wsClient.close(); 101 } 102 103 104 105 function keepalive(ws){ 106 var time = new Date(); 107 console.log(time.getTime()-lastHealthTime); 108 if ((time.getTime()-lastHealthTime)>healthTimeOut){ 109 msg.innerHTML="心跳超时，请连接断开..."; 110 111 if (heartbeatTimer){ 112 clearInterval(heartbeatTimer); 113 114 //n秒后重连接 115 ws.close(); 116 reconnectTimer = setTimeout(function(){ 117 connect(); 118 },reconnectTime); 119 } 120 } 121 else{ 122 msg.innerHTML="我依然在连接状态"; 123 ws.send(data); 124 } 125 } 126</script> 127<div id="msg"></div> 128</body> 129</html>
服务端代码：
这里我采用的是PHP语言，使用workman来实现的socket服务器端
1<?phprequire_once __DIR__ .'/Autoloader.php'; 2use Workerman\Worker; 3use Workerman\Lib\Timer; 4 5 6define('HEARTBEAT_TIME', 40);//心跳间隔时间 7define('CHECK_HEARTBEAT_TIME', 10); // 检查连接的间隔时间 8// 初始化一个worker容器，监听1234端口 9$worker = new Worker('websocket://0.0.0.0:8000'); 10// 这里进程数必须设置为1 11$worker->count = 1; 12// worker进程启动后建立一个内部通讯端口 13$worker->onWorkerStart = function($worker) 14{ 15 Timer::add(CHECK_HEARTBEAT_TIME, function()use($worker){ 16 $time_now = time(); 17 foreach($worker->connections as $connection) { 18 19 // 有可能该connection还没收到过消息，则lastMessageTime设置为当前时间 20 if (empty($connection->lastMessageTime)) { 21 $connection->lastMessageTime = $time_now; 22 continue; 23 } 24 25 // 上次通讯时间间隔大于心跳间隔，则认为客户端已经下线，关闭连接 26 if ($time_now - $connection->lastMessageTime > HEARTBEAT_TIME) { 27 $connection->close(); 28 } 29 } 30 }); 31}; 32// 新增加一个属性，用来保存uid到connection的映射 33$worker->uidConnections = array(); 34// 当有客户端发来消息时执行的回调函数 35$worker->onMessage = function($connection, $data)use($worker) 36{ 37 $uid = $data; //uid 38 39 //echo 'connection...'.$uid.'\n'; 40 // 判断当前客户端是否已经验证,既是否设置了uid 41 if(!isset($connection->uid)) 42 { 43 if (intval($msg_type) === 1){ //连接 44 //上次收到的心跳消息时间 45 $connection->lastMessageTime = time(); 46 47 // 没验证的话把第一个包当做uid（这里为了方便演示，没做真正的验证） 48 49 $connection->uid = $uid; 50 /* 保存uid到connection的映射，这样可以方便的通过uid查找connection， 51 * 实现针对特定uid推送数据 52 */ 53 $worker->uidConnections[$connection->uid] = $connection; 54 echo 'MSG USER COUNT:'.count($worker->uidConnections); 55 echo '\n'; 56 return; 57 } 58 } 59 else{ 60 if ($connection->uid === $uid){ 61 //服务器收到心跳 62 //echo 'U-heart:'.$connection->uid.'\n'; 63 $connection->lastMessageTime = time(); 64 65 echo 'back send:'; 66 $buffer = $uid; 67 $ret = sendMessageByUid($uid, $buffer); 68 $result = $ret ? 'ok' : 'fail'; 69 // echo $result; 70 } 71 } 72 73}; 74// 当有客户端连接断开时 75$worker->onClose = function($connection)use($worker) 76{ 77 global $worker; 78 if(isset($connection->uid)) 79 { 80 // 连接断开时删除映射 81 unset($worker->uidConnections[$connection->uid]); 82 83 echo 'CLOSE USER COUNT:'.count($worker->uidConnections); 84 echo '-'.$connection->uid.' closed'; 85 echo '\n'; 86 } 87}; 88// 向所有验证的用户推送数据 89function broadcast($message) 90{ 91 global $worker; 92 foreach($worker->uidConnections as $connection) 93 { 94 $connection->send($message); 95 } 96} 97// 针对uid推送数据 98function sendMessageByUid($uid, $message) 99{ 100 global $worker; 101 if(isset($worker->uidConnections[$uid])) 102 { 103 $connection = $worker->uidConnections[$uid]; 104 $connection->send($message); 105 return true; 106 } 107 return false; 108} 109 110// 运行所有的worker（其实当前只定义了一个） 111Worker::runAll();