前端代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
内容:<input type="text" name="msg" id="msg" value="" />
<button onclick="sendMsg()">发送</button>
<script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script>
//创建websocket 对象
var ws = new WebSocket("ws://127.0.0.1:8282"); //当连接准备好时，则触发
ws.onopen = function(e) {
//绑定id
var fromid=getUrlParam('fromid');
var toid=getUrlParam('toid');
var message = '{"type":"bind","fromid":"'+fromid+'","toid":"'+toid+'"}';
ws.send(message);
}; //从服务器收到消息时，该监听器将被调用
ws.onmessage = function(e){
var message = JSON.parse(e.data);
console.log(message);
if(message.type == "say"){
alert(message.msg);
}
} //当连接关闭时，则触发
ws.onclose = function(e) {
console.log(e);
}; //发送数据
function sendMsg(){
var fromid=getUrlParam('fromid');
var toid=getUrlParam('toid');
var msg=$("#msg").val();
var message = '{"type":"say","fromid":"'+fromid+'","toid":"'+toid+'","msg":"'+msg+'"}';
ws.send(message);
} /**
* GET取值,用于接受？传值 可接收汉字 推荐使用
*/
function getUrlParam(name){
// 用该属性获取页面 URL 地址从问号 (?) 开始的 URL（查询部分）
var url = window.location.search;
// 正则筛选地址栏
var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
// 匹配目标参数
var result = url.substr().match(reg);
//返回参数值
return result ? decodeURIComponent(result[]) : null;
}
</script>
</body>
</html>
后端代码：
ps:修改后端代码后请重启服务端 wind上重启cmd窗口
<?php
/**
* This file is part of workerman.
*
* Licensed under The MIT License
* For full copyright and license information, please see the MIT-LICENSE.txt
* Redistributions of files must retain the above copyright notice.
*
* @author walkor<[email protected]>
* @copyright walkor<[email protected]>
* @link http://www.workerman.net/
* @license http://www.opensource.org/licenses/mit-license.php MIT License
*/ /**
* 用于检测业务代码死循环或者长时间阻塞等问题
* 如果发现业务卡死，可以将下面declare打开（去掉//注释），并执行php start.php reload
* 然后观察一段时间workerman.log看是否有process_timeout异常
*/
//declare(ticks=1); use \GatewayWorker\Lib\Gateway; /**
* 主逻辑
* 主要是处理 onConnect onMessage onClose 三个方法
* onConnect 和 onClose 如果不需要可以不用实现并删除
*/
class Events
{
/**
* 当客户端连接时触发
* 如果业务不需此回调可以删除onConnect
*
* @param int $client_id 连接id
*/
public static function onConnect($client_id)
{
// 向当前client_id发送数据
//Gateway::sendToClient($client_id, "Hello $client_id\r\n");
// 向所有人发送
//Gateway::sendToAll("$client_id login\r\n");
} /**
* 当客户端发来消息时触发
* @param int $client_id 连接id
* @param mixed $message 具体消息
*/
public static function onMessage($client_id, $message)
{
$req_data = json_decode($message, true);
//绑定id
if($req_data['type'] == 'bind'){
Gateway::bindUid($client_id, $req_data['fromid']);
$msg='{"type":"say","fromid":"'.$req_data['fromid'].'","toid":"'.$req_data['fromid'].'","msg":"'+msg+'"}';
$message=[
'type'=>'bind',
'fromid'=>$req_data['fromid'],
'toid'=>$req_data['toid'],
'msg'=>'绑定成功'
];
Gateway::sendToUid($req_data['fromid'], json_encode($message,JSON_UNESCAPED_UNICODE));
}
//发送消息
if($req_data['type'] == 'say'){
$message=[
'type'=>'say',
'fromid'=>$req_data['fromid'],
'toid'=>$req_data['toid'],
'msg'=>$req_data['msg']
];
Gateway::sendToUid($req_data['toid'], json_encode($message,JSON_UNESCAPED_UNICODE));
}
} /**
* 当用户断开连接时触发
* @param int $client_id 连接id
*/
public static function onClose($client_id)
{
// 向所有人发送
//GateWay::sendToAll("$client_id logout\r\n");
}
}
效果：