0

0

Think-Swoole教程之WebSocket的介绍、事件和数据发送

藏色散人

藏色散人

发布时间:2020-10-16 14:33:49

|

3717人浏览过

|

来源于阿dai哥

转载

Think-Swoole教程之WebSocket的介绍、事件和数据发送

什么是 WebSocket

WebSocket 协议是基于 TCP 的一种新的网络协议,使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。

为什么需要 WebSocket

因为 HTTP 的通信只能由客户端发起。

WebSocket有哪些特点

  • 建立在TCP协议之上的

  • 性能开销小,通信高效

  • 客户端可以与任意的服务器进行通信

  • 协议标识:ws、wss

  • 持久化网络通信协议

WebSocket 使用场景

社交聊天、弹幕、多玩家游戏、协同编辑、股票基金实时报价、体育实况更新、视频会议聊天、基于位置的应用、在线教育等需要高实时性的运用场景。

在 WebSocket 之前,传统方式我们想要做聊天程序,可能会使用 JavaScript 定时器,每隔一秒钟发送一次 HTTP 请求到服务器,查询有没有新消息。

有了 WebSocket ,客户端通过浏览器以 HTTP 方式向服务端发送 WebSocket 连接请求,然后服务器发出回应,这个过程通常称为“握手” 。浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道,将协议升级为 WebSocket,有新消息的话,服务端主动将消息推送给客户端。

SocketIO 又是什么

WebSocket 是 HTML5 最新提出的规范,虽然主流浏览器都已经支持,但仍然可能有不兼容的情况,为了兼容所有浏览器,给程序员提供一致的编程体验, SocketIO 将 WebSocket 、AJAX 和其它的通信方式全部封装成了统一的通信接口,也就是说,我们在使用 SocketIO 时,不用担心兼容问题,底层会自动选用最佳的通信方式。因此说,WebSocket 是 SocketIO 的一个子集,Think-Swoole 中是按照 SocketIO 进行解析发送到服务端的数据。

在 ThinkPHP 6 中开启 WebSocket 服务

1、配置文件 config/swoole.php 中“websocket. enable”设置为 true。

2、创建监听事件,创建WsConnect、WsClose、WsTest(这个可任意命名,和客户端须对应起来),在项目根目录分别输入如下命令:

php think make:listener WsConnect
php think make:listener WsClose
php think make:listener WsTest

app/listener 目录下会生成刚才创建的监听类文件,在对应的事件类中可写入业务逻辑。我们这里先打印 $event 这个变量。Connect 事件中的 $event 是 app\Request 请求对象,Test自定义消息接收事件的 $event 是客户端发送过来的消息。

PhotoG
PhotoG

PhotoG是全球首个内容营销端对端智能体

下载

3、在 app/event.php 中的数组 listen 键中定义事件监听类:

app/event.php
'listen'    => [
        'AppInit'  => [],
        'HttpRun'  => [],
        'HttpEnd'  => [],
        'LogLevel' => [],
        'LogWrite' => [],
        //监听连接,swoole 事件必须以 swoole 开头
        'swoole.websocket.Connect' => [
            app\listener\WsConnect::class
        ],
        //监听关闭
        'swoole.websocket.Close' => [
            \app\listener\WsClose::class
        ],
        //监听 Test 场景
        'swoole.websocket.Test' => [
            \app\listener\WsTest::class
        ],
    ],

swoole.websocket.Connect:客户端与服务器建立连接并完成握手事件,即 Swoole 中的 onOpen 事件。在这里记录你自己程序用户与客户端的连接ID(fd)等。非必须,建议定义。

swoole.websocket.Close:客户端连接关闭事件,非必须。

swoole.websocket.Test:自定义的 Test 事件;用于接收客户端发送的 test 事件的消息。一个项目中可以定义多个 Test 事件,例如聊天、定位、客服功能事件,则可对应为 Test1、Test2、Test3等。

WebSocket 的事件也可以在 config/swoole.php 配置文件的“websocket. listen”进行配置:

'listen' => [
    // 首字母大小写都可以;值应该是字符串非数组
    'connect' => 'app\listener\WsConnect',
    'close'   => 'app\listener\WsClose',
    'test'    => 'app\listener\WsTest'
],

4、项目根目录开启服务:php think swoole start 即可,底层会自动判断当前请求是 HTTP 还是 WebSocket。

客户端与服务端建立连接

现在我们做一个 HTML 页面,通过 HTML5 WebSocket 向我们的服务器端建立连接。在任意地方新建 test.html,内容如下:




    
    Document



消息:
接收者:



HTML5 WebSocket 有关介绍,可以访问这里进行学习。

前端代码中 var ws = new WebSocket("ws://127.0.0.1:9501/"); 我的服务器是在本地,swoole.php 配置文件中配置的端口号是 9501,所以访问127.0.0.1:9501,ws 是 WebSocket 协议,与 HTTP、HTTPS 一样,它有 WS 和 WSS 协议。ws.onmessage 可以接受消息。

接下来通过浏览器访问这个 HTML 页面,并打开浏览器调试控制台,可以看到连接成功的字样,以及服务端打印出来的参数:

2b235a69fcf61064d0198068dddf2c5.png

然后我们在刚才创建的 HTML 页面的输入框中发送消息,控制台中打印出了我们的信息:

562540da341607e0948370fdd3eb9d6.png

Swoole 监听服务终端中,也收到了我们发送过来的消息:

fc0f82d0d7d28e88f60c714e68ec9f0.png

这是因为我们在 app/listener/WsTest 打印了 $event 变量。

最后说明一下前端页面中 ws.send(JSON.stringify(['test',{to:to,message:message}])); 这段代码,JSON.stringify() 的作用是将 JavaScript 对象转换为 JSON 字符串,to 和 message 属性是我们自定义的,test 是后端定义的 Test 事件,这个名称一定和后端对应起来。由于think-swoole中是按照 SocketIO 进行解析发送过来的数据,所以你发送的数据应该是 “[‘事件名’, 真正要发送的数据]” 的字符串形式:第一个参数的 test 就是对应服务器端的Test 事件,用于区分更多场景的实时通信逻辑业务;第二个参数才是你真正发送的数据,可以是字符串、数据、对象,服务器端 $event 参数获取的就是它。

相关专题

更多
php文件怎么打开
php文件怎么打开

打开php文件步骤:1、选择文本编辑器;2、在选择的文本编辑器中,创建一个新的文件,并将其保存为.php文件;3、在创建的PHP文件中,编写PHP代码;4、要在本地计算机上运行PHP文件,需要设置一个服务器环境;5、安装服务器环境后,需要将PHP文件放入服务器目录中;6、一旦将PHP文件放入服务器目录中,就可以通过浏览器来运行它。

2634

2023.09.01

php怎么取出数组的前几个元素
php怎么取出数组的前几个元素

取出php数组的前几个元素的方法有使用array_slice()函数、使用array_splice()函数、使用循环遍历、使用array_slice()函数和array_values()函数等。本专题为大家提供php数组相关的文章、下载、课程内容,供大家免费下载体验。

1632

2023.10.11

php反序列化失败怎么办
php反序列化失败怎么办

php反序列化失败的解决办法检查序列化数据。检查类定义、检查错误日志、更新PHP版本和应用安全措施等。本专题为大家提供php反序列化相关的文章、下载、课程内容,供大家免费下载体验。

1513

2023.10.11

php怎么连接mssql数据库
php怎么连接mssql数据库

连接方法:1、通过mssql_系列函数;2、通过sqlsrv_系列函数;3、通过odbc方式连接;4、通过PDO方式;5、通过COM方式连接。想了解php怎么连接mssql数据库的详细内容,可以访问下面的文章。

952

2023.10.23

php连接mssql数据库的方法
php连接mssql数据库的方法

php连接mssql数据库的方法有使用PHP的MSSQL扩展、使用PDO等。想了解更多php连接mssql数据库相关内容,可以阅读本专题下面的文章。

1418

2023.10.23

html怎么上传
html怎么上传

html通过使用HTML表单、JavaScript和PHP上传。更多关于html的问题详细请看本专题下面的文章。php中文网欢迎大家前来学习。

1234

2023.11.03

PHP出现乱码怎么解决
PHP出现乱码怎么解决

PHP出现乱码可以通过修改PHP文件头部的字符编码设置、检查PHP文件的编码格式、检查数据库连接设置和检查HTML页面的字符编码设置来解决。更多关于php乱码的问题详情请看本专题下面的文章。php中文网欢迎大家前来学习。

1447

2023.11.09

php文件怎么在手机上打开
php文件怎么在手机上打开

php文件在手机上打开需要在手机上搭建一个能够运行php的服务器环境,并将php文件上传到服务器上。再在手机上的浏览器中输入服务器的IP地址或域名,加上php文件的路径,即可打开php文件并查看其内容。更多关于php相关问题,详情请看本专题下面的文章。php中文网欢迎大家前来学习。

1306

2023.11.13

高德地图升级方法汇总
高德地图升级方法汇总

本专题整合了高德地图升级相关教程,阅读专题下面的文章了解更多详细内容。

43

2026.01.16

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
swoole进程树解析
swoole进程树解析

共4课时 | 0.2万人学习

Swoole系列-从0到1-新手进阶
Swoole系列-从0到1-新手进阶

共29课时 | 1.4万人学习

关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号