随着互联网及移动设备的普及,人们越来越需要实时协作工具来提高工作效率。在这种背景下,实时协作工具中的即时通讯和协同编辑等功能成为越来越受欢迎的需求。本文将介绍如何借助PHP和WebSocket实现基于Web的实时协作工具。同时将提供相关代码实例。
WebSocket简介
WebSocket是一种新型的Web通信协议,它基于TCP协议而不是HTTP协议,能够提供双向通信的能力。相比于Ajax轮询技术,WebSocket具有实时性强、通信效率高等优点。
在此之前,如果想要实时地推送数据到浏览器端,通常会使用长轮询技术,即客户端向服务器发送一个请求并一直等待响应,直到有新数据时再返回响应。这种方式存在的问题是请求和响应是成对的,如果请求频繁则会给服务器带来很大的压力。而WebSocket在通信建立后,可以保持长时间的连接,可以实现服务器主动向客户端推送消息的功能。
WebSocket的通信协议采用类似HTTP的握手来启动一个新的会话,然后两端进行双向数据传输。WebSocket通信协议可以通过正常的HTTP协议建立连接,然后转换到WebSocket连接,避免了通过特殊的方式或端口连接的需求。
WebSocket的实现
首先,在服务端的PHP代码中,我们需要创建一个WebSocketServer类,并实现相关方法:
class WebSocketServer {
public function __construct($host, $port){
$this->host = $host;
$this->port = $port;
$this->sockets = array();
$this->users = array();
}
public function run(){
$server = socket_create(AF_INET, SOCK_STREAM, SOL_TCP);
socket_bind($server, $this->host, $this->port);
socket_listen($server);
$this->sockets[] = $server;
echo "WebSocket服务器运行在 $this->host:$this->port
";
while(true){
$new_sockets = $this->sockets;
$write = NULL;
$except = NULL;
socket_select($new_sockets, $write, $except, NULL);
foreach($new_sockets as $socket){
if ($socket == $server){
$client = socket_accept($server);
$this->sockets[] = $client;
$this->users[] = array('socket'=>$client);
} else {
$bytes = @socket_recv($socket, $buffer, 1024, MSG_DONTWAIT);
if ($bytes == 0) {
$index = $this->find_user_by_socket($socket);
if ($index >= 0) {
array_splice($this->users, $index, 1);
}
socket_close($socket);
$key = array_search($socket, $this->sockets);
array_splice($this->sockets, $key, 1);
} else {
$index = $this->find_user_by_socket($socket);
if($index >= 0) {
$msg = $buffer;
$this->handle_message($msg, $this->users[$index]);
}
}
}
}
}
}
private function find_user_by_socket($socket){
$found = -1;
foreach($this->users as $index => $user){
if ($user['socket'] == $socket){
$found = $index;
break;
}
}
return $found;
}
private function handle_message($msg, $user) {
// 处理新消息
}
}
登录后复制
WebSocket协议中,一条消息以4~10字节的长度头开始,后面是实际的数据。在上面的代码中,我们需要解析这个长度头,然后读取对应长度的数据部分即可。
private function handle_message($msg, $user) {
if(strlen($msg) === 0) {
return;
}
$code = ord(substr($msg, 0, 1)) & 0x0F;
switch ($code){
case 0x01: // 文本数据
$msg = substr($msg, 1);
break;
case 0x02: // 二进制数据
$msg = substr($msg, 1);
break;
case 0x08: // 连接关闭
$index = $this->find_user_by_socket($user['socket']);
if ($index >= 0) {
array_splice($this->users, $index, 1);
}
socket_close($user['socket']);
$key = array_search($user['socket'], $this->sockets);
array_splice($this->sockets, $key, 1);
return;
case 0x09: // ping
case 0x0A: // pong
return;
default:
return;
}
// 处理新消息
}
登录后复制
在handle_message方法中,我们可以处理从客户端收到的新消息,例如转储和发送到其他客户端。
WebSocket的客户端实现
在客户端,我们需要使用JavaScript来创建WebSocket的连接以及发送和接收消息。以下是连接到WebSocket服务器的JavaScript代码:
var ws = new WebSocket("ws://localhost:8080/");
ws.onopen = function() {
console.log("Connected to WebSocket server");
};
ws.onmessage = function(evt) {
console.log("Received message: " + evt.data);
};
ws.onclose = function(evt) {
console.log("Disconnected from WebSocket server");
};
登录后复制
在上面的代码中,我们使用了WebSocket构造函数来创建一个WebSocket对象,并将其连接到WebSocket服务器上。我们还设置了几个事件侦听器(onopen、onmessage和onclose),以便对WebSocket连接状态及收到的消息进行监听。
当我们想要将数据发送到WebSocket服务器时,可以使用WebSocket对象的send方法:
ws.send("Hello, WebSocket server!");
登录后复制
当接收到来自WebSocket服务器的新消息时,会触发onmessage事件,我们可以从事件对象中获取到收到的数据。
实时协作工具的应用
有了WebSocket通信的支持,我们可以进行实际的协作工具应用的开发了。在协作工具中,需要实现如下几个功能:
- 用户登录/注销
- 发送即时聊天消息
- 多用户协同编辑同一文档
- 提交更改反馈给其他用户
我们可以将这些功能分别实现成不同的PHP类并根据实际业务需求进行细化。以下是一个例子:
class WebSocketChat {
private $users = array();
public function onOpen($user){
$this->users[$user['id']] = $user;
$this->sendToAll(array('type'=>'notice','from'=>'System','msg'=>"{$user['name']}进入聊天室"));
}
public function onMessage($user, $msg){
$this->sendToAll(array('type'=>'msg','from'=>$user['name'],'msg'=>$msg));
}
public function onClose($user){
unset($this->users[$user['id']]);
$this->sendToAll(array('type'=>'notice','from'=>'System','msg'=>"{$user['name']}离开聊天室"));
}
private function sendToAll($msg){
foreach($this->users as $user){
$this->send($user, $msg);
}
}
private function send($user, $msg){
socket_write($user['socket'], $this->encode(json_encode($msg)));
}
private function encode($msg){
$len = strlen($msg);
if($len