关于websocket制作聊天室的的一些总结
websocket的总结
在一个聊天室系统中,常常使用websocket作为通信的主要方式。
参考地址:https://www.jianshu.com/p/00e...
关于自己的看法:
websocket协议是一种新的tcp协议,与常用的http协议不同的地方在于,无论是客户端还是服务端,都能进行自由通信,双方都比较灵活,不会有局限性。
文中所提到的socket.io包是封装有websocket协议的包,他包含不少服务端处理的代码,兼容性强,主要服务于实时通信。
开始之前,需要构建网络服务,主要用到的包就是socket.io和http服务的包,由于是node的后台,所以需要设置一个进行监听的端口,方便在浏览器中调试。
/*app.js*/ /*构建http服务*/ var app = require('http').createServer() /*引入socket.io*/ var io = require('socket.io')(app); /*定义监听端口,可以自定义,端口不要被占用*/ var PORT = 8081; /*监听端口*/ app.listen(PORT);
后台系统为nodejs搭载
主要应用在聊天系统中socket.io中的方法:
- socket.emit()
- socket.on()
- io.sockets.emit()
对于第一种,socket.emit()方法主要是在客户端和服务端之间进行信息请求,例如客户端向服务端发送请求或者服务端向客户端进行反馈请求,这两种情况下主要用到的方法。
需求场景:客户端上,用户输入账号密码进行登陆,服务端怎么识别?
(1)首先是客户端获取到用户在输入框中的信息,然后对服务端进行发送信息。
socket.emit('login',{username:uname})
代码块中,login为自定义方法名,其后是传送的数据,项目中只考虑到用户名的输入,所以保存为一个对象发送给服务端,这里用到了socket.emit()方法,是客户端----->服务端的请求。
(2)服务端对客户端所发送的请求进行处理
socket.on('login',function(data){ /*登陆验证等操作*/ })
在这里,通过socket.on来接受客户端所传递的数据,为相同方法名,其后跟的function函数为登陆验证的具体操作,比如用户验证是否存在。
(3)服务端验证成功了,把反馈信息发送给客户端。
通过上面知道,一端向另一端发送请求的时候,需要用到socket.emit()方法,但是这次是服务端向客户端进行发送消息。
socket.emit('loginSuccess',data)
这里,把之前客户端所发送的请求,再次返回去,让客户端进行操作。
(4)客户端接收返回结果
接收的方法,还是socket.on(),不过这次是客户端接收服务端所传递回来的信息。
socket.on('loginSuccess',function(data){ if(data.username === uname){ checkin(data) }else{ alert('用户名不匹配,请重试') } }) function checkin(data){ /*隐藏登陆界面,显示聊天主页*/ $('.login-wrap').hide('slow'); $('.chat-wrap').show('slow'); }
通过以上4步,一次成功的登陆请求就成功了。
关于全频道广播功能
项目中提到了全频道的广播的功能,而io.sockets.emit的定义是服务端进行全频道广播,也就是对所有客户端进行广播,也跟我们常常在聊天中收到的官方推送一样。
io.sockets.emit('leave',username)
当用户进入或者离开时,会进行全频道广播,也就是通过io.sockets.emit方法进行。
最后感谢@一岑不再博主所写的demo项目,让我受益匪浅。
一岑博主主要文章传送门:链接描述