在一般的发送数据请求的时候都是用的http协议,但是对于类似即时聊天,需要客户端与服务器不间断的交互的时候对于http协议来说就不太适用了。因为http协议无法主动把数据发到客户端,而且客户端发送请求之后就会断开连接,无法达到我们的需求。
而相对于webScoket对于客户端与服务器之间的交互就会很好的适用。WebSocket protocol 是HTML5一种新的协议。它实现了浏览器与服务器全双工通信(full-duplex)。刚开始的握手需要借助HTTP请求完成,建立连接完成之后就会使客户端与服务器之间进行连接。WebSocket是H5出现的一种新的技术,在之前很多即时通信都是用的轮询技术,通过设定一个间隔时间对服务器进行发送请求,以此更新客户端的内容,但是这样无形中就会增加服务器的压力,同时效率也不是很高。
在 WebSocket API,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。在此WebSocket 协议中,为我们实现即时服务带来了两大好处:
1. Header
互相沟通的Header是很小的-大概只有 2 Bytes
2. Server Push
服务器的推送,服务器不再被动的接收到浏览器的request之后才返回数据,而是在有新数据时就主动推送给浏览器。
我们可以用nodejs来搭建一个简易的服务器
在搭建服务器中我们需要一个express模块和ws模块,以上是简易服务器的配置。
在第一次握手的时候需要手动进行连接,在这里设置了一个button进行研究
在点击了页面上的button之后就会对js中的函数进行调用,同时,在开始要new一个WebSocket("ws://127.0.0.1:8080"),这个地址是服务器所对应的一个地址,可以根据需要连接别的地址(如果是局域网,需要连接同一局域网中的),也就是说通过new创建WebSocket对象时,需要指定连接地址url,创建成功后对象就会自动进行连接,并根据连接的结果触发相应的事件。
这是在点击建立连接的button之后所调用的函数,在对服务端发送数据的时候,要在这些函数中进行数据处理。