标签：websocket 什么 服务器 WebSocket 80 客户端 webSocket
一. 为什么需要 WebSocket?
在开发的过程中，如开发聊天室，或者客服聊天系统时，常常有新的客户端(用户)连接进来，也有老的客户端(用户)退出，
客户端A进行群发消息，其他的客户端进行展示客户端A发送的消息,
采用Http 协议进行处理时，需要在客户端发送一个请求，然后服务器进行响应数据，客户端拿着服务器响应过来的数据，
进行处理，最后展示处理好的数据。 请求是单向的，如果不发送请求，就不能获取数据。
为了更快，更准确地显示消息，我们常常采用轮询的方式，从服务器获取数据。
轮询方式指的是在JS客户端编写定时程序，每隔固定的一段时间往服务器发送请求，询问服务器是否有新消息。
如 每隔10s，采用ajax的方式，往服务器发送一条请求，获取服务器新的消息。
这种方式，实时性不够，另外，频繁地请求，也会给服务器造成巨大的压力。
我们希望，有一种新的模式，不仅仅是客户端请求服务器端的响应数据，也可以让服务器端自动推送最新的消息。
当有新的用户连接进来时(服务器最先知道客户端连接进来了),服务器自动把这个新连接用户连接进来的消息，推送给客户端，
即 服务器告诉客户端，“Xxx连接进来了”。
当有老的用户退出时，服务器自动把这个消息推送给客户端，即服务器告诉客户端，“Xxx退出了”。
当客户端A发送消息之后，服务器自动把这个消息推送给其他的客户端， 即服务器告诉客户端，“Xxx 发送了一条新消息: Xxx发送的消息内容”。
这样，实时性会显著地提升，而且也会减轻服务器的压力。(以前，每隔10s,不管有没有用户的状态发生改变，都会进行请求，现在，如果用户的状态没有改变，服务器就不进行处理。 1分钟用户状态没有改变，那么这一分钟服务器就不进行任何操作，10分钟用户状态不改变，那么这10分钟服务器就不进行任何操作)
这样的技术，叫做 WebSocket。
WebSocket 于2011年被IETF定为标准RFC 6455， 是在 Html5 时出现的一种新的标准，允许服务器向客户端推送数据。
在WebSocket里，浏览器和服务器只需要一次握手，就可以创建持久性连接，并且允许双向传输数据。
二. WebSocket 的 API
二.一 WebSocket 的协议地址写法
以前 Http的协议是， http://example.com:80/context/path
加密之后的，是 https://example.com:80/context/path
WebSocket 协议是， ws://example.com:80/context/path, ws 是 websocket的简写。
也可以进行加密， wss://example.com:80/context/path
加密和不加密的区别:
二.二 创建 WebSocket 对象
var webSocket=new WebSocket(ws协议的url);
如 创建 本地 ip地址的 WebSocket对象
var webSocket=new WebSocket("ws://127.0.0.1:80/WebSocket/websocket/chat");
WebSocket 对象，需要浏览器的支持
Chrome
Firefox
IE >= 10
Sarafi >= 6
Android >= 4.4
iOS >= 8
建议使用 Chrome 和 Firefox 浏览器 。
二.三 WebSocket 的状态值 readyState
WebSocket对象，有一个属性 readyState, 该属性有四个值，0,1,2,3 代表不同的状态。
可以通过 WebSocket创建出来的对象， 即 webSocket.readyState 即可取出状态。
二.四 WebSocket的四种事件
二.四.一 四种事件
WebSocket共提供了四种事件，来接收处理服务器对客户端的响应处理。
open 事件，连接建立时触发
close 事件， 连接关闭时触发，包括手动退出和浏览器关闭
message 事件 客户端接收服务器数据时触发
error 事件， 通信遇到错误时，触发
这四种事件，分别对应了四种事件的处理程序。 （仍然使用的是二.二 创建的 webSocket 对象）。
open 事件 对应 webSocket.onopen
close 事件 对应 webSocket.onclose
message 事件对应 webSocket.onmessage
error 事件对应 webSocket.onerror
二.四.二 事件处理代码
以 open 事件进行举例。
二.四.二.一 普通方式
//创建 WebSocket 对象
var webSocket=new WebSocket("ws://127.0.0.1:80/WebSocket/websocket/chat");
webSocket.onopen = function () {
webSocket.send('Hello WebSocket!');
console.log("连接建立");
}
二.四.二.二 addEventListener() 方式
//创建 WebSocket 对象
var webSocket=new WebSocket("ws://127.0.0.1:80/WebSocket/websocket/chat");
webSocket.addEventListener('open', function (event) {
webSocket.send('Hello WebSocket!');
console.log("连接建立");
});
通常采用第一种方式即可。
二.五 WebSocket的方法 send()和close()
WebSocket 提供了两种方法，
一种是 send(text) 方法， 用于向服务器端发送数据，
如：
webSocket.send("你好啊服务器,我是两个蝴蝶飞");
另外一种是 close() 方法， 用于手动关闭浏览器连接
如:
webSocket.close();
三. WebSocket 流程分析
(参考了 黑马培训教程的 即时通信技术-Websocket实现在线聊天室 资料)
三.一 浏览器端发送请求
HEA: GET WebSocket/websocket/chat HTTP/l.l
Host: localhost
Upgrade: webaocket
Conection: Upqrade
oriqin: http://127.0.0.1:80
Pragma: no-cache
Cache-Control: no-cache
Seo-WebSocket-Key:. tSYYnx6EFK/hevZE8JbLaQ--
Sec-KebSocket -Version: 13
vindow. bits. -webkit-deflate-frame
Hoøt: 127.0.0.1:10000
Sec-WebSocket -Extenaiona: permeaaqe-deflater elient. aж
Uaer-Agenti Mozilla/5.0 (Windown NT 6.1; WOW64) AppleMebKit/537.36 (KHTNL, 1ike Gecko)
Chrome/35.0.1916.138 safari/537.36
解释字段如下:
(1)、Upgrade:表示的意思是“客户端准备使用websocket协议进行通信，服务端如果支持的话，咱们就换websocket协议吧!”。
(2)、sec-websocket-version: 是指浏览器支持的websocket版本号。需注意的是这里不会出现912的版本号，
因为websocket协议规定9- 12是保留字段。
(3)、sec-websocket -key:是一一种验证服务 端是不是支持websocket的验证算法。
与Response中的sec-websocket -accept是对应的。
(4)、sec-websocket-accept 与sec-websocket-key的对应算法是:
sec . websocket -accept = base64 (hsal (sec websocket -key+ 258EAFA5-E914-47DA-95CA C5AB0DC85B11))
如果返回的sec-websocket-accept不对，在chrome下 会出现Sec-WebSocket -Accept dismatch的错误。
(5)、HTTP Staus: Response返回的是101， 代表服务端说“我们双方后面就按照websocket协议来进行数据传输吧!”
三.二 服务器解析
HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: server-random-string
三.三 传输数据，双向传输
客户端发送数据: 服务器， 两个蝴蝶飞您好
待编码数据:两个蝴蝶飞您好
回复客户端数据: 两个蝴蝶飞您好
三.四 客户端主动断开连接和服务器端主动断开连接
当客户端主动断开连接时，客户端会发送http请求，请求断开连接，服务器端接收请求之后，断开连接。
当服务器主动断开连接时，直接断开连接，所有客户端得到通知。
谢谢您的观看!!!
参考文章：https://blog.csdn.net/yjltx1234csdn/article/details/105771054
标签：websocket,什么,服务器,WebSocket,80,客户端,webSocket 来源： https://www.cnblogs.com/wangjunjiehome/p/16283846.html
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。