php websocket_PHP 之websocket实现聊天室功能
时间: 2023-10-17 09:17:59 浏览: 154
想要实现 WebSocket 聊天室功能,需要以下步骤:
1. 创建一个 WebSocket 服务器
使用 PHP 的 Swoole 扩展可以快速创建一个 WebSocket 服务器,代码如下:
```
$server = new Swoole\WebSocket\Server("0.0.0.0", 9501);
// 监听 WebSocket 连接事件
$server->on('open', function (Swoole\WebSocket\Server $server, $request) {
echo "opened: {$request->fd}\n";
});
// 监听 WebSocket 消息事件
$server->on('message', function (Swoole\WebSocket\Server $server, $frame) {
echo "received message: {$frame->data}\n";
});
// 启动服务器
$server->start();
```
2. 处理聊天消息
在上面的代码中,当接收到 WebSocket 消息事件时,会输出消息内容。我们可以根据消息内容来处理聊天室功能。比如,如果消息内容是“加入房间”,我们可以将该用户加入到聊天室中,如果消息内容是“发送消息”,我们就将该消息发送给所有人。代码示例:
```
$server->on('message', function (Swoole\WebSocket\Server $server, $frame) {
$data = json_decode($frame->data, true);
switch ($data['action']) {
case 'join':
// 将用户加入到聊天室
$server->push($frame->fd, json_encode(['action' => 'join', 'message' => '加入聊天室成功']));
break;
case 'send':
// 将消息发送给所有人
foreach ($server->connections as $fd) {
$server->push($fd, json_encode(['action' => 'send', 'message' => $data['message']]));
}
break;
default:
break;
}
});
```
3. 前端页面实现
最后,需要写一个前端页面来连接 WebSocket 服务器,并实现聊天室功能。代码示例:
```
<html>
<head>
<title>WebSocket 聊天室</title>
</head>
<body>
<div>
<input type="text" id="message" placeholder="请输入消息">
<button id="send">发送</button>
</div>
<ul id="messages"></ul>
<script>
var ws = new WebSocket('ws://localhost:9501');
ws.onopen = function(event) {
// 连接成功,发送加入房间消息
ws.send(JSON.stringify({'action': 'join'}));
};
ws.onmessage = function(event) {
var data = JSON.parse(event.data);
switch (data.action) {
case 'join':
// 加入聊天室成功
addMessage('系统消息', '加入聊天室成功');
break;
case 'send':
// 收到消息
addMessage('其他用户', data.message);
break;
default:
break;
}
};
document.getElementById('send').addEventListener('click', function() {
// 发送消息
var message = document.getElementById('message').value;
ws.send(JSON.stringify({'action': 'send', 'message': message}));
document.getElementById('message').value = '';
});
function addMessage(user, message) {
// 添加消息到列表中
var li = document.createElement('li');
li.innerHTML = '<strong>' + user + '</strong>: ' + message;
document.getElementById('messages').appendChild(li);
}
</script>
</body>
</html>
```
以上就是实现 WebSocket 聊天室功能的全部代码。
阅读全文