利用 webSocket 与 Swoole 打造一个小型聊天室（协程）

谨言慎行

发布时间：2022-02-22 00:00:19

2797人浏览过

来源于php中文网

原创

前言

前面有写一个异步简单的聊天室，然后想着，就把协程的也弄了吧所以就有了这个文章，其实所有的功能都大差不差，就仅仅几个地方不一样而已，也都是简单的地方。
博文地址：利用 websocket 与 swoole 打造一个小型聊天室 (异步)
本次也没增加功能，就是增加了一个心跳，从前端定时发送一个 ping ，服务端不作反应，仅此而已。

前端页面代码：

<!DOCTYPE html>
<html lang="en">
<head>    
<meta charset="UTF-8">    
<title>打工人聊天室</title>   
<!--需要引入jq 文件--></head><style>    
.content {        
height: 400px;        
max-width: 400px;        
overflow: auto;        
border-radius: 5px;        
border: 1px solid #f0f0f0;    
}</style>
<body>            
<div id="content" class="content">                
<p>聊天区域</p>            
</div>            
你好打工人：<samp id="nickname">昵称</samp> <br>            
本次连接FD: <samp id="fd-samp"></samp> <br>            
<input type="text" id="msg">            
<input type="hidden" id="fd" value="">            
<button id="send" onclick="send()">发送</button>
</body>
</html>

JS 代码：

在服务器信息回执时，会有第一次连接回执，还是服务端发送消息回执的状态区别，通过 msgType 来分辨，如果是第一次连接的回执消息，则把 FD 做一个页面留存，并不显示在聊天消息区，如果收到的是消息回执，就直接显示到聊天消息区。

还有就是，前后端相互通信发送的东西，都是字符串性质最优，我前端处理的方法是先组合成一个对象，然后转 JSON 串。

<script>    
//滚动条最底部    
function scrolltest() {        
var div = document.getElementById("content");        
div.scrollTop = div.scrollHeight;    }    
var wsServer = 'ws://127.0.0.1:9502/websocket';    
var websocket = new WebSocket(wsServer);    
var nickname = Math.random().toString(36).substr(2);    
thisFd = '';    $('#nickname').html(nickname);    
//点击发送    
function send() {        
var msg = $('#msg').val();        
var data = {            
'nickname': nickname,            
'fd': thisFd,            
'data': msg        }        
//生成json 方便后台接收以及使用        
var data = JSON.stringify(data);        
websocket.send(data);        
//然后清空        
$('#msg').val('');    }    
//链接成功    
websocket.onopen = function (evt) {        
var data = {            
'msgType': 'open'        }        
var data = JSON.stringify(data);        
$("#content >p:last-child").after('<p> 服务器已连接,开始聊天吧 </p>');        
websocket.send(data);    };    
//链接断开    
websocket.onclose = function (evt) {        
$("#content >p:last-child").after('<p> 服务器已断开,请重新连接 </p>');    };    
//收到服务器消息    
websocket.onmessage = function (evt) {        
//握手成功后，会接受到服务端返回的fd ，msgType = 1        
//字符串格式化成json        
var data = eval('(' + evt.data + ')');        
// console.log(evt.data);        
switch (data.msgType) {            
case 1:                
thisFd = data.fd;                
$('#fd-samp').html(thisFd);                
$('#fd').val(thisFd);                
break;            case 2:                
if (data.nickname == nickname) {                    
data.nickname = '我';                }                
$("#content >p:last-child").after('<p>' + data.nickname + ' 在 ' + data.time + ' 说：<br>' + data.data + '</p><div class="aritcle_card flexRow">
                                                        <div class="artcardd flexRow">
                                                                <a class="aritcle_card_img" href="/ai/2109" title="AiBiao.cn"><img
                                                                                src="https://img.php.cn/upload/ai_manual/000/000/000/175679984040171.png" alt="AiBiao.cn"  onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a>
                                                                <div class="aritcle_card_info flexColumn">
                                                                        <a href="/ai/2109" title="AiBiao.cn">AiBiao.cn</a>
                                                                        <p>一句话自动生成图表</p>
                                                                </div>
                                                                <a href="/ai/2109" title="AiBiao.cn" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
                                                        </div>
                                                </div>');                
//接收到消息自动触底                
scrolltest();                
break;        }    };    
//服务器异常    
websocket.onerror = function (evt, e) {        
$("#content >p:last-child").after('<p> 服务器异常 </p>');    };    
//心跳,本次新增    
function heartbeat() {        var data = {            
'msgType': 'ping',        }        
//生成json 方便后台接收以及使用        
var data = JSON.stringify(data);        
websocket.send(data);    }    
//30 秒一次    
setInterval(heartbeat, 30000);</script>

服务端代码
协程，都需要在 Co\run(function () {}) 里。

<?php    
//定义获取当前的id函数    
function getObjectId(\Swoole\Http\Response $response) {        
if (PHP_VERSION_ID < 70200) {            
$id = spl_object_hash($response);        
} else {            
$id = spl_object_id($response);        }        
return $id;    }    
Co\run(function () {        
$server = new Co\Http\Server('127.0.0.1', 9502, false);        
$server->set([            
'heartbeat_idle_time'      => 600, 
// 表示一个连接如果600秒内未向服务器发送任何数据，此连接将被强制关闭            
'heartbeat_check_interval' => 60,  
// 表示每60秒遍历一次        
]);        
$server->handle('/websocket', function ($request, $ws) {            
$ws->upgrade();            
global $wsObjects;            
$objectId = getObjectId($ws);            
$wsObjects[$objectId] = $ws;            
while (true) {                
$frame = $ws->recv();                
if ($frame === '') {                    
unset($wsObjects[$objectId]);                    
$ws->close();                    
break;                
} else if ($frame === false) {                    
echo 'error : ' . swoole_last_error() . "\n";                    
break;                } 
else {                    
if ($frame->data == 'close' || get_class($frame) === Swoole\WebSocket\CloseFrame::class) 
{                        
unset($wsObjects[$objectId]);                        
$ws->close();                        
return;                    
}                    
//格式化接收到json                    
$data = json_decode($frame->data);                    
switch ($data->msgType){                        
case 'open':                            
//链接第一次                            
$data = json_encode([                                
'fd' => $objectId,                                
'msgType' => 1  
//代表第一次连接，前端处理fd                            
]);                            
$ws->push($data);                            
break;                        
case 'ping':                            
//接收到心跳 不作回复
//                            
echo  $data->msgType;                            
break;                        
default :                            
// 原基础上不动，增加一些自定义                            
$data->msgType = 2; 
//代表服务器端回复                            
$data->time = date('Y-m-d H-i-s');                            
$data = json_encode($data);                            
foreach ($wsObjects as $obj) {                                
$obj->push($data);                            
}                    
}                
}            }        
});        
$server->start();    
});

代码齐全之后，接下来就只需要在控制台执行以下 PHP 文件就行。

然后前台直接访问你的网站地址，我的是本地 127.0.0.1

多开几个窗口模拟多个用户，然后发送消息测试即可：

你好，打工人。

代码很简单，难度不大，但是可以很简洁的反应出 webScoket 和 Swoole 的一种强大。

Swoole项目如何部署到生产环境

Swoole如何处理WebSocket的握手过程

Swoole的Http\Response对象有哪些常用方法

Swoole怎么在Nginx后获取WebSocket的真实IP

Swoole怎么在WebSocket服务器中验证用户身份

相关专题

PHP高性能API设计与Laravel服务架构实践

本专题围绕 PHP 在现代 Web 后端开发中的高性能实践展开，重点讲解基于 Laravel 框架构建可扩展 API 服务的核心方法。内容涵盖路由与中间件机制、服务容器与依赖注入、接口版本管理、缓存策略设计以及队列异步处理方案。同时结合高并发场景，深入分析性能瓶颈定位与优化思路，帮助开发者构建稳定、高效、易维护的 PHP 后端服务体系。

2026.03.04

AI安装教程大全

2026最全AI工具安装教程专题：包含各版本AI绘图、AI视频、智能办公软件的本地化部署手册。全篇零基础友好，附带最新模型下载地址、一键安装脚本及常见报错修复方案。每日更新，收藏这一篇就够了，让AI安装不再报错！

2026.03.04

Swift iOS架构设计与MVVM模式实战

本专题聚焦 Swift 在 iOS 应用架构设计中的实践，系统讲解 MVVM 模式的核心思想、数据绑定机制、模块拆分策略以及组件化开发方法。内容涵盖网络层封装、状态管理、依赖注入与性能优化技巧。通过完整项目案例，帮助开发者构建结构清晰、可维护性强的 iOS 应用架构体系。

2026.03.03

C++高性能网络编程与Reactor模型实践

本专题围绕 C++ 在高性能网络服务开发中的应用展开，深入讲解 Socket 编程、多路复用机制、Reactor 模型设计原理以及线程池协作策略。内容涵盖 epoll 实现机制、内存管理优化、连接管理策略与高并发场景下的性能调优方法。通过构建高并发网络服务器实战案例，帮助开发者掌握 C++ 在底层系统与网络通信领域的核心技术。

2026.03.03

Golang 测试体系与代码质量保障：工程级可靠性建设

Go语言测试体系与代码质量保障聚焦于构建工程级可靠性系统。本专题深入解析Go的测试工具链（如go test）、单元测试、集成测试及端到端测试实践，结合代码覆盖率分析、静态代码扫描（如go vet）和动态分析工具，建立全链路质量监控机制。通过自动化测试框架、持续集成（CI）流水线配置及代码审查规范，实现测试用例管理、缺陷追踪与质量门禁控制，确保代码健壮性与可维护性，为高可靠性工程系统提供质量保障。

2026.02.28

Golang 工程化架构设计：可维护与可演进系统构建

Go语言工程化架构设计专注于构建高可维护性、可演进的企业级系统。本专题深入探讨Go项目的目录结构设计、模块划分、依赖管理等核心架构原则，涵盖微服务架构、领域驱动设计(DDD)在Go中的实践应用。通过实战案例解析接口抽象、错误处理、配置管理、日志监控等关键工程化技术，帮助开发者掌握构建稳定、可扩展Go应用的最佳实践方法。

2026.02.28

Golang 性能分析与运行时机制：构建高性能程序

Go语言以其高效的并发模型和优异的性能表现广泛应用于高并发、高性能场景。其运行时机制包括 Goroutine 调度、内存管理、垃圾回收等方面，深入理解这些机制有助于编写更高效稳定的程序。本专题将系统讲解 Golang 的性能分析工具使用、常见性能瓶颈定位及优化策略，并结合实际案例剖析 Go 程序的运行时行为，帮助开发者掌握构建高性能应用的关键技能。

2026.02.28